Wireframe, Mockup und Prototyp – Definition und Abgrenzung

VN:F [1.9.22_1171]
Bewertung: 3.1/5 (14 Bewertungen)

Wireframes, Mockups und Prototypen können Produktmanagern bei der Konzeptione von Webseiten und Features ungemein helfen. Jede der drei Visualisierungsformen wird überlicherweise in verschiedenen Stadien der Produktkonzeption genutzt. Oftmals herrscht aber Verwirrung darüber was sich hinter dem jeweiligen Begriff genau verbirgt und wie Wireframes, Mockups und Prototypen voneinander abgegrenz werden. Aufklärung darüber finden Sie hier.

Ein Feature durchläuft verschiedene Phasen von der Idee bis zur Implementierung. Dabei ist es für den Produktmanager wichtig in jeder der Phasen sich selber und anderen einen Eindruck von dem Feature zu vermitteln. Die Visualisierung wird dabei von Pahse zu Pahse genauer, detailierter und funktionaler.

Wireframes

vergleich_überblick_top_wireframe-software

Beispiel für ein Wireframe

Zu Begin der Featurekonzeption nutzt der Produktmanager Wireframes um sich selber oder Entwicklern, Designern und Textern einen rudimentären Eindruck von der Idee bzw. dem Feature zu vermitteln. Die visualisierung stellt die Seitenstruktur und Featureumsetzung sehr grob und schematisch dar. Der Wireframe wird in schwarz-weiß-grau angefertigt und gleicht dadruch einer Skizze oder Bleistiftzeichnung. Dieses Art der Visualisierung ist sehr schnell, einfach und günstig zu erstellen. Dazu genügt Papier und Bleistift oder eine entsrechende Wireframe-Software.

Mockups

Vergleich und Übersicht der besten Mockup-Software

Beispiel für ein Mockup

Wenn das Feature und die Userinteraktion anhand von Wireframes hinreichend besprochen und abgestimmt ist, kann im nächstem Schritt das Wireframe in ein Mockup übertragen werden. Dabei wird der Wireframe in das Layout und Design der Webseite bzw. Software überführt. Ein Mockup enhält neben der Funtkion auch den Inhalt/test sowie das Design der Seite und stellt damit ein Visual Design dar. Sie können beispielsweise verwendet werden um Feedback von Stakeholdern einzuholen.

Prototyp

Prototypen sind ein genaue und detailreiche Visualisierung des geplanten Features bzw. Produktes. Zusätzlich zum Mockup ermöglichen Sie die Simulation der Userinteraktion mit dem Produkt. Prototypen werden oft auch als Klickdummys bezeichnet. Sie eignen sie sich ideal für User Tests, um die Funktion und Wirksamkeit vor der eigentlichen Feature-Programmierung zu überprüfen. Prototypen können in der Regel mit geringem Entwicklungsaufwand in HTML und CSS programmiert oder mit einer Prototyp-Software realisiert werden.

 

Ähnliche Beiträge zu diesem Thema: Überblick über die beste Wireframe & Prototyp-Software

Wireframe, Mockup und Prototyp - Definition und Abgrenzung, 3.1 out of 5 based on 14 ratings
Michael Dierck

Michael Dierck

Michael Dierck ist seit über 12 Jahren erfolgreich im Produktmanagement von Startups und internationalen Unternehmen wie eBay, StudiVZ oder MyHammer tätig. Aktuell leitet er das Produktmanagement von momox.de und ist Betreiber von produktmanagementpraxis.de.

Hinterlasse eine Antwort

Pflichtfelder sind mit * markiert.


Top