# Design und User Research

# 📖 Design für die vielen – wie Human-Centered Design Nutzer*innen in den Fokus rückt

Eileen Wagner spricht im Interview über Human-Centered Design – und darüber, was das Designprinzip für Public Interest Tech bereithalten kann.

*Dein Steckenpferd ist Human Centered Design – was ist das?*

Human-Centered Design (HCD), manchmal auch unter “Design Thinking” bekannt, ist ein Sammelbegriff für Designmethoden, die sich durch eine empirische Herangehensweise auszeichnen. Nutzende werden als Expert\*innen befragt und das Produkt wird auf Basis der Ergebnisse entwickelt. Sind die Bedürfnisse von Nutzenden erfüllt, ist das Design gut.

Dabei beinhaltet HCD einen ganzen Wertekanon – von Empathie und Optimismus bis dahin, aus Fehlern zu lernen, auszuprobieren statt zu diskutieren und sich auch in Ambivalenzen wohlzufühlen. Im HCD muss niemand Expert\*in sein, um etwas gut zu machen. Ganz im Gegenteil: Unwissen und Neugier können sogar eine Stärke sein!

*Was hat Human-Centered Design mit Public Interest Tech zu tun?*

Wie auch der Begriff “Public Interest Tech” kommt HCD aus den USA. Ursprünglich ging es bei Public Interest Tech darum, zum Beispiel die Interaktion zwischen Bürger\*innen und der Regierung zu vereinfachen und darum, amtliche Prozesse und Tools tatsächlich nutzbar zu machen. Das sind die gleichen Werte, die auch HCD vertritt.

Ein gutes Beispiel ist die Herangehensweise von [Code for America](https://www.codeforamerica.org/), eine der ersten Public-Interest-Tech-Organisationen. Dort geht es nicht nur darum, dass Code und Daten stimmen, sondern ob sie verständlich und zugänglich präsentiert werden, denn nur so haben Nutzer\*innen wirklich etwas davon.

In Deutschland ist HCD weniger verbreitet, denn hier gibt es eher traditionelle Software-Unternehmen, die Prozesse weniger iterativ angehen. Gerade bei Public Interest Tech und den vielen ehrenamtlichen Open-Source-Entwickler\*innen herrscht eine ganz andere Kultur vor, sodass bisher wenig mit Prinzipien des HCD gearbeitet wird. Der Ruf von HCD ist eben etwas Silicon Valley – zurecht!

*Technologie wird uns nicht retten. Aber vielleicht Design? Denn Design kann dabei helfen, das große Ganze zu sehen und auf diese Weise neue Lösungswege aufzeigen. Wie funktioniert das?*

Man tappt leicht in die Falle des Techno-Solutionism – also das Denken, dass Technologie immer die Lösung für alles ist – und ich finde, Design kann diese Perspektive etwas eindämmen. Design fragt: Wem nützt das Tool? Wie soll es genau funktionieren? Was passiert davor? Und was passiert danach? Wie passt das Produkt ins Gesamtsystem?

Auf diese Weise erreicht man, dass ein **Produkt nicht einfach auf den Markt gebracht wird, sondern dass es genau dort landet, wo es benötigt wird** – bei Nutzer\*innen, die schon darauf warten. Design ist also ein mächtiges Werkzeug. Aber wie heißt es so schön: „Wer als Werkzeug nur einen Hammer hat, sieht in jedem Problem einen Nagel.“ Natürlich löst Design genauso wenig wie Technologie realpolitische oder soziale Probleme. Darauf müssen wir als Public Interest Technologists immer achten.

*Kannst du Beispiele dafür nennen, wie Design innovative Lösungswege aufzeigt?*

Ein super Beispiel kommt von Code for America. In Kalifornien gibt es ein Onlineportal für Lebensmittelmarken – “[GetCalFresh](https://www.getcalfresh.org/)”. Die Entwickler\*innen haben sich in diesem Fall ganz genau angesehen, in welchem Kontext diese Marken benötigt werden. Also versuchen sie zu erfahren, wie die Lebenswirklichkeit der Menschen, die sie beziehen, aussieht und schauen dann, wie sie in diesen bestimmten Kontext hineinarbeiten können, damit das Portal am Ende für sie funktioniert.

Dafür haben sie verschiedene User Research Studien gemacht, [zum Beispiel zum Dokumentenupload](https://www.codeforamerica.org/news/overcoming-barriers-how-getcalfresh-helps-applicants-submit-verifications). Das Ergebnis sieht so aus, dass bei “GetCalFresh” nicht gleich bei der Anmeldung alle Dokumente hochgeladen werden müssen, die den Bedarf der Person nachweisen. Das macht die Anmeldung um einiges einfacher, denn viele Menschen haben einfach keinen Scanner zuhause. Sie können sich trotzdem anmelden und die Dokumente einfach nachreichen. Das klingt erst einmal nicht nach einem besonders ausgefeilten Feature, aber viele kleine Dinge können den Prozess maßgeblich beeinflussen und am Ende dafür sorgen, dass ein gutes und nützliches Ergebnis entsteht, das auf die bestehenden Bedürfnisse abgestimmt ist. Ich empfehle die ganze Reihe von [Case Studies](https://www.codeforamerica.org/news/archive?author=eric-giannella) von diesem Team, sie sind lesenswert!

*Public Interest Tech hinterfragt die Art und Weise, in der Software entwickelt wird und stellt eine Alternative dafür dar. Kann mit HCD eine neue, stärker an Gemeinwohl orientierte Wertorientierung in der Software-Entwicklung erreicht werden?*

Der Designdiskurs des 20. Jahrhunderts ist sehr kontrovers. Insgesamt werden viele verschiedene Ansprüche an Design formuliert, zum Beispiel der, dass Design nicht nur menschenzentriert sondern auch umweltzentriert sein soll. Und einige Stimmen sagen sogar, Design brauche überhaupt keine Methodologie.

Aus meiner Sicht ist HCD nicht an sich gut oder schlecht, es ist ein Werkzeug, das auf unterschiedliche Weise eingesetzt werden kann. Es berücksichtigt klare Werte, aber die konkreten Ergebnisse kommen immer aus den übergeordneten Zielen und der konkreten Herangehensweise.

Dark Patterns beispielsweise sind aus ethischer Sicht natürlich nicht gut, aus Designsicht erfüllen sie aber ihren Zweck. Und warum sind denn Google und Facebook so erfolgreich? Zum großen Teil wegen des UX Designs! Da kann man sich fragen: Wer ist daran Schuld? Sind es die Designer\*innen, die im Sinne des Unternehmenszwecks designen, oder ist es der Unternehmenszweck?

Deswegen denke ich, dass nicht die Methodologie von HCD überarbeitet sondern die Ziele neu definiert werden müssen. Denn mit den richtigen Zielen ist HCD ein mächtiges Werkzeug.

Die Geschichte von HCD ist spannend, aber nicht unproblematisch. Sie ist sehr US-amerikanisch, sehr corporate – und das gefällt nicht allen. Die Frage, die wir stellen müssen, lautet deshalb: **Wie können wir Teile der Methodologie übernehmen, ohne die Werte des Silicon Valleys eins zu eins mit zu übernehmen?**

*Was sind neue Entwicklungen in HCD, die auch für Public Interest Tech interessant sein könnten?*

Da geht es aktuell in verschiedene Richtungen. Ein interessanter Ansatz ist beispielsweise “[Consequence Scanning](https://doteveryone.org.uk/project/consequence-scanning/)”. Hierbei werden Folgen des Designs so früh wie möglich betrachtet und abgeschätzt.

Bei der Betrachtung der Zielgruppen lautet eine neue Idee: “[Personas non gratas](https://simplysecure.org/designunderpressure/#methods)”. Im Normalfall werden im Designprozess ja sogenannte Personas als idealtypische Zielgruppe entworfen. Bei der *Persona non grata* geht es hingegen um die Menschen, die nicht direkt als Zielgruppe geplant sind, das Produkt aber trotzdem nutzen werden.

Auch spannend ist die “[Design Justice](https://designjustice.org/read-the-principles)” Bewegung. Der Gedanke dahinter ist, dass Designer\*innen nicht den Alleinanspruch auf gute Ideen haben. Aus diesem Grund sollten alle Betroffenen an einem Design arbeiten und Lösungen im Co-Design entwerfen. Das ist besonders wichtig, wenn es einen großen Unterschied in den Machtverhältnissen gibt. Aus der Entwicklungszusammenarbeit kennen wir genügend Beispiele, in denen Institutionen aus dem globalen Norden sich Lösungen für Menschen im globalen Süden überlegen, welche diesen dann einfach vorgesetzt werden, ohne dass ihre Bedürfnisse erfragt und einbezogen wurden. Oder aber die Bedürfnisse wurden erfragt, aber die Betroffenen haben trotzdem kein Entscheidungsrecht für Lösungen, die ihr Leben beeinflussen. Mit Co-Design wird versucht, das von Anfang an zu vermeiden.

*Wie kann man es schaffen, einen Human Centered Ansatz flächendeckend in der Technologieentwicklung durchzusetzen? Wo sind die Hürden?*

Ich denke, HCD wird sich in der IT früher oder später durchsetzen, denn es ist schlicht und einfach profitabel. Die Frage ist deshalb eher: Wie schaffen wir es, dass es flächendeckend auch in Public Interest Technologien und im öffentlichen Sektor Anwendung findet?

Fördermittelgeber müssen verstehen, dass HCD nicht das Sahnehäubchen sondern grundlegend für gute Technologie ist. Deswegen sollte es sich in viel mehr Förderprogrammen wiederfinden. Und HCD benötigt dringend auch mehr Fürsprache: **Viele Menschen reden enthusiastisch über Design und viele Menschen sprechen begeistert von Public Interest Tech. Das Problem ist, dass das in der Regel nicht dieselben Menschen sind.** Public Interest Tech und HCD können und sollen voneinander lernen und gemeinsam wachsen. Dafür braucht es gemeinsame Arbeit und mehr persönliche Verbindungen.

Eine weitere Herausforderung sehe ich in Fragen der Kultur. Wir müssen uns fragen, was HCD im deutschen Kontext eigentlich ist. Das Konzept sollte definiert und übersetzt, nicht als reine Imitation der US-amerikanischen Version verstanden werden. Wenn wir das schaffen, kann HCD einen großen Beitrag zur Entwicklung von Public Interest Technologien in Deutschland spielen.

*Eileen Wagner war von 2015 bis 2017 als Content-Managerin im Team des Prototype Fund. Aktuell arbeitet sie aus der Perspektive von Human-Centered Design daran, offene, sichere und menschenwürdige Technologien zu gestalten: Als UX Coach von Simply Secure, auch für die Projekte des Prototype Fund.*

# 📖 Link collection design, UI and user research

#### Accessibility

- <span lang="en-GB">Notes from human rights centred design call </span><span lang="en-GB">on </span><span lang="en-GB">*A*</span><span lang="en-GB">*<span style="background: transparent;">ssistive Technology (text to speech devices) &amp; Accessibility Lab</span>*</span><span lang="en-GB">: [https://docs.google.com/document/d/1F4-LC-XIKDlTLJrcTtuGHgFrUAuC3-34zwvnWPCdMcU/edit?usp=sharing](https://docs.google.com/document/d/1F4-LC-XIKDlTLJrcTtuGHgFrUAuC3-34zwvnWPCdMcU/edit?usp=sharing) </span>
- <span lang="en-GB">On </span><span lang="en-GB">*Readability*</span><span lang="en-GB">: [https://design.homeoffice.gov.uk/accessibility/readability](https://design.homeoffice.gov.uk/accessibility/readability) </span>
    
    
    - “<span lang="en-GB">Simple language doesn’t mean dumbing down – short, clear sentences are easier to understand for everyone.” </span>
- <span lang="en-GB">UK Government Digital Service, </span><span lang="en-GB">*Writing content for everyone*</span><span lang="en-GB">: [https://gds.blog.gov.uk/2016/02/23/writing-content-for-everyone/](https://gds.blog.gov.uk/2016/02/23/writing-content-for-everyone/) </span>
- <span lang="en-GB">W3C, Designing for Web Accessibility: [https://www.w3.org/WAI/tips/designing/](https://www.w3.org/WAI/tips/designing/) </span>
- <span lang="en-GB">UK Home Office, </span><span lang="en-GB">Designing accessible services: [https://ukhomeoffice.github.io/accessibility-posters/](https://ukhomeoffice.github.io/accessibility-posters/) </span>
    
    
    - <span lang="en-GB">P</span><span lang="en-GB">rovide a quick overview for designing for people with different accessibility needs</span>
- Conferences:
    
    
    - <span lang="en-GB">Inclusive design: [https://inclusivedesign24.org/2024/](https://inclusivedesign24.org/2024/) </span>
    - <span lang="en-GB">Axe-con: [https://www.deque.com/axe-con/](https://www.deque.com/axe-con/)</span>
        
        
        - <span lang="en-GB">Also has session archives: [https://www.deque.com/axe-con/archives/](https://www.deque.com/axe-con/archives/)</span>
- <span lang="en-GB">When you're user testing with neurodiverse people, tone indicators can be helpful for typed feedback: [https://toneindicators.carrd.co/#masterlist](https://toneindicators.carrd.co/#masterlist) </span>
    - A good project to follow re. how NT and ND folks work and research together is [https://github.com/alan-turing-institute/AutSPACEs](https://github.com/alan-turing-institute/AutSPACEs)

#### Visual design

- <span lang="en-GB">Open Source Design, </span><span lang="en-GB">*Resources*</span><span lang="en-GB">:</span><span lang="en-GB"> [https://opensourcedesign.net/resources/](https://opensourcedesign.net/resources/)</span>
- Senongo Akpem, *Cross-Cultural Design*: [https://abookapart.com/products/cross-cultural-design](https://abookapart.com/products/cross-cultural-design)

##### Color

- Read:
    
    
    - Superbloom, *Don't Let Color Drown Out Your Message*: [https://superbloom.design/learning/resources/color-message/](https://superbloom.design/learning/resources/color-message/)
    - Danny Sapio, *10 principles for Color Usage in UI Design*: [https://uxdesign.cc/10-principles-for-color-usage-in-ui-design-65174b213004](https://uxdesign.cc/10-principles-for-color-usage-in-ui-design-65174b213004)
- Color palette tools:
    
    
    - <span lang="en-GB">*Popular color palettes*</span><span lang="en-GB">: [https://coolors.co/palettes/popular](https://coolors.co/palettes/popular) </span>
    - <span lang="en-GB">Color combinations: [https://www.colourlovers.com/](https://www.colourlovers.com/) </span>
    - <span lang="en-GB">Color picker with HTML Hex codes: [htmlcolorcodes.com](https://htmlcolorcodes.com/)</span>
- <span lang="en-GB">Color System: [https://m3.material.io/styles/color/system/overview](https://m3.material.io/styles/color/system/overview) </span>
- <span lang="en-GB">Use </span><span lang="en-GB">*Contrast Grid*</span><span lang="en-GB"> for c</span><span lang="en-GB">hecking color contrast for accessibility: [https://contrast-grid.eightshapes.com/](https://contrast-grid.eightshapes.com/) </span>

##### Fonts

- <span lang="en-GB">Sustainable Open Source Design (Podcast), </span><span lang="en-GB">*Jérémy Landes on Type Designing*</span><span lang="en-GB">: [https://sosdesign.sustainoss.org/16](https://sosdesign.sustainoss.org/16) </span>
- Finding fonts
    
    
    - <span lang="en-GB">[https://www.velvetyne.fr/about/](https://www.velvetyne.fr/about/) </span>
        
        
        - <span lang="en-GB">"</span><span lang="en-GB">R</span><span lang="en-GB">esearching and disseminating typography and typeface creation" </span>
    - <span lang="en-GB">[https://www.fontsquirrel.com/](https://www.fontsquirrel.com/fonts/list/find_fonts?filter%5Blicense%5D%5B0%5D=open) </span>
        
        
        - <span lang="en-GB">Font squirrel has a useful Open Font License filter option</span>

##### Icons &amp; Mascots  


- <span lang="en-GB">Finding icons: [thenounproject.com](https://thenounproject.com/)</span>
- <span lang="en-GB">Graphéine, *A history of mascots*: [https://www.grapheine.com/en/graphic-design-en/history-of-mascots](https://www.grapheine.com/en/graphic-design-en/history-of-mascots) </span>

##### Branding

- <span style="font-style: normal;">Read:</span>
    
    
    - <span style="font-style: normal;">Superbloom, </span>*Open source &amp; branding – a contradiction?* [https://superbloom.design/learning/blog/branding-tails/](https://superbloom.design/learning/blog/branding-tails/)
    - Superbloom, *How to name your app*: [https://superbloom.design/learning/resources/how-to-name-your-app/](https://superbloom.design/learning/resources/how-to-name-your-app/)
    - Superbloom, *Communications Toolkit for Civic &amp; Nonprofit Tech*: [https://superbloom.design/learning/resources/comms-toolkit/](https://superbloom.design/learning/resources/comms-toolkit/)
    - New York Times, *The Weird Science of Naming New Products*: [https://www.nytimes.com/2015/01/18/magazine/the-weird-science-of-naming-new-products.html](https://www.nytimes.com/2015/01/18/magazine/the-weird-science-of-naming-new-products.html)
- Working with the community:
    
    
    - <span lang="en-GB">Open Food Network as an</span><span lang="en-GB"> example of an OSS community doing a community led project regarding vision and mission: [https://community.openfoodnetwork.org/t/ofn-organizational-vision-request-for-feedback/2090](https://community.openfoodnetwork.org/t/ofn-organizational-vision-request-for-feedback/2090) </span>
    - <span lang="en-GB">An </span><span lang="en-GB">article on how Simple organised their open source brand design: [https://medium.com/simple-dot-org/open-source-brand-design-for-simple-474f03a7fc15](https://medium.com/simple-dot-org/open-source-brand-design-for-simple-474f03a7fc15) </span>
- A list of helpful (OSS) brand standards/guidelines:
    
    
    - <span lang="en-GB">Red Hat brand standards: [https://www.redhat.com/en/about/brand/standards](https://www.redhat.com/en/about/brand/standards) </span>
    - <span lang="en-GB">OpenSSF brand guidelines: [https://openssf.org/about/brand-guidelines/](https://openssf.org/about/brand-guidelines/) </span>
    - <span lang="en-GB">Beyond Gravity brand portal: [https://brand.beyondgravity.com/d/jbxsqV491EeP](https://brand.beyondgravity.com/d/jbxsqV491EeP) </span>
    - <span lang="en-GB">Sonos brand identity: [https://www.sonos.com/en-us/blog/sonos-brand-design-refresh](https://www.sonos.com/en-us/blog/sonos-brand-design-refresh) </span>
    - <span lang="en-GB">OpenAI brand guidelines: [https://openai.com/brand/](https://openai.com/brand/) </span>

##### Logo design

- <span lang="en-GB">AntennaPod, </span><span lang="en-GB">*Getting to a new icon*</span><span lang="en-GB">: [https://antennapod.org/it/blog/2020/06/getting-to-a-new-icon](https://antennapod.org/it/blog/2020/06/getting-to-a-new-icon) </span>
    
    
    - <span lang="en-GB">A good example about how to write down your requirements</span>
- <span lang="en-GB">Fordes, </span><span lang="en-GB">*Designing a logo for your software project*</span><span lang="en-GB">: [https://www.fordes.de/posts/logodesign\_softwareproject.html](https://www.fordes.de/posts/logodesign_softwareproject.html) </span>
    
    
    - <span lang="en-GB">A worked [example for a logo creation process](https://www.fordes.de/posts/logodesign_softwareproject.html)</span>

#### Working with designers

##### Finding a designer

- <span lang="en-GB">Open Source Design Jobboard: [https://opensourcedesign.net/jobs/](https://opensourcedesign.net/jobs/) </span>
- <span lang="en-GB">User Experience &amp; Discovery Lab: [https://www.opentech.fund/labs/uxd-lab/](https://www.opentech.fund/labs/uxd-lab/) </span>
    
    
    - <span lang="en-GB">The la</span><span lang="en-GB"><span style="font-weight: normal;">b </span></span><span lang="en-GB"><span style="font-weight: normal;">provide free user-experience research and design support to internet freedom projects.</span></span>
- <span lang="en-GB"><span style="font-weight: normal;">Hylke Bons is designing app icons &amp; icon sets - for free, financed by the community:  
    [https://planetpeanut.studio/services](https://planetpeanut.studio/services)</span></span>

##### Redesign &amp; preparations for working with designers

- <span lang="en-GB">*Design Project Scoping Guide*</span><span lang="en-GB">: [https://dschool.stanford.edu/resources/design-project-scoping-guide](https://dschool.stanford.edu/resources/design-project-scoping-guide) </span>
- <span lang="en-GB">DesignKit, </span><span lang="en-GB">*Align on Your Impact Goals*</span><span lang="en-GB">: [https://www.designkit.org/methods/align-on-your-impact-goals.html](https://www.designkit.org/methods/align-on-your-impact-goals.html) </span>
- <span lang="en-GB">DesignKit, </span><span lang="en-GB">*Define Your Audience*</span><span lang="en-GB">: [http://www.designkit.org/methods/define-your-audience.html](http://www.designkit.org/methods/define-your-audience.html) </span>

#### UI design

##### Design systems and consolidation

- <span lang="en-GB">Figma, </span><span lang="en-GB">*Name and organize components*</span><span lang="en-GB">: [https://help.figma.com/hc/en-us/articles/360038663994-Name-and-organize-component](https://help.figma.com/hc/en-us/articles/360038663994-Name-and-organize-component)</span>
- <span lang="en-GB">Example of a big team of OSS designers working on a single OSS tool: [https://www.figma.com/design/GLg0zPNnwMEGIb9TytCrxQ/Resilience-App?node-id=1257-553&amp;node-type=canvas](https://www.figma.com/design/GLg0zPNnwMEGIb9TytCrxQ/Resilience-App?node-id=1257-553&node-type=canvas) </span>
- *Design for Code* on Figma: [https://www.figma.com/community/file/967069265207476318/design-for-code-config-2021](https://www.figma.com/community/file/967069265207476318/design-for-code-config-2021)
- <span lang="en-GB">FOSDEM talk on </span><span lang="en-GB">*Documenting a Design System. Lessons learned from open sourcing the Orbit docs*</span><span lang="en-GB"><span style="font-style: normal;">: [https://archive.fosdem.org/2022/schedule/event/osd\_lessons\_learned\_from\_open\_sourcing\_the\_orbit\_docs/](https://archive.fosdem.org/2022/schedule/event/osd_lessons_learned_from_open_sourcing_the_orbit_docs/) </span></span>
- <span lang="en-GB">Joplin, </span><span lang="en-GB">*<span style="font-weight: normal;">Design patterns, systems, guidelines</span>*</span><span lang="en-GB">: [https://notes.saneux.ei8fdb.org/shares/oSoPeKIFSz3SNyZ9c44gf1](https://notes.saneux.ei8fdb.org/shares/oSoPeKIFSz3SNyZ9c44gf1)</span>
- Women-Centric Design: [https://www.womencentricdesign.org/](https://www.womencentricdesign.org/)

##### Tools

- <span lang="en-GB">*Penpot*</span><span lang="en-GB"> is a FOSS-alternative for Figma, a UI design tool: [https://penpot.app/](https://penpot.app/) </span>

##### Usability principles and rules-of-thumb

- <span lang="en-GB">J. Raskin, </span><span lang="en-GB">*Intuitive equals familiar*</span><span lang="en-GB">: [https://www.asktog.com/papers/raskinintuit.html](https://www.asktog.com/papers/raskinintuit.html) </span>
    
    
    - “<span lang="en-GB">how to make something can be used as something that is familiar to users” can usually be answered more productively than "how to make this intuitive" </span>
    - The Thema "*Don’t make me think*" (Steve Krug) is an excellent, short introduction: [https://sensible.com/dont-make-me-think/](https://sensible.com/dont-make-me-think/)
- <span lang="en-GB">Icons are often harder to understand than lables, </span><span lang="en-GB">see </span><span lang="en-GB">*Icon Usability*</span><span lang="en-GB">: [https://www.nngroup.com/articles/icon-usability/](https://www.nngroup.com/articles/icon-usability/) </span>
- Web form design:
    
    
    - <span lang="en-GB">*Website Forms Usability: Top 10 Recommendations*</span><span lang="en-GB">: [https://www.nngroup.com/articles/web-form-design/](https://www.nngroup.com/articles/web-form-design/) </span>
    - <span lang="en-GB">Luke Wroblewski, </span><span lang="en-GB">*Web Form Design.* </span><span lang="en-GB">*Filling in the blanks* </span><span lang="en-GB"><span style="font-style: normal;">(Thema)</span></span><span lang="en-GB"><span style="font-style: normal;">:</span></span><span lang="en-GB"> [https://rosenfeldmedia.com/Themen/web-form-design/](https://rosenfeldmedia.com/Themen/web-form-design/) </span>
    - <span lang="en-GB">Caroline Jarret/Gerry Gaffney, </span><span lang="en-GB">*Forms that Work. Designing Web Forms for Usability*</span><span lang="en-GB"> (Thema): [https://www.sciencedirect.com/Thema/9781558607101/forms-that-work](https://www.sciencedirect.com/Thema/9781558607101/forms-that-work) </span>
- *Macintosh Human Interface Guidelines*: [http://interface.free.fr/Archives/Apple\_HIGuidelines.pdf](http://interface.free.fr/Archives/Apple_HIGuidelines.pdf)
    
    
    - <span lang="en-GB">The 1995 </span><span lang="en-GB">*Machintosh Interface Guidelines*</span><span lang="en-GB"> do not help you to up-to-date interfaces, but contain a lot of useful principles.</span>

##### User research &amp; journeys

- <span lang="en-GB">Visualize user activities over time with </span><span lang="en-GB">*user journey mapping*</span><span lang="en-GB">: [https://www.usability.de/leistungen/methoden/user-journey-mapping.html](https://www.usability.de/leistungen/methoden/user-journey-mapping.html) </span>
- <span lang="en-GB">Superbloom, </span><span lang="en-GB">*Qualitative Interviewing*</span><span lang="en-GB">: </span><span lang="en-GB"> [https://simplysecure.org/resources/qualitative\_interviewing.pdf](https://simplysecure.org/resources/qualitative_interviewing.pdf) </span>
- <span lang="en-GB">Jan Dittrich, </span><span lang="en-GB">*A Beginner’s Guide to Finding User Needs*</span><span lang="en-GB">: [https://urbook.fordes.de/](https://urbook.fordes.de/) </span>
- <span lang="en-GB">*Empathy map*</span><span lang="en-GB">: Start with an assumption for user group/s and see if the empathy map indicates that your idea is going to support their goals or resolve their problems: [https://commons.wikimedia.org/wiki/File:Empathy\_map.jpg](https://commons.wikimedia.org/wiki/File:Empathy_map.jpg) </span>
- Superbloom, *Using Personas in Open-Source Projects*: [https://superbloom.design/learning/blog/personas/](https://superbloom.design/learning/blog/personas/)

#### Evaluation methods

On finding out if your ideas work. Very often this is done too late – with paper prototyping you can run a simple evaluation within a few hours, so do test early and often!

FYI: it's very helpful for beta testing documentation. Here is an excellent documentation testing method: *highlighter test:* [<span style="color: rgb(35, 111, 161);">https://userresearch.blog.gov.uk/2014/09/02/a-simple-technique-for-evaluating-content/</span>](https://userresearch.blog.gov.uk/2014/09/02/a-simple-technique-for-evaluating-content/)

##### Prototyping

- You do not need an almost finished product to test (the earlier the better, actually): You can evaluate a single feature (see *tracer bullet development*), a mockup (see *penpot* or *figma*) or a *paper prototype*.
- <span lang="en-GB">Paper prototyping, a way to try ideas with users without needing to write any code.</span>
    
    
    - <span lang="en-GB">*Paper prototyping*</span><span lang="en-GB"> on Wikipedia: [https://en.wikipedia.org/wiki/Paper\_prototyping](https://en.wikipedia.org/wiki/Paper_prototyping) </span>
    - <span lang="en-GB">Alistapart, </span><span lang="en-GB">*Paper Prototyping*</span><span lang="en-GB">: [https://alistapart.com/article/paperprototyping/](https://alistapart.com/article/paperprototyping/) </span>
- Concept prototype: Testing your idea when it’s still at the conceptual stage: Keep it basic, keep it at the big picture level (so users won’t focus on the finer details, like the color, design etc), use an exisiting product that is similar to get the users talking.

##### Analytics

- <span lang="en-GB">Privacy-preserving tracking of user actions: [https://cleaninsights.org/](https://cleaninsights.org/) </span>
- <span lang="en-GB">G</span><span lang="en-GB">oogle analytics alternative: [https://matomo.org/](https://matomo.org/) </span>

##### Heuristic evaluation

Using rules to spot usability problems in a usage scenario; ideally done by several people.

- <span lang="en-GB">*10 Usability Heuristics for User Interface Design*</span><span lang="en-GB"> the most common set of rules: [https://www.nngroup.com/articles/ten-usability-heuristics/](https://www.nngroup.com/articles/ten-usability-heuristics/) </span>
- <span lang="en-GB">*How to conduct a heuristic evaluation*</span><span lang="en-GB">: [https://www.nngroup.com/articles/how-to-conduct-a-heuristic-evaluation/](https://www.nngroup.com/articles/how-to-conduct-a-heuristic-evaluation/) </span>

##### Usability tests &amp; user testing

In a usability test, potential users try to use an early version of your product to find potential problems that you need to fix. User testing is not meant to sell the idea to the users, it’s to gather data/feedback that supports you to continue product development, so use any resources available as early as possible to communicate the idea.

**To read, listen and watch**

- <span lang="en-GB">Superbloom, </span><span lang="en-GB">*How To Test Software For Usability And Usefulness When You Haven’t Finished Writing The Code*</span><span lang="en-GB">: [https://superbloom.design/learning/blog/how-to-test-software-for-usability-and-usefulness-when-you-havent-finished-writing-the-code/](https://superbloom.design/learning/blog/how-to-test-software-for-usability-and-usefulness-when-you-havent-finished-writing-the-code/) </span>
- When is the right time to do user testing? As early as possible is often not ideal, since projects first need to figure out where they want to go. See Christoph Lattemann, Stefan Stieglitz, F*ramework for Governance in Open Source*  
    *Communities*: [https://publishup.uni-potsdam.de/opus4-ubp/frontdoor/deliver/index/docId/1824/file/stieglitz\_lattemann\_2005.pdf](https://publishup.uni-potsdam.de/opus4-ubp/frontdoor/deliver/index/docId/1824/file/stieglitz_lattemann_2005.pdf)
- <span lang="en-GB">Before testing or having a software, maybe you want to document user context and processes: [https://jdittrich.github.io/userNeedResearchBook/#coDocumenting](https://jdittrich.github.io/userNeedResearchBook/#coDocumenting)</span>
- *A Beginner's Guide to Finding User's needs* by Jan Dittrich: [<span style="color: rgb(35, 111, 161);">https://jdittrich.github.io/userNeedResearchBook/#dataGathering</span>](https://kb.prototypefund.de/Doing%20'problem%20interviews'%20with%20users%20on%20the%20alternatives%20they%20currently%20use%20%20%20%20%20*%20[Plugging%20this](https:/jdittrich.github.io/userNeedResearchBook/#dataGathering))
- <span lang="en-GB">In general, it is better to do several smaller usability tests than a one or two big ones. Even small numbers of users can help to find problems. A classic article on this is </span><span lang="en-GB">*Why you only need to test with 5 users*</span><span lang="en-GB">: [https://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/](https://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/)</span>
- <span lang="en-GB">Know what power/significance are and how they are related to sample size, what you know from academia may be way too conservative for your needs. See also *Improving your statistical inferences* by Daniël Lakens: <span style="color: rgb(35, 111, 161);">[https://lakens.github.io/statistical\_inferences/](https://lakens.github.io/statistical_inferences/)</span></span>
- <span lang="en-GB">The Thema </span><span lang="en-GB">*Rocket surgery made easy*</span><span lang="en-GB"> (Steve Krug) describes usability testing (and recruiting for- and communication of it): [https://sensible.com/rocket-surgery-made-easy/](https://sensible.com/rocket-surgery-made-easy/) </span>
- <span lang="en-GB">Superbloom, </span><span lang="en-GB">*A Guide to Gathering Feedback*</span><span lang="en-GB">: [https://superbloom.design/learning/blog/feedback-gathering-guide/](https://superbloom.design/learning/blog/feedback-gathering-guide/) </span>
- <span lang="en-GB">Superbloom, </span><span lang="en-GB">*User Testing Cheat Sheet*</span><span lang="en-GB">: [https://superbloom.design/learning/blog/user-testing-cheatsheet/](https://superbloom.design/learning/blog/user-testing-cheatsheet/) </span>
- <span lang="en-GB">*A Dev's guide to User testing*</span><span lang="en-GB">, made by Superbloom, has resources that can help OSS tool teams start to do user testing and usability testing in their OSS tool projects either with or without a designer helping out: [https://sprblm.github.io/devs-guide-to/](https://sprblm.github.io/devs-guide-to/)</span>
- *Usability Testing can be fun! An FAQ for small open source teams*: [https://usable.itch.io/user-testing-can-be-fun-a-guide-for-oss-developers-and-tool-teams-on-how-to-user](https://usable.itch.io/user-testing-can-be-fun-a-guide-for-oss-developers-and-tool-teams-on-how-to-user)
- <span lang="en-GB">User testing examples:</span>
    
    
    - <span lang="en-GB">for the process: [https://docs.ushahidi.com/platform-developer-documentation/dev-legacy-v3/design/user-testing-process](https://docs.ushahidi.com/platform-developer-documentation/dev-legacy-v3/design/user-testing-process) </span>
    - <span lang="en-GB">for </span><span lang="en-GB">design documentation: [https://github.com/ushahidi/platform/issues/3681](https://github.com/ushahidi/platform/issues/3681) </span>
    - <span lang="en-GB">Here is also an example video for a usability test: [https://www.youtube.com/watch?v=QckIzHC99Xc](https://www.youtube.com/watch?v=QckIzHC99Xc)</span>

**Methods &amp; tools**

- *Cardsort* helps UX researchers quickly analyse data from open card sorting exercises using hierarchical cluster analysis. This task helps to understand how people organize information, and is frequently used to develop information architectures for websites: [https://pypi.org/project/cardsort/](https://pypi.org/project/cardsort/)
- <span lang="en-GB">Role play workshop content for learning how to do user testing, </span><span lang="en-GB">for example through wireframing, </span><span lang="en-GB">*Illustrated Quick-Start Intro To Wireframing*</span><span lang="en-GB">: [https://superbloom.design/learning/blog/wireframing-intro/](https://superbloom.design/learning/blog/wireframing-intro/)</span>
- <span lang="en-GB">The *System Usability Scale (SUS)* provides a “quick and dirty”, reliable tool for *measuring* the usability (measuring sounds cool, but it only makes sense if you have something to compare it to, like a previous measurement!): [https://digital.gov/topics/usability/](https://digital.gov/topics/usability/)</span>
- <span lang="en-GB">*The Rainbow Spreadsheet: A Collaborative Lean UX Research Tool*: [https://www.smashingmagazine.com/2013/04/rainbow-spreadsheet-collaborative-ux-research-tool/](https://www.smashingmagazine.com/2013/04/rainbow-spreadsheet-collaborative-ux-research-tool/)</span>
- Get in touch with why you're doing this via *Empathy map:* [https://web.archive.org/web/20160711191804/http://thetoolkitproject.com/tool/empathy-map](https://web.archive.org/web/20160711191804/http://thetoolkitproject.com/tool/empathy-map)
- *EventStorming*: Post it workshops for software development: <span style="color: rgb(35, 111, 161);">[https://www.eventstorming.com](https://www.eventstorming.com)</span>

**Sourcing testing users**

- <span lang="en-GB">You can get free access to an otherwise expensive suite of user testing tools through UserTesting.com’s social impact program,</span><span lang="en-GB"> *OneWorld*</span><span lang="en-GB">: [https://www.usertesting.com/company/programs-initiatives/usertesting-oneworld](https://www.usertesting.com/company/programs-initiatives/usertesting-oneworld) </span>
    
    
    - <span lang="en-GB">(Note for usertesting.com (and similar products): You won’t get a lot of people from marginalized communities e.g. because payment needs a bank account or credit card etc.)</span>
- “Citizen User Testing” groups concept, a formal model to identify more diverse feedback from communities you want to serve w/ your product or service- Examples and free e-Thema on the method: [https://directory.civictech.guide/listing-category/user-research-groups](https://directory.civictech.guide/listing-category/user-research-groups)
- The Mom Test - frequently cited Thema on this, essentially people will lie to you to be nice, how to talk to customers to get honest feedback (note: as a mom, I really hate this name. - Molly): [https://www.momtestbook.com/](https://www.momtestbook.com/)

# 🎧 Software intuitiv gestalten - Podlove Publisher Onboarding & Import Assistant

Das Team hinter [Podlove Publisher Onboarding &amp; Import Assistant](https://prototypefund.de/project/podlove-publisher-onboarding-import-assistant/) (Prototype Fund Runde 15) spricht darüber, wie man Software entwickeln kann, die User\*innen gut bedienen und gern nutzen - und das (natürlich) im Podcast:

[Design und User Research mit Podlove](https://kb.prototypefund.de/attachments/15?open=true)