In unser Artikelreihe über den Product Design Sprint zeigen wir euch die besten Lean UX Methoden mit denen ihr innerhalb kürzester Zeit neue und innovative Produkt-Konzepte im Team entwickeln könnt. Am vierten Tag des Product Design Sprint werden gemeinsam die Grundlagen für einen Vision Prototype gelegt, der dann von den Designern ausgestaltet wird. Ein Vision Prototype macht das Produkt-Konzept visuell greifbar, so dass man im anschließenden User Value Test schnell herausfinden kann, ob das Produkt den Nutzern einen Mehrwert bietet oder nicht.
Was bisher geschah
Wer erst jetzt in diese Artikelreihe einsteigt und sich fragt, was ein Product Design Sprint denn genau ist: Mit einer Reihe von schlanken UX Methoden zeigen wir Euch, wie ihr innerhalb von fünf Tagen in einem interdisziplinären Team gelungene Konzepte und neue Produkte nah an den Bedürfnissen und Wünschen der Nutzer gestalten könnt. In den ersten drei Tagen haben wir mit Hilfe einer Experience Map und Storyboards neue und nutzerzentrierte Produkt-Ideen entwickelt. In einem Design Studio Workshop wurde dann ein komplettes Produkt-Konzept für diese Ideen mit Stift und Papier skizziert. Die Sketches aus dem Design Studio Workshop sind die Grundlage für den Vision Prototype, den wir am vierten Tag des Product Design Sprints erstellen.
Thema Vision Prototype – Was ist das?
Ein Vision Prototype ist ein High Fidelity Prototype der ein Konzept visualisiert und so greifbar und verständlich macht. High Fidelity bedeutet hier das der Prototyp für zum Beispiel eine iPad App bereits eine Design-Anmutung hat, aber noch kein in allen Details fertig ausgestaltetes visuelles Design.
Bei einem Vision Prototyp reicht es vollkommen, wenn der Prototyp nur die wesentlichen User Flows abbildet. Also diejenigen Anwendungsszenarien, die zur Darstellung des Konzeptes relevant sind (Beispiel: Ein Gruppen-Administrator kann eine neue Gruppe anlegen, Ein Nutzer in einem sozialen Netzwerk kann sein eigenes Profil anlegen). So spart ihr Zeit in der Vorbereitung und fokusiert euch auf das was wirklich wichtig ist.
Ein Vision Prototype ist die Grundlage für den anschließenden User Value Test, der am fünften Tag des Product Design Sprints stattfindet. So könnt ihr eure Ideen und Konzepte validieren und herausfinden, ob eure Zielgruppe Interesse an dem Produkt hat oder nicht. Und das bevor es in die konkrete Umsetzung geht. Abhängig von vorhandenen Materialien und dem Produktkonzept etc. kann die Erstellung eines Vision Prototyps 1 Tag oder auch etwas länger dauern. Zu den Ansätzen in der Erstellung und worauf es dabei ankommt steigen wir jetzt etwas tiefer ein.
Neben dem Einsatz des Vision Prototypes zur frühen Visualisierung und Validierung von neuen Produkt-Ideen könnt ihr einen Vision Prototype auch für die folgenden Sachen super einsetzen:
- Kommunikation der Produkt-Idee an Stakeholder
- Greifbar machen der Produkt-Strategie für das Team
- Bewahrung des ganzheitlichen Produkt-Fokus (gerade in agilen Projekten droht man leicht in den Details zu versinken)
- Visualisierung und Nachhalten der Vision wo sich das Produkt in den nächsten 2-3 Jahren hinentwickeln soll
Marty Cagan hat in seinem Blog auch einen lesenswerten Artikel zum Thema Vision Prototyping Visiontyping and the hands-on executive, wo er beschreibt, wie Visiontypes dazu genutzt werden kann eine Produkt-Innovations Kultur im Unternehmen zu fördern.
Vision Prototyping – So wird’s gemacht
Schritt 1: Den Umfang des Prototypen festlegen
Es reicht vollkommen aus, wenn der Vision Prototype am Anfang nur die wesentlichen Anwendungsszenarien abbildet. Zu Beginn des vierten Tages legt ihm Team also zunächst fest, welche Anwendungsszenarien notwendig sind. Am Besten geht das, wenn ihr euch überlegt, was genau ihr im User Value Test überhaupt herausfinden wollt. Wer sich jetzt fragt, was ein User Value Test überhaupt ist – Rainer hat in seinem Artikel “Der richtige Einsatz von User Research” die Unterschiede und Ziele der jeweiligen User Testing Arten beschrieben.
Ein Ziel für den User Value Test kann zum Beispiel sein, wie viel Interesse die Zielgruppe überhaupt hat eine Community zu einem bestimmten Thema aufzubauen. Oder auch ob sie grundsätzlich bereit wären für dieses Produkt etwas zu bezahlen.
Anhand der Ziele könnt ihr dann die jeweiligen Anwendungsszenarien priorisieren und den entsprechenden Prototype Flow festlegen. Nun wählt ihr die entsprechenden Sketches von dem Design Studio Workshop vom dritten Tag des Product Design Sprint aus. Hier habt ihr dann die Gelegenheit die besten Interface-Ideen zusammenzustellen und gemeinsam zu überlegen, was man noch besser machen kann.
Der fertige Prototype Flow zeigt die einzelnen Seiten, die anschließend im Vision Prototype abgebildet werden sollten.
Schritt 2: Die visuelle Design-Richtung abstimmen
Ist der Prototype Flow einmal festgelegt kann abschließend im Team die gewünschte Design-Richtung besprochen werden. Hierfür hat idealerweise jeder auf Basis der zuvor definierten Product Design Principles Ideen und Inspirationen mitgebracht, die auf einem Mood Board aufgehängt und dann gemeinsam bewertet werden.
Alternativ können direkt vom Designer oder dem Design Team entsprechende Style Tiles für die Abstimmung vorbereitet werden, die die wichtigsten Design Elemente wie Schriften, Farben, Buttons etc. abbilden. Einen schönen Artikel zum Thema Style Tiles findet ihr bei A List Apart.
Wie ihr zum Thema visuelle Design-Richtung vorgeht hängt stark davon ab, wie viel Zeit ihr habt und wie die Rahmenbedingungen sind. Es kann schließlich sein, dass das visuelle Design schon steht und ihr komplett auf bestehende Design-Elemente aufsetzen könnt. Dann könnt ihr euch im Zweifel diesen Schritt auch sparen.
Schritt 3: Jetzt geht es ans Prototyping
Nachdem der Prototype Flow und die visuelle Richtung geklärt sind, kann das Design Team oder der Designer mit dem Prototyp loslegen. Schöner und produktiver ist man hier tatsächlich zu Zweit, da man sich dann gut die Bälle hin- und herspielen kann. Im Blog von Cooper gibt es auch einen schönen Artikel zum Thema Design Pairs und wie wichtig diese sind.
Das Prototyping kann mit verschiedenen Tools gemacht werden, am Bekanntesten ist sicher immer noch Axure. Letztlich sollte man immer das Tool wählen mit dem man sich am Wohlsten fühlt. In Zeiten von Bootstrap und Mobile Apps wird es für den Designer auch immer leichter und zeitgemäßer seine Prototypen direkt mit den entsprechenden Tools zu bauen, also zum Beispiel direkt in XCode, wie in dem Artikel “How to Prototype in Xcode Using Storyboard” von Meng To beschrieben. Auch Framer.js geht in diese Richtung mit einer minimalen JavaScript Variante. Aber auch in Keynote oder mit Powerpoint kann man einfache High Fidelity User Flows für einen Test abbilden. (Kleine Frage am Rande: welche Prototyping Tools verwendet ihr derzeit? Was für ein Tool bietet sich eurer Meinung nach für das Vision Prototypen besonders an? Feedback gerne einfach über die Kommentare).
Wie lange die Erstellung des Vision Prototype dauert hängt übrigens stark von den Rahmenbedingungen ab. Wenn der Prototype nur 1-2 nicht besonders komplexe Anwendungsszenarien umfasst und die Design-Elemente schon stehen, geht es natürlich schneller. Eine code-basierte Pattern Library kann dann beim Prototyping sehr hilfreich sein, was Wolf ja derzeit versucht bei OTTO mit zu etablieren. Mehr darüber findet ihr in seiner Artikelreihe über die OTTO Pattern Library. Für komplexere Vision Prototypes und die Gestaltung eines ersten visuellen Designs solltet ihr natürlich mehr Zeit einplanen, dass werdet ihr an einem Tag nicht schaffen.
Was habt ihr am Ende des Tages erreicht?
Am Ende des vierten Tages habt ihr es geschafft aus euren konzeptionellen Produkt-Ideen einen greifbaren und visuellen Prototypen zu machen, der euch hilft eure Idee zu testen und anderen verständlich zu machen. Am fünften Tag des Product Design Sprints geht es dann darum, eure Idee mit den passenden Nutzern und den richtigen Fragen zu testen und ein besseres Gefühl dafür zu bekommen, ob das Konzept eurer Zielgruppe eine wirklichen Mehrwert bietet oder nicht.
Tipps & Tricks
Zum Ende des Artikels wollen wir euch nun noch ein paar Tipp & Tricks mitgeben, auf die es sich lohnt beim Vision Prototypen zu achten.
Tipp 1: Fokussiert euch
Auch wenn ihr mehr Zeit für die Erstellung des Vision Prototypes habt als 1 oder 2 Tage – es ist wichtig sich auf das Wesentliche zu fokussieren. Oft verschwendet man beim Prototyping viel Zeit auf eine bestimmte Funktion mit all ihren Details und verliert dabei den Blick für das große Ganze.
Tipp 2: Nutzt die User Testing Fragen als Rahmen
Wenn ihr den notwendigen Umfang des Vision Prototypen gleich zu Anfang anhand der Fragen aus dem User Value Test ableitet, arbeitet ihr sehr zielorientiert und spart Zeit. Auch wenn ihr nicht direkt einen User Test plant, lohnt es sich trotzdem zu überlegen, welches die wesentlichen Anwendungsszenarien und damit Annahmen sind, die ihr habt (Beispiel: Nutzer laden gerne animierte Bilder in ihr soziales Netzwerk hoch und teilen diese mit Freunden).
Tipp 3: Redet über eure Ideen und zeigt sie
Ein Vision Prototype ist super für einen User Test, aber vergesst bei aller Arbeit und allem Fokus nicht eure Begeisterung auch mit anderen zu teilen. Viel zu viele Ideen existieren immer nur theoretisch oder werden in einer PowerPoint Präsentation beschrieben. Ein Vision Prototyp macht eure Idee greifbar und anschaulich und kann damit neben der Ideen Validierung auch zur Vermarktung der Idee eingesetzt werden.
Alle Links auf einem Blick
Hier findet ihr alle Links aus diesem Artikel zum einfachen Reinschauen und Nachlesen.
Visiontyping and the hands-on executive, gefunden auf svproduct.com:
http://www.svpg.com/visiontyping-and-the-hands-on-executive/
Nutzerbedürfnisse, Nutzwert und Usability – der richtige Einsatz von User Research, auf produktbezogen.de:
https://www.produktbezogen.de/
Style Tiles and How they work, gefunden auf alistapart.com:
http://alistapart.com/article/style-tiles-and-how-they-work
Playing well with others: how to create effective design teams, gefunden auf cooper.com:
http://www.cooper.com/journal/2008/10/playing_well_with_others.html
How to Prototype in Xcode Using Storyboard, gefunden auf blog.mengto.com:
http://blog.mengto.com/prototype-xcode-storyboard/
Bauanleitung für eine Pattern Library, auf produktbezogen.de:
https://www.produktbezogen.de/bauanleitung-pattern-library-3-prinzipien-lean-pattern-library/
Alle Artikel aus dieser Serie:
- Einleitung: Die besten Methoden für kompakte 5 Tage Wozu ist ein Product Design Sprint gut, wie bereitet man ihn vor und was folgt in den fünf Sprint-Tagen?
- Tag 1: Experience Mapping Wie soll der Nutzer idealerweise mit dem neuen Produkt umgehen und welches Erlebnis hat er mit dem aktuellen Produkt?
- Tag 2: Storyboarding Die in der Experience Map gesammelten Erkenntnisse über das Nutzererlebnis in konkrete Stories verwandeln und so neue Perspektiven einnehmen.
- Tag 3: Principles & Paper Prototyping Entschieden, welche Konzepte am Besten zu Marke oder Vision passen und diese Konzepte mit Papier-Prototypen schärfen.
- Tag 4: Vision Prototyping Mithilfe von Screen-Flows Konzept und Idee des Produktes vermitteln uns so den Nutzwert testbar machen.
- Tag 5: User Feedback Talks & Bewertung Vision Prototypen mithilfe von Nutzern validieren und das Feedback zusammentragen.
