Wie und warum Prototypen für gutes Design zwingend sind

Nichts bringt Sie näher an die Funktionalität des Endprodukts als das Prototyping. Während Wireframes die Blaupause skizzieren und Mockups die Haptik und Textur des Designs zeigen, ist es der Prototyp, der die Erfahrung zum Leben erweckt. hinter der Benutzererfahrung. Diese schöne Handlungsaufforderung sieht zwar auf dem Bildschirm großartig aus, Sie können jedoch erst beim klickbaren Prototyp wissen, ob dies für Endbenutzer funktioniert. Prototypen helfen nicht nur, einen Proof of Concept zu erbringen, sondern sie legen auch noch mehr Nutzbarkeitsfehler hinter den Drahtgittern und Modellen offen.

Wie setzen wir diese Maßnahmen tatsächlich ein, um gegen Notfall-Stakeholder-Meetings, endlose Revisionen und schmerzhafte späte Nächte in der Entwicklungsphase zu schützen? Während wir uns zuvor mit dem richtigen Prototyping im Leitfaden zu UX Design Process & Documentation befasst haben, wollen wir uns eingehender damit befassen, wie Prototyping den Erfolg eines Produkts bewirken oder brechen kann. In diesem Beitrag werden zunächst die wichtigsten Gründe für den Prototypen untersucht und wie Prototypen die Zusammenarbeit, das Design und die Usability-Tests verbessern.

Quelle: Bill Buxton, über Donna Lichaw

5 Gründe, warum Sie Prototypen benötigen

Das Überspringen von Prototypen kann zwar einige Zeit beim Design einsparen, dieser Überschuss kann jedoch bei der Entwicklung um ein Vielfaches verloren werden. Wenn Leute Jeans anprobieren, bevor sie sie kaufen und Autos testen, bevor sie den Scheck unterschreiben, ist es nur sinnvoll, Ihre Entwürfe interaktiv zu testen, bevor sie in die Entwicklung gehen. Interaktion ist schließlich, wie Benutzer auf die Entwurfslösungen für ihre Probleme zugreifen.

Quelle: Product Management Tree Swing

Um besser zu verstehen, warum Sie Prototypen erstellen sollten, schauen wir uns Todd Zaki Warfel an, den Designer, der das Buch über Prototyping verfasst hat. buchstäblich. Warfel fasst die Punkte seines Buches in einer Diashow zusammen, in der wir alle relevanten Gründe für das Prototyping sehen können. Diese variieren je nach Konstrukteur und ihren Bedürfnissen. Zu den allgemeinen Vorteilen gehören:

  • Kommunikation & Zusammenarbeit - Es ist eine Sache, die Anforderungsdokumentation zu besprechen, aber es ist eine völlig andere Ebene der fantasievollen Zusammenarbeit, wenn beide Parteien mit einem Prototyp spielen und Einschränkungen und Möglichkeiten ausloten können. Die Dokumentation kann falsch interpretiert werden, aber die Erfahrungen werden geteilt.
  • Messen Sie die Machbarkeit und reduzieren Sie gleichzeitig den Abfall - Wireframes, Mockups und Anforderungsdokumente leben auf Papier, nicht in der Realität. Durch Prototyping können Teams experimentieren, wodurch sie die Möglichkeit haben, kostengünstig zu versagen und gleichzeitig mehr zu lernen. Sehen Sie sich einfach an, wie Prototypen dazu beigetragen haben, die Schätzgenauigkeit um 50% zu steigern, während die Aufklärungsanforderungen um 80% reduziert wurden.
  • Verkaufen Sie Ihre Idee - Prototypen eignen sich hervorragend für das Pitching, wenn Sie mit skeptischen Kunden arbeiten. Das Erleben der realen Website oder App beweist Ihre Vision mehr als eine wortwörtliche Beschreibung oder ein mit Notizen festgehaltenes Modell.
  • Testen Sie die Benutzerfreundlichkeit früher - Durch das Testen eines Prototyps durch den Benutzer können Sie Probleme früher finden und beheben, wodurch Sie sich umständlich den Umgang mit ihnen ersparen, wenn sie im Code zementiert werden. Die gleiche Fallstudie, die oben zitiert wurde, konnte dank Prototyping um 25% reduziert werden.
  • Legen Sie Ihre Design-Prioritäten fest - Wir empfehlen frühzeitiges Prototyping, da die Priorisierung des Interaktionsdesigns Sie bei statischen Entwurfsentscheidungen in der Realität verankert. Die Visuals müssen die Erfahrung erfüllen, nicht umgekehrt.

Nicht jeder Prototyp muss aufwendig und aufwendig sein - in der Tat glauben manche Denkschulen an eine rasche, kostengünstige Form des Prototyping. Der Punkt ist, dass es fast immer von Vorteil ist, einige Ressourcen für das Prototyping bereitzustellen, wie viele davon von Ihren spezifischen Bedürfnissen abhängen.

Wie Prototypen Zusammenarbeit und Kommunikation verbessern

Zeigen ist immer besser als zu erzählen, und Erfahrung ist König. Wenn Menschen mit Ihren Ideen interagieren können, können sie sie besser verstehen. Dies funktioniert sowohl extern - Pitching gegenüber Kunden und Stakeholdern - als auch intern - bei der engeren Zusammenarbeit mit Ihrem Team oder bei der Zusammenstellung einer neuen Idee (oder zumindest mit ihr zu spielen, bevor sie gestraft wird).

Prototypen verdeutlichen die interne Kommunikation auf verschiedene Weise.

Zunächst wird eine Verbindung zwischen Designern und Entwicklern hergestellt, die beide das gleiche Ziel haben. Wie im Leitfaden zum Prototyping beschrieben, verwenden verschiedene Abteilungen unterschiedliche Fachjargon und Jargon, ein Prototyp durchbricht jedoch alle Barrieren. Prototypen sind das Spielzeug des Designs, und wenn etwas Spaß macht, sind die Menschen eher darauf aus, ihre Wachsamkeit zu verlieren und die verrückten Ideen zu erkunden, die vielleicht funktionieren. David Yerba, Gründer und CEO von Emmet Labs, bringt es mit sich, dass Prototypen die richtigen Leute im Raum dazu bringen, auf die richtige Art und Weise zu kommunizieren.

In UXPin ist die Zusammenarbeit an Prototypen aufgrund der Live-Präsentations- und Kollaborationsfunktionen selbstverständlich. Mit Iteration Tracking und Live-Kommentierung können Wireframes und Prototypen in Echtzeit diskutiert und präsentiert werden, ohne dass E-Mails erforderlich sind.

Zweitens beschreibt Yerba in demselben Artikel auch die Vorteile des Prototyping für formale Präsentationen. Kunden und Stakeholder können eine Beschreibung leicht falsch interpretieren, selbst wenn sie mit überzeugenden Recherchen oder pixelgenauen Modellen geliefert werden. Ein interaktiver Prototyp erfordert dagegen wenig Beschreibung. Prototypen helfen Stakeholdern, über die Erfahrung nachzudenken, anstatt sich auf die Kritik zu konzentrieren, visuelle Elemente zu kritisieren, nur weil sie direkt vor ihren Augen liegen. Nebenbei bemerkt, Prototypen verleihen Präsentationen auch Flair - Menschen können die "Magie" buchstäblich erleben. Design: Es ist der Unterschied zwischen der Blaupause und der Erkundung des Musterhauses.

Ein Prototyp ist eine mächtige Waffe für jede Präsentation.David und Tom Kelley, Gründer und Partner von IDEO, schreiben dem zu, was sie nennen? Boyle's Law? (benannt nach einem der Prototypen von IDEO, Dennis Boyle). Das Boyle'sche Gesetz ist einfach, aber effektiv: Gehen Sie niemals ohne Prototyp zu einer Besprechung. In Bezug auf ihre kommunikativen und überzeugenden Fähigkeiten macht diese Präsentationshilfe oft den Unterschied zwischen "Ja" und "Ja". oder ein? nein?

Wie Prototypen Design ins Gleichgewicht bringen

Prototyping ist die Phase, in der das Konzept real wird, und erfordert sowohl Kreativität mit praktischer Anwendbarkeit als auch Vernunft mit Intuition.

Quelle: Benutzerablauf für die Suchfunktion bei Kickstarter

Philip van Allen, Professor und Designer am Art Center College of Design, glaubt, dass Prototypen Entscheidungen unterstützen, die nicht durch Parameter beschrieben werden können. Für den Designer gibt es drei Hauptvorteile beim Prototyping:

  • Entscheidungen fällen - Wichtige Designentscheidungen in Bezug auf Ergonomie, Form, Funktion und Produktion - manchmal alle gleichzeitig - werden in der Prototyping-Phase abgeschlossen. Ein funktionierender Prototyp gibt Ihnen sofort Feedback, damit Sie eine fundierte Entscheidung treffen können (nicht nur eine heuristische).
  • Fokus - Mit konkreten Rückmeldungen für alle Sinne (anstatt nur zu raten, wie das Endprodukt aussehen wird), bringen Sie Prototypen in die Realität des Anwenders. UX-Prioritäten werden deutlich, wenn Sie sie direkt vor Ihnen erleben können.
  • Parallelität - Der Designprozess muss nicht sequentiell sein. Das Sammeln von Feedback, das Festlegen von Anforderungen und das Brainstorming neuer Konzepte und Interaktionen können alle gleichzeitig während des Prototyping erfolgen. Wenn dies richtig gemacht wird, ergänzen sie sich (wir besprechen die Prozesse später in diesem E-Book detailliert).

Woher wissen wir das? Als wir an der Verbesserung der Yelp-Website arbeiteten, bauten wir zuerst ein Lo-Fi und dann einen Hi-Fi-Prototyp. Anfangs war die Interaktivität einfach, aber bei der Gestaltung wurden wir mit Entscheidungen und Hindernissen konfrontiert, die in einem statischen Design nicht auftauchen würden. Durch Prototyping wurden UX-Probleme identifiziert und gelöst, wie z. B. der Übergang von der Startseite zu den Suchergebnissen, ohne den Benutzer plötzlich mit zu vielen Informationen zu überfordern.

Um es kurz zu machen: In der Prototyping-Phase konnten wir unsere konzeptionellen Ziele mit unserer praktischen Realität verbinden. Es war, als visuelles Design und Interaktionsdesign ins Gleichgewicht kamen.

Wie Prototyping Usability-Tests einfacher macht

Der Grund, warum wir die Aufgaben in Wireframes, Mockups und Prototypen unterteilen, liegt darin, dass jede Aufgabe einen anderen Zweck hat.

Indem wir uns nur auf die Strukturierung im Wireframing konzentrieren, können wir zum Beispiel eine solide Struktur erstellen, ohne uns mit Modell-Visuals oder Prototyp-Funktionen abzulenken. Während Wireframing und Mockups eher kreativ und abstrakt sind, geht es beim Prototyping darum, Ideen niederzuschlagen und Ideen zum Leben zu erwecken - und dazu müssen Usability-Tests richtig sein.

Quelle: Usability-Test für Prototypen

Um eine Analogie zu ziehen, sind Prototypen für das Endprodukt die Skizzen für Wireframes / Mockups. Prototyping ist eine Möglichkeit, mit Interaktionen zu skizzieren. Um ein grobes Modell der Benutzerfreundlichkeit zu erstellen, verfeinern und perfektionieren.

Dafür sind Usability-Tests unerlässlich. Versuchen Sie, wie in der Anleitung zum Prototyping empfohlen, auf jeder Stufe des Prototyps Usability-Tests durchzuführen, damit die Wiedergabetreue und Funktionalität in die richtige Richtung gehen. Während Usability-Tests ein dichtes Thema sind (in einem anderen E-Book behandelt), sind hier einige Grundlagen zu beachten:

  • Kenne das Produkt - Kennen Sie Ihr Produkt gut und was Sie testen möchten, bevor Sie beginnen. Wenn Sie Usability-Tests mit einem Produkt durchführen, das sich unregelmäßig verhält, oder wenn Sie nicht sicher sind, was getestet werden muss, sind die Ergebnisse ungültig.
  • Rekrutieren Sie die richtigen Testteilnehmer - Es ist möglich, dass Ihr Produkt auf eine Zielgruppe ausgerichtet ist. Stellen Sie also sicher, dass Ihre Testteilnehmer diese Gruppe repräsentieren. Qualitative Tests können mit nur 5 Personen durchgeführt werden, quantitative Tests erfordern mindestens 20 Personen für die statistische Signifikanz. Eine vollständige Liste der Tipps zur Rekrutierung durch Benutzer finden Sie in der Liste der 234 Tipps und Tricks von Jakob Nielsen, die Personen für Usability-Tests rekrutieren.
  • Richten Sie den richtigen Test ein - Es gibt viele verschiedene Arten von Usability-Tests und verschiedene Methoden, um sie durchzuführen. Wählen Sie diejenige, die Ihrem Budget, Ihrem Zeitplan und Ihren Projektanforderungen entspricht.
  • Ergebnisse analysieren - In diesem Fall werden aus Usability-Daten Design-Erkenntnisse. Binden Sie Ihre Ergebnisse so schnell wie möglich in Ihre Iterationen ein.

Quelle: Warum Sie nur mit 5 Benutzern testen müssen

Laden Sie das kostenlose E-Book The Guide to Usability Testing herunter, um zu erfahren, welche Arten von Usability-Tests für Sie geeignet sind und wie Sie sie durchführen können.

Warum Prototyping für Mobile erforderlich ist

Während das Prototyping für Desktop-Produkte nur empfohlen wird, ist es für mobile Geräte obligatorisch. Mobile Geräte werden in mehr Umgebungen als Desktopgeräte verwendet, was zu weitaus mehr Benutzerszenarien und Anwendungsfällen führt. Dies bedeutet natürlich, dass Sie zwar nicht mit Prototypen für Desktop arbeiten können, mit Mobile jedoch kein solches Glück haben.

Rachel Hinman, Senior UX Researcher des Nokia Research Center, stimmt zu, dass der Bedarf an mobilem Prototyping den ohnehin wichtigen Bedarf im Desktopbereich bei weitem überwiegt. Schauen Sie sich die folgende Tabelle an, basierend auf Hinmans Diashow, um einen Vergleich zwischen der Stabilität der beiden zu sehen:

Donna Lichaw, Produktspezialistin bei Greatnorthelectric, stimmt dem ebenfalls zu und vergleicht allgemeine Gründe für Prototypen mit mobilspezifischen Gründen. Gesten fügen eine völlig neue Dimension der Interaktivität hinzu, die für den Desktop gar nicht vorhanden ist. Prototyping ist daher die einzige Möglichkeit, die nahezu endlosen Kombinationen von Gesten und Animationen zu testen.

Wir haben festgestellt, dass die überzeugendsten Gründe für das mobile Prototyping die folgenden sind:

  • Flow macht oder bricht das mobile Erlebnis - Da mobile Erlebnisse mehrere Seiten umfassen, sollte der Benutzerfluss ganz oben auf der Liste der Design-Prioritäten stehen. Besuchen Sie einfach UXArchive, um zu sehen, wie einige der Top-Unternehmen wie Snapchat, Google Maps und andere ihre mobilen Datenflüsse konstruieren.
  • Animationen machen das Erlebnis lustig und begehrenswert - Animationen sind das Kernelement für mobile Mikrointeraktionen, wobei durch Gesten ausgelöste Effekte wie Timing, Geschwindigkeit und Schwung ein Element des Spaßes sind und gleichzeitig visuelles Feedback und Erschwinglichkeit bieten. Sehen Sie sich diesen Artikel an, um die gegensätzlichen Ansichten der Animationen von Google Material Design und Apple iOS zu sehen. Anschließend finden Sie 20 Beispiele für bewährte Vorgehensweisen.
  • UX-Fehler sind teurer - Die Kosten für mobile Apps liegen zwischen 6.000 USD und 200.000 USD, wobei die durchschnittlichen Kosten bei 6.400 USD liegen. Der Umgang mit dem App Store kann auch Kopfschmerzen bereiten, so dass einige Prototypen im Vorfeld viel Zeit und Geld einsparen können.

UXPin ermöglicht reaktionsschnelles, animiertes Prototyping und integrierte Usability-Tests. Erstellen Sie Ihre Aufgaben und beobachten Sie die Bildschirm- und Gesichtsreaktionen Ihres Benutzers, während diese mit Ihrem Design interagieren. Nach jedem Test können Sie einen Videoclip erstellen, der jedes Wort, jede Reaktion und jeden Klick erfasst.

Wegbringen

Wir sind immer Prototyp und raten anderen, dasselbe zu tun. Obwohl wir verstehen, dass bestimmte Einschränkungen das Prototyping für einige Unternehmen schwieriger machen können, empfehlen wir dringend, die Funktionsweise zu verbessern, auch wenn dies nur ein begrenzter Prototyp ist. Die Vorteile überwiegen bei Weitem die Kosten: bessere Zusammenarbeit zwischen den Teams, frühzeitiges Finden / Beheben von Problemen, Verbessern vorhandener Entwürfe und Kommunizieren durch Handeln statt durch Worte. Diese Vorteile sind die zusätzliche Zeit und Mühe wert.

Laden Sie den kostenlosen Leitfaden zum Prototyping herunter, um mehr praktische Tipps zum Prototyping mit niedriger oder hoher Wiedergabetreue zu erhalten. Erfahren Sie, wie und wann Sie verschiedene Prototyping-Tools und -Taktiken verwenden. Best Practices von Zurb, Google Ventures, IDEO und viele mehr. Tipps von Experten wie Jeff Gothelf, Todd Zaki Warfel und anderen sind ebenfalls enthalten.