- den Umfang eines Prototyps festlegen
- Verknüpfungen sinnvoll setzen
- Papierprototypen einsetzen
- einen Prototyp für einen Test vorbereiten
Ein Wireframe zeigt eine Seite. Ein Prototyp zeigt den Weg. Sobald mehrere Bildschirme zusammenhängen, lässt sich mit einem Standbild nicht mehr beantworten, ob jemand ans Ziel kommt – dafür muss geklickt werden. Diese Lektion zeigt, wie ein Prototyp entsteht, ohne dass er so teuer wird wie die Umsetzung.
1. Wozu ein Prototyp dient
Drei Dinge lassen sich nur klickend klären. Erstens, ob die Reihenfolge der Schritte stimmt – eine Frage, die auf Papier immer mit Ja beantwortet wird und beim Durchgehen oft mit Nein. Zweitens, ob Beschriftungen im Fluss verständlich sind; ein Knopf, der einzeln betrachtet klar wirkt, kann im Zusammenhang unklar sein. Drittens, wie viele Schritte es tatsächlich sind – gezählt wird verlässlich erst, wenn man selbst klickt.
2. Umfang festlegen
Startseite → Leistung → Formular → Bestätigung
Aufwand: 2 Stunden
Dafür
Schnell gebaut, beantwortet genau eine Frage. Für Tests mit Nutzern meist ausreichend.
Dagegen
Jeder Klick daneben führt ins Leere – das muss man Testpersonen vorher sagen.
Die mittlere Wahl wirkt vernünftig und ist meist zu groß. Ein Prototyp für einen Nutzertest braucht nur den Weg, den die Testperson gehen soll – alles andere kostet Zeit und wird nie angesehen. Bauen Sie lieber drei schmale Prototypen für drei Anliegen als einen breiten für alles.
3. Der Papierprototyp
Vor jedem digitalen Werkzeug lohnt eine Runde auf Papier. Die Bildschirme werden gezeichnet, nebeneinandergelegt, und eine Person spielt das System: Tippt die Testperson auf einen Knopf, wird das nächste Blatt vorgelegt. Das klingt nach Bastelei und liefert erstaunlich verlässliche Ergebnisse – weil genau dieselben Fragen auffallen wie beim digitalen Prototyp, nur zwei Tage früher.
Der Papierprototyp hat einen Vorteil, den kein Werkzeug bietet: Änderungen passieren im Test selbst. Fällt auf, dass ein Schritt fehlt, wird er mit dem Stift ergänzt und der Test läuft weiter. Bei einem digitalen Prototyp bedeutet dasselbe eine Pause und eine neue Runde.
4. Verknüpfungen sparsam setzen
Beim digitalen Prototyp entsteht schnell der Drang, jeden Knopf klickbar zu machen. Das ist der Hauptgrund, warum Prototypen aus dem Ruder laufen. Verknüpfen Sie nur, was auf dem geprüften Weg liegt, und sagen Sie der Testperson vorher: „Nicht alles ist angeschlossen – wenn nichts passiert, sagen Sie mir einfach, was Sie erwartet hätten.“ Dieser Satz macht unfertige Prototypen testbar und verhindert, dass jemand sich für ungeschickt hält.
Halten Sie außerdem fest, welche Zustände der Prototyp nicht zeigt – Fehlermeldungen, leere Listen, Ladezeiten. Sonst entsteht der Eindruck, diese Fälle seien nicht vorgesehen, und sie tauchen in der Umsetzung als Überraschung auf.
5. Vorbereitung für einen Test
| Punkt | Warum |
|---|---|
| Aufgabe formuliert, nicht der Weg | „Finden Sie heraus, was eine Wartung kostet“ statt „Klicken Sie auf Leistungen“ |
| Startpunkt festgelegt | Meist eine Unterseite, nicht die Startseite – so kommen echte Besucher an |
| Echte Texte in Überschriften und Knöpfen | Blindtext macht jeden Verständlichkeitstest wertlos |
| Auf dem Gerät geprüft, auf dem getestet wird | Ein Prototyp, der nur am großen Bildschirm funktioniert, testet den falschen Fall |
| Hinweis auf Unfertigkeit vorbereitet | Nimmt der Testperson die Sorge, etwas falsch zu machen |
6. Häufige Fragen
Wie echt muss ein Prototyp aussehen? So echt wie nötig für die Frage. Für Ablauftests genügen Graustufen; für Fragen zur Wirkung braucht es die gestaltete Fassung.
Kann man den Prototyp später weiterverwenden? Als Vorlage ja, als Grundlage der Umsetzung nein. Prototypen sind zum Wegwerfen gebaut – wer sie weiterentwickelt, schleppt Abkürzungen mit, die in echter Software nicht tragen.
Was ist mit KI-erzeugten Prototypen? Sie sind inzwischen in Minuten erzeugbar und für frühe Ablauftests brauchbar. Prüfen Sie aber, ob sie den Weg zeigen, den Sie prüfen wollen – erzeugte Prototypen enthalten gern Schritte, die niemand vorgesehen hat.
7. Übung zum Selbermachen
Zeichnen Sie vier Bildschirme eines Anfragewegs auf vier Blätter. Bitten Sie jemanden, eine Aufgabe damit zu lösen, und legen Sie als „System“ die Blätter vor. Notieren Sie jeden Moment, in dem die Person zögert oder auf etwas tippt, das Sie nicht gezeichnet haben. Diese Stellen sind Ihre Aufgabenliste – meist sind es drei bis fünf, und sie wären in der Umsetzung deutlich teurer aufgefallen.
- [1]Snyder, C. (2003): Paper Prototyping. Morgan Kaufmann.
- [2]Nielsen Norman Group (2025): Prototyping for Usability Testing.
- [3]Warfel, T. Z. (2009): Prototyping – A Practitioner's Guide. Rosenfeld Media.
Stand: September 2026. Kursmaterial der Klarwerk Akademie. Methoden und Werkzeuge der Konzeption entwickeln sich weiter – die Grundprinzipien nutzerzentrierter Gestaltung bleiben.