📖Prototyping

Definition

Prototyping ist eine Methode, die schnell zu ersten Ergebnissen führt und frühzeitiges Feedback bezüglich der Eignung eines Lösungsansatzes ermöglicht.

Durch Prototyping entsteht eine zum Teil funktionsfähige Vorabversion einer Benutzeroberfläche. Mit ihr kann früh getestet werden, ob die Anwendung die Anforderungen erfüllt.

➕	➖
Ermöglicht produktspezifisches Testing von Fragen, die nicht durch allgemeine Forschungsergebnisse oder Richtlinien beantwortet werden können	Begrenzungen und Randbedingungen, auf die das reale Produkt trifft, werden oft während des Prototyping zu stark vernachlässigt
Liefert relativ schnell bedeutungsvolle Rückmeldungen vom Benutzern	Erzeugung unrealistischer Erwartungen für die Fähigkeiten des Endproduktes
Reduziert die totalen Entwicklungskosten für ein Produkt	Gefahr der Überfrachtung des Prototyps
Kann früh im Entwicklungsprozess eingesetzt werden	Der Prototypingprozess kann schwierig zu managen und zu kontrollieren sein
	Prototyp ist nur eine begrenzte Simulation des schlussendlichen Produktes (flach/tief)

Einsatzgebiet

• Diskutieren von Design-Lösungen im Projekt

• Testen von Design-Lösungen mit Benutzern

• Vergleich von verschiedenen Varianten

• Präsentation für Überzeugungsarbeit

• Prototyp als Basis für Styleguide

• Prototyp als Spezifikation

Arten von Prototypen

Bei Prototypen wird oft von der "fidelity" (deutsch: Wiedergabetreue) gesprochen. Dabei unterscheidet man zwischen einem Lo-Fi resp. Hi-Fi Prototypen. Lo-Fi ist eher eine Skizze, wobei Hi-Fi ein sehr durchgedachter, designter Prototyp ist.

Pen & Paper

Ein Stift und Papier findest du noch in jedem Büro. Viele UX-Designer haben oft einen kleinen Block und einen Stift (z.B. Moleskine) dabei. Deine geniale App-Idee kannst du auch unterwegs mit einem Pen & Paper Prototyp festhalten, die Website UIStencils bietet dir eine Vielzahl von möglichen Tools fürs Prototyping.

Mögliche Vorlagen gibt es z.B. hier: https://www.sketchappsources.com/category/mobile.html

Wireframing

Anders als ein „Mock-up“ ‒ ein visueller Prototyp ‒ wird der Begriff Wireframe (Drahtmodell) dazu benutzt, einen sehr frühen konzeptionellen Entwurf einer Website oder eines Software-Frontends darzustellen. Dabei spielt die Gestaltung und Funktion noch keine Rolle. Das Augenmerk liegt auf der Anordnung von Elementen und der Benutzerführung (UX, Benutzererfahrung).

Es gibt zwei Arten eines Wireframes:

• Zum einen statische Wireframes:

  Dies ist eine schematische Darstellung einer einzelnen Seitenvorlage. Hier werden die grundlegenden Elemente der Seite festgehalten. Ein konzeptionelles Layout sollte erkennbar sein. Ein vollendetes Design ist nicht notwendig.

• Des Weiteren gibt es auch dynamische Wireframes.

  Diese bestehen aus mehreren Seiten, die als funktioneller Prototyp interaktiv miteinander verknüpft sind. So ist eine Navigation von einer zur anderen Seite möglich. Dynamische Wireframes werden häufig durch einen beiliegenden Navigationsbaum oder ein Flussdiagramm ergänzt, welche beide die Struktur abstrahieren und leichter verständlich machen.