This document discusses paper prototyping as a cheap and quick low-fidelity design approach. It emphasizes using personas, scenarios, user stories, and use cases to understand user goals and develop paper prototypes that visualize the user's process of achieving their goals. Examples of paper prototyping techniques are provided, such as simple sketches, wireframes, storyboards, and using post-it notes. The purpose of paper prototyping is to communicate ideas cheaply and quickly, lower barriers to design changes, and allow designs to be tested with users.

1. Paper Prototyping
A cheap and quick lo-fi design approach
Tallinn Winter School / Experimental Interaction Design 2014

2. Recap

3. Goals
Life goals
“Live long and
prosper”
http://static.ddmcdn.com/gif/relieve-toothache-1.jpg
Experience
goals
“Feel good”
End goals
“Get rid of
this pain”

4. Why should we care
about user goals?
•
Main source for the IxD
(and hopefully the foundation
for the whole business)
•
A ”reality check”
•
Ground for making useful
and usable solutions
http://static.ddmcdn.com/gif/relieve-toothache-1.jpg

5. Persona
A design tool –
Imaginative user archetype, which
represents a group of people with
similar behavior patterns and goals.

6. Scenario
A design tool –
A quick way to illustrate user’s goals,
actions, motivations and overall
interaction with the product though
imaginative (research based) stories.

7. User stories / Use cases
Design tools –
Detailed descriptions of steps or
actions of a process, which helps the
user to achieve a specific goal.

8. What will your product do?
Data
Users
Goals
Persona
Scenario
Use Cases
Primary
A-1
A1-a, AI-b
Low fidelity prototyping

9. Low-fidelity
prototyping

10. Throwaway prototypes,
which translate user stories
and use cases into visual
specifications.

11. Purpose?
•
Cheap and quick way to
communicate ideas
•
Lowers barrier for
suggesting and making
design changes
•
Disposable
•
Can be tested with users

12. When to use?
e.g.
•
During brainstorming and discussion
•
To clear out misunderstandings
•
State transitions
•
Before making significant design efforts
•
Rapid prototyping and testing
•
Prior making changes based on usability tests

13. Be creative! :)
Few examples...

14. Simple drafts

15. A “pop-up”
Simple wireframe layout

16. Using notebook as
a frame with a grid

17. “As a first time
user I want to make
a visual note”
Use case visualization

18. “Interactive map”
http://buscityroute.wordpress.com/

19. Interaction storyboard as an animation
(gif, PDF, photo gallery...)

20. Post-it notes
Stencils
Frames
http://www.tripwiremagazine.com/2012/07/free-printable-sketching-wireframing-templates.html
http://wireframes.linowski.ca/2009/11/paper-prototype-cutouts/

21. Today’s To Do
Create paper wireframes that
visualize the process of solving
your persona’s main goal(s).
Document in your blog.

22. Reference
• Cooper, A., Reinmann, R., Cronin, D. (2007).
About Face 3: The Essentials of Interaction
Design. England: Wiley
• Goodwin, Kim. 2001. “Perfecting Your
Personas.” Cooper Newsletter, July/August.