Transcript Design Prototyping Bringing Wireframes to Life Dan Harrelson Please * @danharrelson #mix09 #proto * As if I could stop you...

Design Prototyping
Bringing Wireframes to Life
Dan Harrelson
Please
*
@danharrelson
#mix09
#proto
* As if I could stop you...
Introduction
• Design deliverables
• What’s design prototyping?
• Why prototype?
• What makes a good prototype?
• Techniques for prototyping
Design processes
are dynamic
No Product
Awesome Product
Design processes
are dynamic
Design processes
are dynamic
Design processes
are dynamic
Competitive Analysis
User Research
Business Strategy
Technology
Brand Guidelines
We take in all
sorts of input
Metrics
Users
Developers
Designers
Partners
Stakeholders
Customers
We work with lots
of different people
Prospects
We come up with
some dynamic ideas
We output some
pretty static stuff
• Sitemaps
• User flows
• Personas
• Wireframes
• Visual comps
We need something
more dynamic:
Design Protoyping
Prototypes
... allow engineers and
designers the ability to
explore design alternatives,
test theories and
confirm performance
prior to starting
production of a
new product *
*
http://en.wikipedia.org/wiki/Prototyping
easy
.NET
performance
connected
integrated
AIR
JSON
fast
slow
connected
Rails
Silverlight
REST
api
Proof of concept
XAML
scalable
secure
mashup
hard
Prototypes
... allow engineers and
designers the ability to
explore design alternatives,
test theories and
confirm performance
prior to starting
production of a
new product *
*
http://en.wikipedia.org/wiki/Prototyping
branded
complex
hard
easy
static
animated
simple
safe
personal
functional
competitive
friendly
slick
Design prototype
usable
interactive
Why prototype?
Wireframes
aren’t enough
Prototype
goes here
Reduce
documentation
Get internal buy-in*
*money for your concept
Usability test
See how a concept
will Function
Work
Feel
Experiences are
Interactive
Experiences are
Responsive
Experiences have
Emotion*
*Wireframes Don’t
Generate concepts
Validate concepts
What makes a
good prototype?
Interactive
How about an
How Fast?
Fast
afternoon?
http://www.boxesandarrows.com/view/interactive
Disposable
It’s not about the prototype,
it’s about the ideas!
Focused
Don’t prototype:
Do prototype:
•Solved problems
•Agreed upon solutions
•Core interactions
•Important patterns
•Risky functionality
Focused
Critical
Design
Prototype
Quick
Wireframe
Complex
Prototyping
techniques
Paper prototyping
Digital prototyping
http://www.boxesandarrows.com/view/quick-and-easy-flash
In conclusion
• Deliverables need to be more dynamic
• Design prototyping can help...
• Good ones are fast, disposable and
focused
Questions?
Comments?
Dan Harrelson
@danharrelson
[email protected]
m
Use promotional code MIX and get 10% off either registration price.
April 2-3, 2009
San Francisco
May 11-14, 2009
Berlin
http://adaptivepath.com/
events/2009/apr
November 2-5, 2009
Washington, D.C.
June 15-18, 2009
San Francisco
http://adaptivepath.com/even
ts/2009/uxi/
September 15-18,
2009
San Francisco
http://uxweek.com/