Prototyping bedeutet, eine Nutzeroberfläche grob zu skizzieren, um Raster, Anordnung und Gewichtung der Inhalte einer Nutzeroberfläche festzulegen. Gängige Begriffe für die Ergebnisse von Prototyping sind Wireframes oder Mockups.
Prototyping kann sowohl duch handgezeichnete Skizzen, als auch durch die Verwendung von Software geschehen, wobei die softwaregestützte Methode mittlerweile üblicher ist. Paper Prototyping wird aufgrund seines Workshop-Charakters in einem anderen Factsheet beschrieben.
Mit Hilfes des Prototyping können verschiedene Anordnungen von Inhalten, Menüführung, Schwerpunkte („Call to Action“) als Entscheidungsvorlage skizziert werden.
Dabei wird bewusst auf konkretes Design (Farben, Logo, Bilder, Typo) verzichtet, um die Beurteilung der Bedienbarkeit nicht durch persönliche Design-Vorlieben zu verzerren.
Click-Dummies
Mehrere Wireframes lassen sich bei Bedarf auch so miteinander verbinden, so dass bestimmte Klick-Aktionen simuliert werden und die Usability der Entwürfe noch stärker erfahrbar macht.
Entscheidungsvorlagen
Meistens werden Wireframes dazu genutzt, einen schriftlichen Konzeptansatz grafisch zu präsentieren, bzw. erfahrbar zu machen.
Design-Briefing
Oft werden Wireframes außerdem dazu verwendet, Vorgaben für das Design zu liefern: welche Nutzeroberflächen sollen vom Designer gestaltet werden, welche Inhalte sollen als Beispielinhalte verwendet werden
Skizzen/Ergänzungen
Da Wireframes weniger aufwendig als Designs sind, können sie an bestimmten Stellen das Designkonzept ergänzen, um Layout-Anordnungen und Funktionen auszudefinieren. Auch redaktionelle Entscheidungen zur Anordnung und Darstellung von Inhalten können mit Wireframes dokumentiert werden.
Voraussetzungen/Projektstand | Planungs- bzw. Konzeptionsphase, als Vorbereitung der Design-Entwürfe |
Benötigte Ressourcen | 1 Konzepter |
Zeitaufwand | Ca. 2-8 Stunden pro Wireframe, bei Click-Dummies deutlich mehr |
Hilfsmittel | Papier und Bleistift, bzw. geeignete Prototyping-Software (siehe Liste im Anhang) |
Sonstige Anmerkungen | Prototyping erfordert Erfahrung in Konzeption |
Vorbereitung
Wichtig ist die richtige Entscheidung, mithilfe welcher Beispiele eine Software/Webseite ausreichend beschrieben werden kann.
Durchführung
Der Konzepter erstellt Wireframes per Hand oder mit der entsprechenden Software und legt sie dem zuständigen Entscheidern zur Abnahme vor. Im Idealfall wird ein Wireframe persönlich präsentiert.
Abgenommene Wireframes werden in der Regel zur Illustration eines Konzeptpapiers genutzt.
Rahmenbedingungen
Folgende Bedingungen sind herzustellen:
- Konzeptionelle Grundlagen wie Struktur die Struktur des Produkts sollten vorliegen.
- Der Konzepter hat ausreichend Erfahrung mit Prototyping.
- Die Entscheidungsstrukturen im Projektteam sind geklärt.
Downloads
Literaturhinweise / Web
Folgende Websites bieten praktische Prototyping-Tools: