Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Das Prototypen-Dilemma

383 views

Published on

Warum es so schwer ist die richtigen Prototypen zu bauen

Unser Prototyping-Repertoire wird immer größer — kontinuierlich werden neue Tools entwickelt, um effizient, integriert und multimodal Produktideen erfahrbar zu machen. Leider hilft uns kein Tool bei der Entwicklung einer sinnvollen Prototyping-Strategie. Wie bauen wir den oder die richtigen Prototypen für den aktuellen Projektkontext, um unsere Fragen zu beantworten, unsere Ziele zu erreichen und unsere Zielgruppen zu überzeugen?

Vortrag von Johannes Baeck auf der IA Konferenz 2018

Published in: Design
  • Be the first to comment

Das Prototypen-Dilemma

  1. 1. Warum es so schwer ist, die richtigen Prototypen zu bauen.
  2. 2. Wo ist überhaupt das Problem? !"#$%&"'"#()"*+),!-.#+/0!
  3. 3. Prototypr Toolbox
  4. 4. lobe.ai
  5. 5. Trotzdem stecken wir immer wieder in einem Dilemma !"#$%&'()*
  6. 6. Vorlage für die Entwicklung Testgegenstand für User Research ODER JOBS
  7. 7. Vorlage für die Entwicklung Testgegenstand für User Research ODER UI Animations auf Screen-Ebene Kritische Stellen in der User Journey ODER FOKUS
  8. 8. ie and earch ODER UI Animations auf Screen-Ebene Kritische Stellen in der User Journey ODER Axure RP treu bleiben InVision Studio ausprobieren TOOLS
  9. 9. Prototyping Jobs Wofür brauchen wir den Prototypen? Prototyping Fokus Welche Aspekte müssen wir umsetzen? Prototyping Tools Wie setzen wir den Prototypen um?
  10. 10. PROTOTYPING JOBS So what do you do, prototype?
  11. 11. Research Iterate Ideate Sell Align Specify Tech Check
  12. 12. RESEARCH Verstehen Nutzer, dass man hier…? ITERATE Sollten wir nicht lieber…? IDEATE Was wäre, wenn wir…? SELL Passt das Produkt in die Strategie? ALIGN Haben wir ein gemeinsames Verständnis von…? SPECIFY Was soll passieren, wenn Nutzer…? TECH CHECK Umsetzbar mit Framework XYZ?
  13. 13. RESEARCH Testnutzer ITERATE Project Team IDEATE Design Team SELL Manage- ment ALIGN Stakeholder SPECIFY Frontend- Entwickler TECH CHECK Backend- Entwickler
  14. 14. CASE STUDY * Der tatsächliche Unternehmensname würde einige unserer Kunden verunsichern Ihr neues Girokonto Persönliche Daten Anrede Titel Vorname Nachname Geburtsdatum Herr Frau TT.MM.JJJJ
  15. 15. Prototypen Projektverlauf PROTOTYP #1 PROTOTYP #2
  16. 16. Jobs Projektverlauf Ideate Sell Tech CheckIterate Align PROTOTYP #1 PROTOTYP #2 Prototypen
  17. 17. Jobs Projektverlauf Ideate Sell Tech CheckIterate Align Research • Formular als One Pager oder schrittweise? • Verstehen Nutzer die Eingaben? • Ist die Formularvalidierung verständlich? PROTOTYP #1 PROTOTYP #2 Prototypen
  18. 18. Formular kann nur „durchgeklickt” werden Fehlervalidierung nur Ansatzweise integriert PROTOTYP #1 Vorname Nachname WEITER Herzlichen Glückwunsch, Ihr neues Konto wurde erstellt. WEITER PROTOTYP #2 Anrede Titel Vorname Nachname Pflichtfeld. Bitte ausfüllen! Pflichtfeld. Bitte ausfüllen! Pflichtfeld. Bitte ausfüllen! Max Mus Testszenario nicht durchspielbar Realistischer Content fehlt!!
  19. 19. PROTOTYP #1 Formular kann nur „durchgeklickt” werden Fehlervalidierung nur Ansatzweise integriert Vorname Nachname WEITER Herzlichen Glückwunsch, Ihr neues Konto wurde erstellt. ! PROTOTYP #2 Anrede Titel Vorname Nachname Pflichtfeld. Bitte ausfüllen! Pflichtfeld. Bitte ausfüllen! Pflichtfeld. Bitte ausfüllen! Max Mus Testszenario nicht durchspielbar Realistischer Content fehlt! Formular kann nur „durchgeklickt” werden Fehlervalidierung nur Ansatzweise integriert Vorname Nachname WEITER Herzlichen Glückwunsch, Ihr neues Konto wurde erstellt. WEITER ! Anrede Titel Vorname Nachname Pflichtfeld. Bitte ausfüllen! Pflichtfeld. Bitte ausfüllen! Pflichtfeld. Bitte ausfüllen! Max MusMax Mus Testszenario nicht durchspielbar Realistischer Content fehlt! Research- ready? Research- ready?
  20. 20. Wie vermeiden wir diese Situation? !"##$%&'() *+
  21. 21. Research Iterate Ideate Sell Align Specify Tech Check
  22. 22. Design-/Projekt-Team/Testnutzer Management/Stakeholder Entwickler Iterate Ideate Research Sell Align Specify Tech Check Prototyp #2 Prototyp#1 Prototyp #2 Prototyp #2 Prototyp #1 Prototyp #3 Prototyp #4
  23. 23. PROTOTYPING FOKUS What‘s the minimal viable prototype?
  24. 24. EndproduktPrototyp Fidelity
  25. 25. Fokus Visual Design und Mikrointeraktion
  26. 26. I’ve got 99 problems, but a 0.3 Sec Ease Out Animation ain’t one
  27. 27. User Journey Visual Design Physische Form Mikro- interaktion Intelligenz Inhalt & Daten Nutzungs- kontext Technische Basis Persönlich- keit
  28. 28. CASE STUDY * Der tatsächliche Unternehmensname würde einige unserer Kunden verunsichern
  29. 29. AI Content Mockups
  30. 30. User Journey Visual Design Physische Form Mikro- interaktion Intelligenz Inhalt & Daten Nutzungs- kontext Technische Basis Persönlich- keit
  31. 31. Voice Prototyping mit Sayspring
  32. 32. User Journey Visual Design Physische Form Mikro- interaktion Intelligenz Inhalt & Daten Nutzungs- kontext Technische Basis Persönlich- keit
  33. 33. Wer soll all diese Prototypen bauen? !"##$%&'() *+
  34. 34. Produktiver Prototyp Fokus: Kritische, komplexe Funktionalitäten Konzept-Prototyp Fokus: Übergreifende User Journey Entwickler Designer Nutzer
  35. 35. PROTOTYPING TOOLS One tool to rule them all?
  36. 36. Abraham Maslow Psychologist
  37. 37. Sketch Ist das Prototyping?
  38. 38. Eine interaktive Simulation Alles was eine Idee greifbar macht ODER
  39. 39. Experience Prototypes
  40. 40. Tools for Production Tools for Exploration PLUS
  41. 41. Prototyping Jobs Wofür brauchen wir den Prototypen? Prototyping Fokus Welche Aspekte müssen wir umsetzen? Prototyping Tools Wie setzen wir den Prototypen um?
  42. 42. TAKEAWAYS Finden wir einen Ausweg aus dem Prototypen-Dilemma?
  43. 43. IAs als Wegweiser beim Prototyping !"#$%&!'()#'*+,)-.$/+01-
  44. 44. usability.de GmbH & Co. KG Ihmeauen Ricklinger Straße 5B 30449 Hannover Germany www.usability.de +49 (0)511 360 50 70 info@usability.deinfo@usability.de
  45. 45. SEITE 1 VON 3 Obama GIF mariskahargtay.tumblr.com/post/78283008524 Prototypr Toolbox www.prototypr.io/toolbox Lobe.ai www.lobe.ai Tick Tock GIF https://www.reddit.com/r/gifs/comments/3sh5u6/ti ck_tock_clock/ Experience Prototypes https://chetmhcid.wordpress.com/2014/01/
  46. 46. SEITE 2 VON 3 Obama/Trudeau GIF gawker.com/justin-trudeau-finally-fucked-up- 1782834237 Will Ferrell GIF www.reddit.com/r/reactiongifs/comments/21e10z/ mrw_my_friend_tells_me_that_my_crush_texted_me Jay-Z GIF jiggaman4.tumblr.com/post/35175005957/because -im-young-and-im-black-and-my-hat-is-real Sayspring www.sayspring.com
  47. 47. SEITE 3 VON 3 Shrug Compilation GIF www.reddit.com/r/funny/comments/3iyyle/how_do_ i_get_to_the_front_pa/ Sketch www.sketchapp.com Experience Prototypes chetmhcid.wordpress.com/2014/01 Polar Bear GIF evil-penguins.tumblr.com/post/ 64178927503/evil-penguins-armageddon

×