Out Of Box Experience Design
103
Out of Box Experience Design Harry Brignull Pete Gale
-
Upload
harry-brignull -
Category
Design
-
view
20.221 -
download
2
description
Out of Box Experience Design: presentation by Harry Brignull & Pete Gale. More info at www.90percentofeverything.com
Transcript of Out Of Box Experience Design
Out of Box Experience DesignHarry Brignull
Pete Gale
Who are these guys?
Harry Brignull: User Experience Consultant, Madgex
Pete Gale: Head of User Experience, Cogapp
The problem:Self Install Broadband Packages are hard to install yourself
Which means...
Customers call in for help
Call center costs ramp up
Frustrated customers less likely to renew contracts
Which means...
In this case, good OOBE design isn’t just about being nice or ‘building a luxury brand’
- its all about reducing costs!
What’s the problem?
N.D.F.
How Big?
Scherf, K. Consumer Electronics Association Conference, Home Networking Panel, 2002.
With return rates of 20-30%, home networking gear is currently the most returned item at “big box” electronics stores
Kent Sullivan, Microsoft. Paul Sorenson, Intel, Ease Of Use Roundtable, 2004.
How Big?
“No Defect Found” return rate runs as high as 90%+
(depending on product category)
eBrain Research October, 2002 Consumer Electronics Association (CEA)
How Big?
Consumer electronic returns
costs are estimated at $10B annually
(Only 2-5% of returns are found to be defective)
source: wikipedia
Where are we now?
Where the story starts...
A UK ISP approached Flow Interactive to help them with this problem.
I ended up speccing and running an iterative user testing project for them.
Today I am going to give you some insights.
Off the record - no recording please.
Before I start...
Some questions to think about:
★ If OOBE design seems easy, why are OOBEs usually so awful?
★ If you feel like you could do this work - what’s stopping you from pitching for & winning projects like this?
User Centred Design
A quick primer for the unitiated
User Centred Design
A quick primer for the unitiated
A simple recipe, many variations
Prototyping
User Research
Iteration
Collaboration
Survival of the fittest:
with each iteration, you iron out problems.
Web Apps
Physical products
Vehicles
Product packaging
Instructional Materials
Shop floorplans
... literally ANYTHING that
people use!
Web Apps
Physical products
Vehicles
Product packaging
Instructional Materials
Shop floorplans
... literally ANYTHING that
people use!
Out the other side...
Something that caters for user needs.
i.e. more usable, more useful and more enjoyable!
In a nutshellWhat is the challenge for OOBE design?
We wish our users would behave like this…
We wish our users would behave like this…
- Reads the manual before starting
- Extremely careful
- Systematic
- Doesn’t miss a detail
But they actually behave more like this…
But they actually behave more like this…
- They are impatient
- They rarely read big blocks of text
- In the absence of immediate, direct instructions, they will steam ahead
- They expect to be able to “muddle through”
Our challenge is to design the OOBE to work well with
this natural style of user behaviour
Our ApproachHow did we apply the UCD philosophy?
Stakeholder interviews revealed different departmental perspectives
“What’s your definition of success?”
Engineer“Success happens when about all the bits fit into the box safely, cheaply &
efficiently”
Engineer“Success happens when about all the bits fit into the box safely, cheaply &
efficiently”
Packaging designer “Success is a sexy
cardboard template”
Engineer“Success happens when about all the bits fit into the box safely, cheaply &
efficiently”
Developer: “Success happens when
my code complies with the requirement specs”
Packaging designer “Success is a sexy
cardboard template”
The silo effect
To achieve an effective user experience, you have to break the silos.
User Experience Design relies on a holistic view.
Project outline
Traditional usability consulting
Client hands over materials to a consultancy
User testing carried out
Report written, recommendations given
Redesign carried out by Client
Project outline
Traditional usability consulting
Client hands over materials to a consultancy
User testing carried out
Report written, recommendations given
Redesign carried out by ClientX
UX design problems are symptomatic of organizational problems
We wanted to treat the disease, not the symptom.
UX consultancy as relationship therapyPart of it involves showing them how to work together
Project outline
Rapid iteration user testing:
20 real users from all walks of life, 1 on 1 sessions
Given a box and told to self install / think aloud
All client stakeholders took take 1 week out the office and attend the research sessions
The viewing room was not a boring “cinema” set-up, but an active vibrant workshop
✔
Project outline
During sessions, the team would tweak the OOBE and build a new prototype
Between sessions, the newly modified version of the OOBE would be swapped in.
The final prototype was a “living implementation” of the new design (no scope for misinterpretaiton)
A very memorable, engaging experience
✔
Lab set-up
Lab split into two rooms using a divider
Room 1: Hallway - phone connection
Room 2: Spare room - Desktop PC
Analogue camera set-up: user could be seen picture-in-picture in either room. Streamed into viewing room and recorded onto DVD
Live editing: I’d switch camera angles from a console as the user moved around.
Findings
Findings
Ten steps before you start
• Open Box• Evaluate magazine• Evaluate DVD box• Open DVD box• Evaluate paperwork• Open “Set up guide”• Evaluate first layer of instructions• Unfold “set up guide”• Evaluate main instructions
Ten steps before you start
• Open Box• Evaluate magazine• Evaluate DVD box• Open DVD box• Evaluate paperwork• Open “Set up guide”• Evaluate first layer of instructions• Unfold “set up guide”• Evaluate main instructions
EVERY STEP CREATED POTENTIAL FOR USER ERROR
After observing the first few users
we saw that they were overwhelmed by the instructions, and instead tended to do this:
“I’m making an educated guess” [tries to force ethernet
into DSL socket]
“I’m making an educated guess” [tries to force ethernet
into DSL socket]
“My method is trial and error”
“I’m making an educated guess” [tries to force ethernet
into DSL socket]
“My method is trial and error”
“I wouldn’t read the instructions unless I had to”
Lazy = smartBased on prior experience, this heuristic saves effort
1. Muddle through quickly
2. if problem is encountered
3. then refer to instructions
Productive Laziness
“Productive laziness involves avoiding unnecessary work.” - Aaron Sloman, Cognitive Scientist
The chess champion who wins by working through all the possible sequences of moves several steps ahead [...] is not as intelligent as the player who avoids explicitly examining so many cases...”
http://icanhaz.com/cognition
“This looks easy, you just plug the coloured cables into the coloured slots!”
The octapus of death
The octapus of death
The octapus of deathAs soon as they have all the cables hooked in, they are screwed.
We realised we needed to prevent this.
How?
The traditional solution
Read me
first!
The traditional solutionInstructions on how to use the instructions!
Read me
first!
The traditional solutionInstructions on how to use the instructions!
Read me
first!X
A better solutionGuide behaviour through physical affordances
A better solutionGuide behaviour through physical affordances
The Bento Box approachLayering controls sequence of exposure.
The first thing you see = the first thing you do
The new ‘clamshell’ designPresents the user with just two things upon opening: the device and a quickstart guide
Better but not perfectCertain steps were still problematic
Too much information overwhems users So we set to work on simplifying the complex copy and diagrams
If its possible to cut out a word, cut it out. George Orwell
“Your Broadband features.
Your service includes many useful and exciting features. Select what you’d like to set up now from the following list. You can set features up later if you prefer.”
Becomes
“Select the features you wish to install”
“If the illustrator has taken the time to draw
this, then it must be significant in some
way.”
This diagram was intended to show the various devices that need a microfilter
Users tended to stall here, and would visually scan the diagram looking for the key point. They thought
they were missing something.
The message communicated in this diagram is much clearer.
There are no unnecessary details.
Every drop of ink serves a purpose.
Another pain pointWhere’s the damn password?
Wep Key:
57c50e60b4c553d97597b8a078
... On the back of the modem in another room!
Umm, is that a Zero or an O?Transcription errors are an inevitable problem
We added a “wireless details” card
The problem went away completely!
We added a “wireless details” card
The problem went away completely!
Demonstrates the need for ecological validityA classic lab set-up would have the missed this problem
Cumulative costs
With HTML and CSS, improvements are a one-off cost, but not with physical products!
Even tiny tweaks need to have extensive cost-benefit evaluation...
cost
No of units
html
physical
Conclusions
Where do I start?
Where do I start?
Affordances to manage starting points Progressive disclosure to manage complexity
Allow for implicit checking & error correction
Technical solutions to technical problems
Context
Which cable? where?
Consistency
Consistency
Ensure consistency let users check this
Thank you
