Introduction to Prototyping - Scottish UPA - June 2011

Introduction to prototyping Scottish UPA 22 June 2011 Neil Allison

Overview
What is prototyping?
What are the benefits?
Prototyping tools
Some example outputs
Case studies

What is a prototype?
“… a conceptual model that captures the intent or idea of a design.”
Todd Warfel
(A Practitioner’s Guide
to Prototyping)

When is a prototype not a prototype?
When you can’t implement changes quickly for retesting
When it’s a pain to try alternative approaches, particularly in parallel
When the thought of starting over because something fundamental is wrong makes you want to cry

So what is prototyping?
Trialling, testing, communicating
Exploring a concept or idea
Using a prototype to inform the development process

… so long as you can be when you present or test them Prototypes don’t have to be clever or sophisticated…

Benefits of prototyping

Why prototype?
“ Prototypes are a great communication tool for fleshing out design ideas, testing assumptions, and gathering real-time feedback from users.”
Todd Warfel
(A Practitioner’s Guide
to Prototyping)

Why prototype?
To help gather user (or business) requirements
Better requirements gathering = less feature creep
To think through scenarios & possibilities
Highlight user priorities & top tasks
To try out different potential solutions
Diffuse Steve Krug’s “ religious debates ”
To communicate effectively
With end users, with developers, with business owners
To reduce risk of rework
Reduce the risk of needing a redeploy

In a nutshell…
Better end products
Save time and money

Another way to think about it Specification Development Deployment Number of options available Cost of making changes Maximum benefit

Prototyping tools

Prototype sophistication
It depends:
On what you’re looking to find
On where you are in the design process
On who you’re working with
Does it facilitate
Interaction?
Communication?

Choosing the right tools
Use the tool(s) that work best for you
I usually prefer a combination
Doesn’t matter what you prototype with
Are you comfortable with it?
Can you work quickly?
Opportunities for collaboration are good too

Some prototyping options
Pencil, paper, post-it notes
Graphics packages (I love Snagit)
Office packages: PowerPoint, Visio, Word
Firefox free add-on: Pencil
Online services like Mockingbird
Specialist tools like Axure, iRise, Balsamiq
Your preferred development framework

Some examples…

Paper etc
Scenario planning required!
Only limited by your imagination (dental tape anybody?)
e-Commerce example: http://bit.ly/lClK54
10 video examples: http://bit.ly/lx7g4o

I ♥ Visio
Free templates: http://bit.ly/itKeQS

Some specialist tools
Mockingbird: http://bit.ly/itKeQS
Balsamiq: https://www.wiki.ed.ac.uk/x/5so8Bw (Edinburgh Uni users only)
Axure: http://bit.ly/mow0BN

Case study Content Management System (CMS) interface enhancements

What we did #1
Identified functional & usability enhancement requirements
Through user feedback
Discussion board then priority survey
Through observation in training and testing
Through support requests

What we did #2
User rep, developer and graphic designer met to discuss potential solutions
First prototypes: pencil & paper
Agreed preferred solution from a development perspective
Meeting functional and usability requirements

What we did #3
Prototypes worked up with Visio & Snagit
Some based on CMS development proof of concept
All paper based
Scenarios developed to encourage interaction with prototypes
Usability testing with small numbers of CMS users
Minor tweaks made to prototypes based on findings
One quick retest

All paper based Writing not typing Playing computer Quick results summary

Top tips
Trial the prototype activities before arranging sessions with participants
Make sure the participants are representative of your target users
Or make allowances with your results
Talk through the full test with development team – before and after sessions
Looking at prototypes sometimes not enough

Benefits: Usability
Interface changes deployed smoothly
Enhancements universally well received
User base were listened to & engaged with
Demonstrably improved the publishing process
ROI tests show task times cut by up to 33%
Saving at least £50,000 per year in staff time

Benefits: Development
Initial development time cut
Rough prototypes facilitated discussion
Misconceptions identified
Better understanding of user behaviours
Development approaches ruled in/out
Redevelopment significantly reduced
Only one notable redevelopment needed
Lesson learned: demo test with developer
No redeploys needed

Conclusions
Doesn’t matter what you prototype with
So long as it’s quick
Best options enable collaboration
It’s not about the prototype itself
It’s about the interaction
It’s about communication
It’s about shared understanding

Final thought
You will make mistakes when usability testing, but with practice you will get better
Steve Krug: “It’s not rocket surgery”
Usability is like cookery
You don’t need to be a gourmet chef
Beans on toast will usually do 
Jakob Nielsen article: http://bit.ly/cPjMhc

Learn more
My blog posts on prototyping: http://bit.ly/cEFnaq
Great books
Prototyping by Todd Warfel http://bit.ly/lckF0N
Rocket Surgery Made Easy by Steve Krug http://bit.ly/mHfHSy

Thank you Neil Allison University of Edinburgh www.usability-ed.blogspot.com http://uk.linkedin.com/in/neilallison www.ed.ac.uk/website-programme

Introduction to Prototyping - Scottish UPA - June 2011

by Neil Allison on Jun 23, 2011

Accessibility

Tags

Upload Details

Usage Rights

2 Embeds 58

Statistics

Introduction to Prototyping - Scottish UPA - June 2011 — Presentation Transcript

http://usability-ed.blogspot.com	57
http://usability-ed.blogspot.co.uk	1