Paper Prototyping

1
Paper Prototyping

• A tool for iterative design
• Wai Yong Low

2
Scope

• Introduction 1min
• Why do it? 1min
• Why not to do it? 1min
• Building a Lo-fi Prototype 2min
• Preparing for a test 2min
• Conducting a test 1min
• Evaluating Results 1min
• Demonstration 5min
• Conclusion 1min

3
Introduction

• 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 doesnt explain
  how the interface is intended to work

4
Why do it?

• Principle of iterative design
• Quality is partially a function of the number of
  iterations and refinements it undergoes

5
Why do it?

• Low cost
• Fast to implement
• Typical hi-fi prototype takes a few weeks as
  opposed to a few hours
• Allows you to merge the design and prototyping
  phase together

6
Why do it?

• It gets everyone involved!
• Builds teamwork amongst groups with diverse skill
  set
• So simple, no one gets left out

7
Why do it?

• Feedback on the BIG things
• Lo-fi nature forces users to consider usability
  issues related to layout, control mechanism
• Nit picking over choice of colors, buttons sizes,
  font choice ignored
• Focus on Content as opposed to Appearance

8
Why not to do it?

• Does not produce anything concrete!
• May seem unprofessional to some users
• Cant represent some effects with paper

9
Building a lo-fi prototype

• Gather essential materials
• White unlined paper
• 5 by 8 inch cards
• Adhesives
• Markers
• Sticky pads
• Overhead Projector acetate sheets
• Scissors, pen knives
• Anything else you think of!!!

10
Building a lo-fi prototype

• Dont get carried away with design!
• Goal is to get as much user feedback as possible
• Set a deadline forget minor details

11
Building a lo-fi prototype

• Draw generic frames
• Make everything needed to simulate effects
• Photocopier is your friend!
• Can use professional tools to create polished
  paper prototypes

12
Preparing for a test

• Select users
• Perform user and task analysis
• Find out educational background, knowledge of
  computers, typical tasks required
• Get testers who fit the final user profile

13
Preparing for a test

• Ready test scenarios
• Practice
• Sort out bugs/hitches before the real testing
• Get everyone comfortable with their role

14
Conducting a test

• Facilitator
• Encourages user to express thoughts without
  influencing decisions
• Giving instructions
• Making sure timing is met

15
Conducting a test

• Computer
• Arranges the paper prototype according to user
  input
• Needs to be organized
• Make changes quickly

16
Conducting a test

• Observers
• Take notes
• Write possible solutions to problems faced
• Cannot react to users actions

17
Evaluating results

• Summarize problems
• Prioritize problems
• Construct revised prototype

18
Live Demonstration

• Mock up of Gmail website
• Test Logging in
• Test composing mail
• Test checking for sent mail
• Test signing out

19
Conclusion

• Paper prototyping
• Useful tool for speeding up process of iterative
  design
• Team member gain understanding of users needs
• Try it out!

20
References

• Lo fidelity Prototyping Prototyping for Tiny
  Fingers, by Marc Rettig, in Communications of the
  ACM, Vol. 37, No. 4, pp. 21-27, April 1994.
• http//www.paperprototyping.com/references.html
• Klee, M. 2000. Five paper prototyping tips.
  Available from User Interface Engineering.
• Scanlon, T. 1998. Paper prototypes still our
  favorite.