1. Einführung in
Paper Prototyping
agile design camp, Hamburg, 23.07.2011
@tow8ie

2. Einfachheit

3. Kommunikation

4. Respekt

5. Mut

6. Feedback

7. Evernote

8. “Designing the new interface was a daunting task.
First, we made an advanced prototype by cutting
out a roughly-tablet-sized piece of cardboard,
writing ‘iPad’ on it, and carrying it around for a few
days. We would bring it to meetings, hold it in
different ways, and try to imagine what Evernote
would feel like on this form factor. We looked
pretty stupid and people made fun of us
mercilessly. We printed out Photoshopped UI
screens and taped them to the ‘iPad’ to get an idea
of font sizes and finger placement. We learned a
lot.”

9. FAIL
“We tried taking our existing iPhone UI and making
it bigger.”

10. FAIL
“We tried taking our existing Mac UI and making it
smaller.”

11. “We […] threw away all of our previous designs.
After some trial and error, we got something that we
fell in love with.”

13. “Paper prototyping is a variation of usability testing
where representative users perform realistic tasks
by interacting with a paper version of the interface
that is manipulated by a person ‘playing computer’,
who doesn’t explain how the interface is intended
to work.”

14. User

15. Computer

16. Moderator

17. Beobachter

18. Wichtig
‣ Test immer vorbereiten!
‣ genaue Definition des zu testenden
Interface-Konzepts
‣ alle Materialien fertigstellen, die benötigt
werden, um den Test durchzuführen

20. Vorteile
‣ frühes Feedback
‣ schnelle Änderungen
‣ verbessert Kommunikation mit allen
Projektbeiligten, insb. mit dem Kunden
‣ keine technischen Vorkenntnisse nötig
‣ lädt zum Herumspielen ein

21. Größter Vorteil
“Most software is like [an iceberg] -- there's a pretty
user interface that takes about 10% of the work, and
then 90% of the programming work is under the
covers.”
Joel Spolsky
Testbare Interaktion vor der Implementierung

22. Figures out what it
should do or be.
Designer

23. Makes it happen.
Entwickler

24. understands the contraints of the technology and
tools used to implement the interface
Techniker

25. Beteiligung
Das ganze Team:
‣ Designer
‣ Entwickler
‣ Techniker
‣ Nicht-Techniker
Techniker und Nicht-Techniker sollten sich die
Waage halten.
Technik hat das letzte Wort.

26. Usability Test -
wesentliche Bestandteile

27. Ziele/Zielgruppe definieren

28. Aufgabe für Ziel-Benutzer
erstellen

29. Papierprototyp erstellen

30. selbst durchspielen/testen

31. testen und verbessern

32. festhalten/kommunizieren

33. Usability Test
‣ Ziele und Zielgruppe definieren
‣ Aufgaben für die Zielgruppe erstellen
‣ Papierprototyp erstellen
‣ Selbst durchspielen/testen
‣ Testen und nach jedem Test verbessern
‣ Erkenntnisse festhalten und
kommunizieren

34. Fragerunde
@tow8ie
tow8ie@gmail.com