Fast & easy ways to incorporate paper prototyping and user testing into the iPhone app design process.
Text of An agile approach to iPhone design: Paper prototyping + user testing
An agile approach to iPhone design: Paper prototyping + user testing Suzanne Ginsburg, Principal [email protected] Tuesday, April 21, 2009 1
Thanks for your interest in these slides! Full-screen view is recommended for optimal viewing. Tuesday, April 21, 2009 2
About Me More than thirteen years of experience designing software Six years in the Communities & Communications group at Yahoo! Three years consulting on my own (startups, in-house, design agencies) M.S. in Information Management from UC Berkeleys iSchool Certified Scrum Master; participated in Agile pilot at Yahoo! 3 Tuesday, April 21, 2009 3
Project Background A few months ago, I started sketching ideas for an events related iPhone app Before investing time & money on development, I wanted to get user input on the concept. Were prospective users interested in the idea? What features & functionality would make the service most compelling? How would they respond to the presence of ads? Did the high-level information architecture make sense? 4 Tuesday, April 21, 2009 4
Approach Develop a paper prototype + Test prototype with prospective users 5 Tuesday, April 21, 2009 5
What is a Paper Prototype? Format can be hand-drawn sketches or screenshot printouts Fast & cheap way to incorporate user feedback into designs. Developer/designer plays the role of computer & simulates how the UI will behave Posted by typeweight on Flickr 6 Tuesday, April 21, 2009 6
What is a Paper Prototype? (contd) When compared to high-fidelity testing, Jared Spool, the founder of User Interface Engineering, describes it the following way: We think of paper prototyping as the course-grain sandpaper and electronic-version testing as the fine grain. Once weve used the paper prototypes to validate what each screen contains and how it will work, we then move over to the electronic version to fine tune the look and feel. 7 Tuesday, April 21, 2009 7
What are the benefits? Design changes can be made on the fly during usability tests Usability participants may be more comfortable being critical of a paper prototype Making big conceptual changes early on will save time & money Posted by typeweight on Flickr 8 Tuesday, April 21, 2009 8
What are the benefits? (contd) The most common estimate is that its 100 times cheaper to make a change before any code has been written than it is to wait until after the implementation is complete. -- Jakob Nielsen Testing ticketing system in Oslo; Posted by etunko on Flickr 9 Tuesday, April 21, 2009 9
What types of projects are suitable? Consider the project stage: Great for testing a completely new design Also works for changing parts of an existing design If you want to test an existing product, you might as well test the real thing And the project domain: Works well for most productivity applications Good for some aspects of content-rich sites Can work for gaming; highly dependent on game type 10 Tuesday, April 21, 2009 10
What types of issues can you explore? Concepts. Do they understand the key concepts? Terminology. Do they understand the terms in the UI? Navigation. Does the flow match what users expect? Content. Does it provide the right level of information? Page layout. Is content organized as users expect? Functionality. What additional features are desired? Harder to address: Technical feasibility; download time or other response times; scrolling, swiping; colors Posted by timo on Flickr and fonts 11 Tuesday, April 21, 2009 11
What tools can you use to build paper prototypes? Options are endless: Pen + paper: Combine with stickies, markers, & other readily available office supplies. Sketching applications: Omnigraffle, BalsamIQ, Visio (Note: Omni & BalsamIQ have nice iPhone stencils.) iPhone sketch created with Balsamiq 12 Tuesday, April 21, 2009 12
iPhone Stencils: Graffletopia 13 Tuesday, April 21, 2009 13
Pencil and Paper Prototype: Things iPhone App 14 Tuesday, April 21, 2009 14
Next, User Testing 15 Tuesday, April 21, 2009 15
Paper Prototype: Sample Usability Timeline Planning Recruiting Study Findings 2 days 3 days 1-2 days 1 day This one-week timeline is very aggressive & has a number of built-in assumptions: Planning: Assumes that the prototype has already been developed. Recruiting: Assumes recruiting requirements are relatively straightforward. Findings: Assumes that quick findings are sufficient for team. Note: If you work with an agency or rent lab space, expect these times to double at minimum. Costs will also be much higher (recruiting + lab can cost $5000 for 2 days; facilitation and analysis are separate line items) 16 Tuesday, April 21, 2009 16
