UX, Wireframes und Nutzertests
Von der Skizze zur getesteten Lösung — so gestaltest du für echte Menschen, nicht nur für deinen eigenen Geschmack
Einleitung
Eine Website oder eine App kann aufwendig aussehen und trotzdem völlig versagen, wenn der Nutzer sich nicht zurechtfindet. UX — user experience, Nutzererlebnis — ist die Disziplin, die dafür sorgt, dass eine digitale Lösung verständlich und bedienbar ist. In den digitalen Medien treffen Design und Verhaltenspsychologie aufeinander, und gute UX-Entscheidungen beruhen auf der Beobachtung echter Nutzer, nicht auf deinem eigenen Bauchgefühl.
Von der Idee zum Wireframe
Bevor etwas schön wird, muss es klar sein. Ein Wireframe ist eine vereinfachte Skizze einer Seite oder eines Bildschirms — Kästen, Striche und einfacher Text, ohne Farben oder fertiges Design. Der Zweck ist, die Struktur festzulegen: wo das Menü sitzt, was die wichtigste Handlung auf der Seite ist, in welcher Reihenfolge der Nutzer dem Inhalt begegnet. Weil ein Wireframe schnell gemacht und ebenso schnell geändert ist, kannst du mehrere Strukturen ausprobieren, bevor du Zeit in die visuelle Gestaltung steckst.
Lo-Fi- und Hi-Fi-Prototypen
- 01Lo-Fi-Prototyp — grob, oft in Graustufen, konzentriert sich ausschließlich auf Struktur und Ablauf. Billig zu ändern.
- 02Hi-Fi-Prototyp — mit echten Farben, Schriften und Bildern, klickbar wie die fertige Lösung. Wird genutzt, um den nahezu endgültigen Ausdruck zu testen.
- 03Klickbarer Prototyp — mehrere Bildschirme miteinander verknüpft, sodass eine Testperson die Lösung 'benutzen' kann, bevor eine einzige Zeile Code geschrieben ist.
Nutzertests — warum Raten nicht reicht
Egal, wie erfahren du bist: Du kannst deine eigene Lösung nicht mit den Augen eines neuen Benutzers sehen — du weißt bereits, wie sie funktioniert. Deshalb ist der Benutzertest eine Kernaktivität der UX-Arbeit: Du setzt eine echte Person vor den Prototyp, gibst ihr eine Aufgabe und beobachtest, wo sie zögert, falsch klickt oder aufgibt. Laut dem Usability-Forscher Jakob Nielsen (Nielsen Norman Group) decken Tests mit nur fünf Testpersonen typischerweise rund 85 Prozent der auffälligsten Usability-Probleme einer Lösung auf — mehr Testpersonen bringen abnehmenden Ertrag, weil dieselben Probleme immer wiederkehren.
Methoden, um Probleme aufzudecken
| Methode | Was sie zeigt |
|---|---|
| Moderierter Nutzertest | Ein Moderator beobachtet live, wie ein Nutzer Aufgaben löst, und fragt unterwegs nach |
| Unmoderierter Remote-Test | Die Testperson löst Aufgaben allein über ein Testwerkzeug, oft mit Bildschirmaufzeichnung |
| A/B-Test | Zwei Varianten einer Seite werden verschiedenen Nutzern gezeigt, um zu sehen, welche besser abschneidet |
| Kartensortierung (Card Sorting) | Nutzer gruppieren die Inhalte selbst und zeigen dabei, wie sie erwarten, dass ein Menüpunkt heißt und wo er liegt |
| Heuristische Durchsicht | Ein erfahrener UX-Fachmann beurteilt die Lösung anhand bekannter Prinzipien der Benutzerfreundlichkeit ohne Testperson |
Barrierefreiheit ist Teil der UX
Gute UX lässt sich nicht von Barrierefreiheit trennen. Eine Lösung, die nur mit der Maus funktioniert, schließt Nutzer aus, die mit der Tastatur navigieren. Eine Lösung ohne Alternativtext für Bilder schließt Nutzer von Screenreadern aus. Denke Barrierefreiheit ab dem ersten Wireframe als Teil der Nutzererfahrung mit, nicht als etwas, das zum Schluss aufgeklebt wird.
Vom Test zur Iteration
Ein Nutzertest ist nur etwas wert, wenn die Ergebnisse genutzt werden. Sammle die Beobachtungen, priorisiere die Probleme, auf die die meisten Nutzer stoßen, und passe das Design an, bevor du erneut testest. UX-Arbeit ist ein Kreis, keine gerade Linie: entwerfen, testen, anpassen, wieder testen. Es ist dieser Kreis, der aus einer theoretisch guten Idee eine Lösung macht, die für die Menschen, für die sie gemacht ist, tatsächlich funktioniert.
“Du bist nicht dein Nutzer. Was dir selbstverständlich erscheint, kann für jemanden, der die Lösung zum ersten Mal sieht, undurchschaubar sein.”
— Fachliche Betrachtung zu Nutzertests in der UX-Arbeit