User-centered Design: So gelingt euer Web-Auftritt (Teil 3)
Weiter geht es mit der nutzerorientierten Gestaltung eures Online-Auftritts: Der erste Schritt untersuchte, wie eure Zielgruppe das Web nutzt – der zweite Schritt definierte anschließend, was eure Website oder App bieten müssen. Jetzt folgen die Umsetzung und die stetige Bewertung.
Die ersten beiden Teile dieser Artikelreihe behandelten die Nutzungskontext-Analyse sowie den Schritt "Entwurf & Gestaltung". Jetzt folgen Implementierung und Evaluation.
Prototyping bedeutet: Ihr erstellt eine erste voll funktionstüchtige Version eurer geplanten Website bzw. App, geht damit aber noch nicht zwingend live. Prototypen bewegen sich so nah wie möglich am Endergebnis. Das unterscheidet sie von Wireframes ("Drahtgitter" – schematische und nicht funktionstüchtige Entwürfe eurer Seiten) und Mock-ups ("Attrappen" – durchdesignte, aber nicht funktionstüchtige Entwürfe eurer Seiten). Gängige Prototyping-Tools sind proto.io, InVision, UXPin und Marvel.
Vorteile des Prototypings:
Folgend beschreibe ich fünf gängige Evaluationsmethoden, die ihr bereits im Prototypen-Testing in Schritt 3 (siehe oben) nutzen solltet:
➤ Cognitive Walkthrough heißt "erkennendes Durchdenken". Ein Experte versetzt sich in die Lage der Nutzer und durchläuft definierte Interaktionen mit eurer Website/App. Solch ein Expertentest ersetzt niemals Tests mit eurer tatsächlichen Zielgruppe, behebt aber frühzeitig Fehler.
➤ A/B-Tests (auch Split-Run-Tests genannt) ermitteln Reaktionen von Testpersonen auf zwei unterschiedliche Varianten eurer Website oder App. Eine schöne Erklärung bietet dieses (englischsprachige) Video:
Häufig handelt es sich um geringfügige Änderungen, wie zum Beispiel die Position oder das Layout eines Call-to-Action-Buttons. Die Testgruppen müssen vergleichbar sein und dürfen sich nur in einer Sache unterscheiden. Eine Auswahl von A/B-Test-Tools findet ihr auf t3n.de.
➤ Usability-Tests: die bekannteste Evaluationsmethode. Repräsentative Nutzer werden bei der Interaktion mit der Website/App beobachtet. Der Test folgt klar definierten Aufgaben, die sich an den tatsächlichen Arbeitsaufgaben der Nutzer orientieren. Der klassische Usability-Test findet in einem Usability-Labor statt (inkl. Beobachter-Raum).
➤ Usability-Befragungen erfolgen häufig nach dem eigentlichen Usability-Test, können aber auch einzeln genutzt werden. Sie können standardisiert sein ("Auf einer Skala von 1 bis 5: Als wie selbsterklärend empfinden Sie diese Website?") – oder offen ("Wie gut hat Ihnen die Gestaltung der Website gefallen?").
Sehr gute Vorlagen für Usability-Befragungen findet ihr auf benutzerfreun.de. Ein Tool-Tipp ist außerdem Google Surveys.
➤ User-Tracking: Diese "Nutzerverfolgung" sammelt Daten darüber, wie User eure Website bzw. App nutzen. Tracking-Tools zeichnen z. B. Mausbewegungen, Klickpfade und das Scrollverhalten auf. Eye-Tracking erfasst die Augenbewegungen des Users, anschaulich beschrieben im folgenden (englischsprachigen) Video:
Es ist sinnvoll, die vier UCD-Phasen regelmäßig von vorne beginnen zu lassen: Das Web-Nutzungsverhalten eurer Zielgruppe verändert sich, was der Startschuss für eine erneute Nutzungskontext-Analyse (Schritt 1) ist.
So stellt ihr sicher, dass ihr dem User-centered Design Grundgedanken permanent gerecht werdet: Ihr stellt den Nutzer (User) in den Mittelpunkt (center) der Gestaltung (Design).
Link-Tipps:
 |
| (Webseite unter CC0 1.0) |
Die ersten beiden Teile dieser Artikelreihe behandelten die Nutzungskontext-Analyse sowie den Schritt "Entwurf & Gestaltung". Jetzt folgen Implementierung und Evaluation.
 |
| Zum Vergrößern bitte in das Bild klicken. |
UCD-Schritt 3: Implementierung
In dieser Phase entstehen Prototypen (altgriech. protos "der Erste" und typos "Urbild, Vorbild") eurer künftigen Website oder App. Bereits hier ist ausgiebiges Testen Pflicht, wofür ihr die dieselben Werkzeuge wie in der späteren Evaluation nutzen könnt (siehe unten).Prototyping bedeutet: Ihr erstellt eine erste voll funktionstüchtige Version eurer geplanten Website bzw. App, geht damit aber noch nicht zwingend live. Prototypen bewegen sich so nah wie möglich am Endergebnis. Das unterscheidet sie von Wireframes ("Drahtgitter" – schematische und nicht funktionstüchtige Entwürfe eurer Seiten) und Mock-ups ("Attrappen" – durchdesignte, aber nicht funktionstüchtige Entwürfe eurer Seiten). Gängige Prototyping-Tools sind proto.io, InVision, UXPin und Marvel.
Vorteile des Prototypings:
- Fehler frühzeitig erkennen und beheben (vor Live-Gang)
- einheitliches Bild von der künftigen Website/App bei allen Verantwortlichen
- Vorlage für die Programmierung
UCD-Schritt 4: Evaluation
Evaluation bedeutet "Bewertung" oder "Beurteilung": Eure Website/App ist nun live und im World Wide Web verfügbar. Da UCD ein iterativer (sich schrittweise wiederholend der besten Lösung annähernder) Prozess ist, behebt eine ständige Evaluation auch nach dem Live-Gang Fehler und Schwächen.Folgend beschreibe ich fünf gängige Evaluationsmethoden, die ihr bereits im Prototypen-Testing in Schritt 3 (siehe oben) nutzen solltet:
➤ Cognitive Walkthrough heißt "erkennendes Durchdenken". Ein Experte versetzt sich in die Lage der Nutzer und durchläuft definierte Interaktionen mit eurer Website/App. Solch ein Expertentest ersetzt niemals Tests mit eurer tatsächlichen Zielgruppe, behebt aber frühzeitig Fehler.
➤ A/B-Tests (auch Split-Run-Tests genannt) ermitteln Reaktionen von Testpersonen auf zwei unterschiedliche Varianten eurer Website oder App. Eine schöne Erklärung bietet dieses (englischsprachige) Video:
Häufig handelt es sich um geringfügige Änderungen, wie zum Beispiel die Position oder das Layout eines Call-to-Action-Buttons. Die Testgruppen müssen vergleichbar sein und dürfen sich nur in einer Sache unterscheiden. Eine Auswahl von A/B-Test-Tools findet ihr auf t3n.de.
➤ Usability-Tests: die bekannteste Evaluationsmethode. Repräsentative Nutzer werden bei der Interaktion mit der Website/App beobachtet. Der Test folgt klar definierten Aufgaben, die sich an den tatsächlichen Arbeitsaufgaben der Nutzer orientieren. Der klassische Usability-Test findet in einem Usability-Labor statt (inkl. Beobachter-Raum).
➤ Usability-Befragungen erfolgen häufig nach dem eigentlichen Usability-Test, können aber auch einzeln genutzt werden. Sie können standardisiert sein ("Auf einer Skala von 1 bis 5: Als wie selbsterklärend empfinden Sie diese Website?") – oder offen ("Wie gut hat Ihnen die Gestaltung der Website gefallen?").
Sehr gute Vorlagen für Usability-Befragungen findet ihr auf benutzerfreun.de. Ein Tool-Tipp ist außerdem Google Surveys.
➤ User-Tracking: Diese "Nutzerverfolgung" sammelt Daten darüber, wie User eure Website bzw. App nutzen. Tracking-Tools zeichnen z. B. Mausbewegungen, Klickpfade und das Scrollverhalten auf. Eye-Tracking erfasst die Augenbewegungen des Users, anschaulich beschrieben im folgenden (englischsprachigen) Video:
User-centered Design: Nach dem Live-Gang ist vor der Analyse
Glückwunsch! Ihr habt euren Online-Auftritt erfolgreich implementiert sowie live geschaltet und evaluiert ihn nun regelmäßig. Die Erkenntnisse der laufenden Evaluation lasst ihr in eure Website bzw. App einfließen.Es ist sinnvoll, die vier UCD-Phasen regelmäßig von vorne beginnen zu lassen: Das Web-Nutzungsverhalten eurer Zielgruppe verändert sich, was der Startschuss für eine erneute Nutzungskontext-Analyse (Schritt 1) ist.
So stellt ihr sicher, dass ihr dem User-centered Design Grundgedanken permanent gerecht werdet: Ihr stellt den Nutzer (User) in den Mittelpunkt (center) der Gestaltung (Design).
Link-Tipps:
- User-centered Design: So gelingt euer Web-Auftritt (Teil 1)
- User-centered Design: So gelingt euer Web-Auftritt (Teil 2)
Kommentare