UX playbook: Real world user exercises
-
Upload
invision-app -
Category
Design
-
view
1.936 -
download
9
Transcript of UX playbook: Real world user exercises
@clarklab#InVisionWebinar
Content Designer@InVisionApp
Persona Benefits
UX Playbookreal world user exercises
No designated UX
Tight timelines and misunderstandings
Processing and agreeing on feedback
Challenges
Our Session Today
Simple exerciseswith some homework
UX doesn’t stopit isn’t a phase
Personas Storyboards
User Testing Prototyping
Personas
A persona is a representation of a userbased on data (hopefully)
Focus on the specific somebody, not the generic anybody
Persona Benefits
Share user-centered knowledge with the entire team
Persona Benefits
Similar to a brand style guide or content requirements
Persona Benefits
Common Ground
Persona Benefits
“What does a persona look like?”
Persona Benefits
Persona Benefits
Design Persona
Marketing Persona
Proto Persona
Types of Personas
a specific personrepresentative of larger groups
Creating a Persona
based on researchdata, interviews, analytics, etc
Creating a Persona
current realitynot the future
Creating a Persona
challengingvaried skills and interest levels
Creating a Persona
help you understand the user’s behaviors, attitudes, needs
Creating a Persona
“Widening your target doesn’t improve your aim. To create a product that must satisfy a broad audience of users, logic will tell you to make it as broad in its functionality as possible to accommodate the most people. Logic is wrong.”
Alan Cooper
“When you design for your primary persona, you end up delighting your primary persona and satisfying your secondary persona(s). If you design for everyone, you delight no one. That is the recipe for a mediocre product.”
Alan Cooper
Examplesof personas in action
Persona Benefits
Persona Benefits
Persona Benefits
Persona Benefits
Persona Benefits
Persona Benefits
Homework
HomeworkCreate three personas
HomeworkCreate three personas
Bonus: pain points
Storyboarding
A storyboard is the planning of a sequence of events
covers a complete event
A good storyboard
is flexible
A good storyboard
is assignable
A good storyboard
A user visits
airbnb
A user visits
airbnb
User searches
for property
A user visits
airbnb
User searches
for property
User books
property
A user visits
airbnb
User searches
for property
User books
property
User & host
receive email
A user visits
airbnb
User books
property
User & host
receive email
User searches
for property
Visual Storyboard Examples
Improve Company Focus
User learns about
The Zebra
User learns about
The Zebra
User Visits
The Zebra
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
User learns about
The Zebra
User Visits
The Zebra
User enters vehicle details
Receives quotes & selects a carrier
User contacts an agent
User receives
on-boarding paperwork
User Is Insured!
Open the app
Open the app
Select the flight
Open the app
Select the flight
Check In
Open the app
Select the flight
Check In
Open the app
Select the flight
Retrieve the
code
Open the app
Select the flight
Retrieve the
code
Go back to main screen
Open the app
Select the flight
Retrieve the
code
Go back to main screen
Select “Check In”
Open the app
Select the flight
Retrieve the
code
Go back to main screen
Select “Check In”
Manually enter the
code
Open the app
Select the flight
Retrieve the
code
Go back to main screen
Select “Check In”
Manually enter the
code
Type out full name
Open the app
Select the flight
Retrieve the
code
Go back to main screen
Select “Check In”
Manually enter the
code
Type out full name
Tap “Check In”
Open the app
Select the flight
Check In
Homework
HomeworkStoryboard your product value
HomeworkStoryboard your product value
Bonus: storyboard a pain point
User Testing
user testing is the process of watching people use your product
User Testing Benefits
Always surprising
How it feels to watch a user test your product for the first time.
@DesignUXUI
User Testing Benefits
Huge returns
User Testing Benefits
Before, during & afterit isn’t a phase
Types of User Testing
remote
focus group
beta testing
user interviews
“We still believe that the most important part of UX design is testing. You can write, strategize, research and design all you want but the proof is in the testing.”
David Perel, co-founder of Obox
research your target audience
User Testing Do’s
give general directionnot turn-by-turn navigation
User Testing Do’s
document everythingaction items aplenty!
User Testing Do’s
test at all stagessometimes fidelity isn’t important
User Testing Do’s
only testing internallywith like-minded folks
User Testing Don’ts
relying on emulatorsa screen in a screen
User Testing Don’ts
User Testing Don’t Tell Anyone’s
drunk user testingwith friends and family
User Testing Don’t Tell Anyone’s
squint testingwith our without bad eyesight
User Testing Don’t Tell Anyone’s
translate testingit’s all Greek to me
User Testing Don’t Tell Anyone’s
5 day research sprintscultivating
Time to marketfor useful, usable features
“I thought I’d be looking more at their taps than what they were saying, but it turned out that looking at their reactions and expressions were more important to me.”
Vicki Tan
18% drop overnight
Homework
HomeworkConduct a remote user test
HomeworkConduct a remote user test
Bonus: host an IRL focus group
Prototyping
the design processa simulation of the final product
test before code
Why Prototype?
test before design
Why Prototype?
common ground
Why Prototype?
use paper, wireframes, or whatever
On Fidelity
make it interactive
On Fidelity
On Fidelity
share it with everyone(that can handle it)
“Investment is the enemy of creativity. The more you invest in an idea, the more bias you have for that idea.”
Clark Valberg
Prototyping Tips
strive for “good enough”pixel-perfect is for production
Prototyping Tips
keep a wide focusstuck somewhere? move on!
Prototyping Tips
use Symbols and Smart Objectsduplicate work is the worrrrst
Prototyping Tips
use “real” assetsstock is fine!
Prototyping Tips
prototype on real deviceslive in the real world
Homework
HomeworkStart from scratch, find “good enough”
HomeworkStart from scratch, find “good enough”
Bonus: m
@clarklab#InVisionWebinar