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 doesn’t 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 • Can’t 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 • Don’t 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 user’s 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.