Validating Ideas Through Prototyping

Validating Ideas
Through Prototyping

Chris Risdon
Lead Experience Designer, Adaptive Path
@chrisrisdon

Design Principles Testing Ideas
Ideation
(theory) (Prototyping)

Design Principles Prototype
Reﬁned Design
(reﬁned) (Usability)

Why do this?

Fail early, fail cheaply

Before you invest time and money

Prototype for areas you don’t know
Test risky functionality
Validate:
• Core interactions
• Application patterns
• How content is organized

Frameworks
Paradigms
Approaches

Ready to prototype?
Not so fast.

What makes a prototype
a prototype?

Prototypes vs. Stories
Or Interactive Prototypes vs. Narative Prototypes

The experience prototype allows designers to show
and test the solution through an active
participation of the users.

(2000) Marion Buchenau, Jane Fulton Suri, Experience Prototyping, paper presented at the Symposium
on Designing Interactive Systems.

We all use stories to communicate...and inspire.
Basing stories on fact will help you communicate
your own ideas effectively. Tell your story well:
you'll get buy-in for the design and you'll have
everyone on the same page.

Whitney Quesenbery, Storytelling for User Experience

Narrative Prototype Interactive Prototype
(Story or Scenario)

Storytelling stands Prototypes often requires
on it’s own, doesn’t moderation, facilitation, or
need context context explained

3rd person 1st person

Storytelling describes a Prototypes tests parts of the
complete experience experience

Explanation Exploration

Prototyping Ideas

• Not about rapid, or paper, or high-fidelity or
which software
• It’s for users, not stakeholders
• It’s about the ideas

Prototyping Ideas
• Does it make sense to users?
• Is the framework valid?
(collection of features that play nice together)

• Does the application pattern work?
(common ways to present task based applications)

• Is the content organized logically? Is it the
right content?
• Getting questions answered!

It’s not about requirements.
(at least not yet)

What to prototype
• What you don’t know
• The product's story
• Everything you need to convey
the product experience (but no more)

Fast.
Cheep.
Portable.
Easy.

$20 in the app store.
No cheaper software for prototyping.

But more on
Keynote later.
Really, I don’t care what you use.

Testing concepts?
Who and what.

We use prototypes to answer
design questions?
So what are those questions?

What do you need to know
about your designs?

Does it support the value
proposition?

Is this framework
work best for users?
(Do the collection of features support
the users mental model?)

Are users making
sense of the content?

Not usability testing.
Stay out of the weeds.
(again, broad not deep)

Not (small scale)
usability testing.
You’ll uncover large scale
usability issues.

• Prototype for areas you don’t know
• Core interactions
• Application patterns
• Content
• Risky functionality

“The better it looks, the more narrow the feedback.”

—Kathy Sierra

Charmr Design Principles

Adaptive Path’s User Intensive, 2011

Charmr Design Principles
• Wear it during sex
• Make better use of data
• Easy to learn and teach/No numbers
• Less stuff
• Keep diabetics in control
• Keep diabetics motivated


Palm Pilot Design Principles

■ Fits in a shirt pocket
■ Syncs seamlessly with PC
■ Fast and easy sync
■ No more than $299


Design Principles

• More than just requirements or specs. Non specific!

• Combines the structured findings of research with the best ideas
of ideation

• Should be specific as possible and catchy

• Unique to your product or design

• More important than any one design

• Use to determine what concept to move forward with

• Also for making decisions during the project


Just one prototype?
Um, no.

Different concepts

• Develop multiple ideas
• Test against design principles
• Extremes in concepts for contrast and
comparison

Make them different

• Different IA: Labels, navigation, content
• Different Information Design: Hierarchy and
emphasis
• Different Interactions: Different design patterns
(ex: sliders vs. dropdowns, hovers vs. lightboxes)

Make them different

• Making each unique
• Design extremes between concepts
• Welcome gaps

Ideas on a spectrum
• More interactive > less interactive
• More content heavy > less content heavy
• Different messaging, or prioritized content
differently
• Different order of steps
• Different interaction models
(example: slider vs. drop-downs)

When not Keynote?
When custom
interactions are the ‘thing’
you need to validate

Real content!
Your design idea is too abstract to the user
without real content.

Evaluating Ideas

Determine criteria you use to evaluate the design.
Keeps it from being “I like this” or “I don’t like that”

Evaluating Criteria
• Discoverable
• Trustworthy
• Appropriate
• Responsive
• Smart
• Clever
• Meaningful
For more, read
• Pleasurable Designing for Interaction
by Dan Saﬀer

Hitting many is great, but usually you are going to
just hit a few key criteria depending on goals.

• Discoverable
• Trustworthy
• Appropriate
• Responsive
• Smart
• Clever
• Meaningful
• Pleasurable

“The One Pager”

“The Policy Explorer”

“The Worksheet”

Concept: The One-pager

Successes:
• easy to understand the steps
• very narrative
• good mix of visual and textual
information
• everything in one place/page

Concept: The Worksheet
Successes:
• Great for feedback about
process and progress
• Good for monitoring the
“running total”
• A good format for making
suggestions (e.g. things you
might need to provide for with
your coverage)
• Easy to take in at a glance or
take away to share

Concept: The Policy Explorer
Successes:
• Everything all in one place
• Easy to play with and see the
connections and implications
between the concepts
• Less about process and more
about action

64

Since last time: Concepts and Testing

Themes
What follows are the major themes we saw during concept
testing with customers. We’ve called out specific aspects,
features, etc. of the concepts that represent these themes.

65

Themes: Estimating is central
• The estimate serves as a high-
level anchor
• An estimate of some sort needs to
be front and center (either a real
estimate/quote or examples like
the snapshot grid)
• Members must be able to quickly
get to a number (either because
we suggest something, or it’s easy
to generate)
• Use “Estimate” rather than
“quote”
• Saving estimates is important (but
in way that highlights differences)

Snapshot grid

Quick access to estimate

Realtime estimate update

66

Themes: Provide deeper information
• Deep information should not be “in the
way” but should be easily accessible

Contextual help • Contextual relevance is key -- offer
things at the right time/place
• Content should be accessible in levels
or “escalation”
1. Links to available content (call out
or tool tip, highly contextual)
2. Nugget (“executive summary”)
3. Full detail (not necessarily long
article)
• Explaining policies is the most important
area for deeper information
• People appreciate and trust the
Explanation of policy, executive summary company’s expertise; they want deeper,
editorialized information from you (“Tell
Me More”)

Highlight explanation of policies

67

Themes: Comparisons
• Policy and prices side by side
is powerful
• Comparisons should come with
suggestions or the company’s POV
• Allow comparison at different levels
1. Static/initial (snapshot grid)
2. Personalized (when selecting a
policy/estimate, contrast to other
options)
3. Custom (comparing saved quotes
– what were the differences?)

Policy comparison grid

Policy Comparison with suggestions

68

Themes: Play Around
• Let people perform tasks quickly
• Keep as much in one place as possible
• Allow adjustability and quick feedback -
“massaging the data”
• Allow them to hit the target that is right
for them (could be price or coverage or
policy)
• Especially good for numerical
adjustments, but may be more difﬁcult to
use for policy and health

Policy characteristics

Policy, coverage, and health

Interactive Prototype (landing page)

Interactive Prototype (worksheet: quick estimate )

70

Guiding the user
during testing

• Thinking out load
• Nobody likes to admit they don’t know
something or can’t figure something out
• Designers observe
• Tell participants: no wrong answers
• Can’t offend us (“not my design”)
• Interview based tasks

Create a protocol!

• Prompts for your interview session
• Based on key objectives you want to learn, or
key questions you want answered
• Is meant as reminders, not a rigid script

Interview based tasks
In interview-based tasks, the participants interests are discovered, not assigned. Unlike
scavenger-hunt tasks, the test's facilitator and participant negotiate the tasks during
the tests, instead of proceeding down a list of predefined tasks.
Because each task is drawn from the experience and interest of each participant, no
two participants perform exactly the same tasks. As we're looking for the usability
problems that pop up, we're also looking for how the user approaches their problem
and the level of detail they require.
Surprisingly, we often see multiple participants run into the same problems. Even
though their tasks are radically different, they have very similar experiences.
As each participant designs their own tasks, they are telling us how they think about
the content on the site, giving us insight into the words we choose for links and how
we organize the material.
Jared Spool (http://www.uie.com/articles/interview_based_tasks/)

Keynote:
An Introduction
(the very basics)

Inspectors (AKA Palettes)

Linking

Document

Text

Shape effects

Links

Blue arrow indicates
an object is linked

about us about us

Doesn’t show when
you ‘play’ prototype
Nulla dui purus presentation

Master Slides: Time Saver
Create your templates here

Create master slide
templates for elements you
know will be the same from
Can be applied page to page (or state to
to multiple pages state)

Linking Pages
Select objects on screen and link
to new page or state

Use the palette to select where
you want the link to go. (it will
remember the slide if you change
the order)

Home about us blog contact

Blog Catagories
Nulla dui purus
Nulla dui purus, eleifend vel, consequat non, Consequat
dictum porta dui purus, eleifend vel, Aenean
Etiam imperdiet
consequat. Duis ante mi, laoreet ut, commodo
eleifend, cursus nec, lorem. Aenean eu est.
Archives
Etiam imperdiet turpis. Praesent nec augue.
Nulla dui purus
Read more >
Consequat
Aenean
Nulla dui purus, eleifend vel, consequat non,
Etiam imperdiet
dictum porta dui purus, eleifend vel,
consequat. Duis ante mi, laoreet ut, commodo
eleifend, cursus nec, lorem. Aenean eu est.
Etiam imperdiet turpis. Praesent nec augue.
Read more >


Big Headline Goes Here
dictum porta, nulla. Duis ante mi, laoreet ut,
commodo eleifend, cursus nec, lorem.
Aenean eu est. Etiam imperdiet turpis.
Praesent nec augue.

Get Started!

about features
Nulla dui purus, eleifend vel, Nulla dui purus, eleifend vel, consequat non,
dictum porta dui purus, eleifend vel, consequat
consequat non, dictum porta,
nulla. Duis ante mi, laoreet ut,
commodo eleifend, cursus
nec, lorem. Aenean eu est. dictum porta dui purus, eleifend vel, consequat


Tags To:
Inbox
work
home From:
Starred
sports Subject:
Drafts entertainment
baby
Sent
work
dictum porta dui purus, eleifend vel, consequat.
home
Junk
sports Duis ante mi, laoreet ut, commodo eleifend, cursus
entertainment nec, lorem. Aenean eu est. Etiam imperdiet turpis.
baby Praesent nec augue.

That get’s you up and running today.
But for proper advanced Keynote prototyping:

Travis Isaacs’
Keynote Kungfu Black Belt
http://www.slideshare.net/tbisaacs/keynote-kungfu-black-belt

Thank you!

Chris Risdon
Lead Experience Designer, Adaptive Path
@chrisrisdon

Validating Ideas Through Prototyping

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Destacado

Destacado (11)

Similar a Validating Ideas Through Prototyping

Similar a Validating Ideas Through Prototyping (20)

Más de Chris Risdon

Más de Chris Risdon (6)

Último

Último (20)

Validating Ideas Through Prototyping