user experience design: a primer for marketers
TRANSCRIPT
thinkLA // 24 March 2015
USER EXPERIENCE DESIGN: A PRIMER FOR MARKETERS JASON BRUSH
IN THE PAST…
≠ADVERTISINGCREATIVE
PRODUCTDESIGN
advertise (v.)
from Latin advertere : “turn toward”
design (v.)
from Latin designare : “mark out, devise, choose, designate, appoint”
Meeting People’s
Needs
Long-term Impact
Shaping Culture & Opinion
Short Term Impact
DESIGN’S RELATIONSHIP TO CLIENT INTERESTS
USER-CENTERED DESIGN
CAMPAIGN CREATIVE
BRAND DEVELOPMENT
VISUALIZATION
UBER is worth $40B Doesn’t Own Vehicles
Facebook is worth $236B Doesn’t Make Content
airbnb is worth $10B Doesn’t Own Real Estate
WHAT IS THE VALUE OF GREAT USER EXPERIENCE?
Over the last 10 years design-led companies have maintained significant stock market advantage, outperforming the S&P by an extraordinary 228%.
— DMI Design Value Index
CREATIVE AGENCIES’ DIFFERING AREAS OF PRACTICE
Communication
Product Design
PhysicalDigital
BRANDING
TV, OOH, PRINT ADVERTISING
PACKAGING
DIGITAL CONTENT
WEBSITES
CRM
ECOMMERCE
USER INTERFACE
STORE EXPERIENCES
INDUSTRIAL DESIGN
DIGITAL IS CHANGING THE CREATIVE AGENCY’S PURVIEW
Communication
Product Design
PhysicalDigital
BRANDING
TV, OOH, PRINT ADVERTISING
PACKAGING
DIGITAL CONTENT
WEBSITES
CRM
ECOMMERCE
USER INTERFACE
STORE EXPERIENCES
INDUSTRIAL DESIGN
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL
USER EXPERIENCE
DESIGN
Human Computer Interaction
Interaction Design
Human Factors
Visual Design
Information Architecture
Architecture
Content Industrial Design
Sound Design
DAN SAFFER @ODANNYBOY
USER EXPERIENCE
DESIGN
Human Computer Interaction
INTERACTION DESIGN
Human Factors
Visual Design
Information Architecture
Architecture
Content Industrial Design
Sound Design
DAN SAFFER @ODANNYBOY
Interaction Design (IxD) defines the structure and behavior of interactive systems. Interaction Designers strive to create meaningful relationships between people and the products and services that they use, from computers to mobile devices to appliances and beyond.
— Interaction Design Association
Interaction design is about shaping digital things for people’s use.
— Jonas Löwgren
Behavior is our medium.
— Robert Fabricant
EMPATHIZE EXPLORE EXECUTE
(POOR)PROBLEM
ARTICULATION
We need a new website.
We need to improve our product detail page.
We need a mobile app.
We need a new social campaign.
EMPATHIZE EXPLORE EXECUTE
HOW MIGHT WE…?
EMPATHIZE EXPLORE EXECUTE
EMPATHIZE EXPLORE EXECUTE
We need a [solution(s)]for [person/people] to [achieve a particular goal].
ARTICULATE PROBLEM
HOW MIGHT WE…?
- Competitive research
- Market research
- User research
- Engineering capabilities & constraints
- Strategic insights
- Target users
- User needs
- KPIs
- Platform(s)
- Creative Brief
UNDERSTAND SYNTHESIZE IMPLEMENT
IDEATE
- Low Fidelity visualizations
- Technology proofs-of-concept
- User testing
- Engineering feasibility analysis
PROTOTYPEEVALUATE
- Interaction
- Visual design
VISUALIZE
- Collaborate with engineering to execute
- Validate & optimize at scale
UNDERSTAND & SYNTHESIZE
WHEN PLANNING RESEARCH, DEFINE:
OBJECTIVES
What do you want to learn?
ASSUMPTIONS
What do you believe to be true?
METHODS
How are you going to gain insight?
WHEN PLANNING RESEARCH, ASK:
Who are your users?
What makes them unique?
If you’re targeting multiple groups of users, what are your priorities? Why?
What will success look like for different users?
POOR QUESTION
How do people buy video games?
BETTER QUESTION
How do moms buy video games for their kids in a store?
WHEN PLANNING RESEARCH, DON’T MAKE IT MORE COMPLICATED THAN IT NEEDS TO BE:
What research do you currently have? What data do you currently collect?
What data out in the world already? What third-party reports exist?
WHEN PLANNING RESEARCH, TAILOR YOUR PLAN TO YOUR RESOURCES
How much time do you have? What is the minimum amount of research you can do and still gain some insight?
EXAMPLE RESEARCH TACTICS
SURVEYS
CONTEXTUAL INQUIRY (E.G., IN-HOME INTERVIEWS)
JOURNEY MAPPING / TASK ANALYSIS
USER DIARIES
FOLLOW-AROUNDS / SHOP-ALONGS
CARD SORTING
CONCEPT RANKING
GENERATIVE
EVALUATIVE
If you want to find out what people really need, you have to forget about your problems and worry about their lives.
— Dale Carnegie
INQUIRY
Ask people what they do.
PARTICIPATION
Try what people experience.
OBSERVATION
Look at what people do.
METHODS FOR EMPATHY
The only way to experience an experience is to experience it.
— Bill Moggridge
BAD RECRUITING = BAD INFORMATION
Define the precise criteria for the people to whom you want to speak — and to whom you don’t want to speak.
WHEN TALKING TO PEOPLE, ASK:
Who…?
What…?
Where…?
When…?
Why…?
How…?
TALKING TO PEOPLE DOESN’T HAVE TO BE COMPLEX OR EXPENSIVE
Use internal resources not on the project.
Use Facebook, Twitter, etc. to recruit
Web surveys
Do Interviews over Skype, Hangouts, etc.
Use Lync, Adobe Connect, etc. to get users input on existing products.
…and more. Be inventive!
People
Context
Tasks
Technologies
WHAT TO OBSERVE
AFFORDANCES OBSTACLES
BOOKS TO READ
Designing for the Digital Age
by Kim Goodwin
The User is Always Right
by Steve Mulder
About Face: The Essentials of
Interaction Design
by Alan Cooper
IDEATE
DIVERGENCE / CONVERGENCE
Objective SolutionCreate Choices Make Choices
DIAGRAM AFTER TIM BROWN @TCEB62
A building must be considered “with due reference to function, structure, and beauty”
— Vitruvius, 80 – 15 BCE
TECHNICAL FEASIBILITY
FINANCIALVIABILITY
DESIRABILITYSolution
DIAGRAM PER IDEO @IDEO
WHAT IS THE STORY OF PEOPLE’S INTERACTION WITH YOUR EXPERIENCE?
USE PIXAR’S FORMULA TO DESCRIBE YOUR EXPERIENCE
1. Once upon a time there was …
2. Every day …
3. One day …
4. Because of that …
5. Because of that …
6. Until finally …
USE PIXAR’S FORMULA TO DESCRIBE YOUR EXPERIENCE
1. Once upon a time there was …
2. Every day …
3. One day …
4. Because of that …
5. Because of that …
6. Until finally …
BEFORE YOUR EXPERIENCE
AFTER YOUR EXPERIENCE
START BY WRITING SCENARIOS
[A person] needs to [accomplish a task]so that she or he can [achieve some benefit].
CORE UX DESIGN ACTIVITIES
INFORMATION ARCHITECTURE
Describing the organization of systems so that people can easily navigate them.
MENTAL MODELS
Describing what people understand about how a system works.
INTERACTION MODELS
Describing the specific behavior of interactions.
Mental models are what people really have in their heads and what guides their use of things.
— Don Norman
A AA
A
Designer UsersSystem
Ready-to-hand Present-to-handVS
PROTOTYPE
A model of a system used to demonstrate and evaluate its behavior.
PROOF OF CONCEPT
A demonstration that a particular technology can produce a desired effect.
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?”
What does the user need for interaction?
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?”
How does your interaction with the system make you feel?
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?” How do you know the system has done what you want it to do?
Designing in the absence of content is not design. It’s decoration.
— Jeffery Zeldman
Time
Pixel-Perfect Visual Design
Handdrawn Sketch
TIME COST OF MAKING DESIGNS
Low-fidelity Storyboards
High-fidelity Wireframes
TIME COST OF EXPLAINING DESIGNS
FINDING THE RIGHT BALANCE OF FIDELITY FOR YOUR PROJECT
DIAGRAM AFTER DAVID SHERWIN @CHANGEORDER
Context
Fidelity
FULL EXPERIENCELIMITED USE CASES
PAPER PROTOTYPE
WIZARD OF OZ
CLICK-THROUGH
MOTION STUDY
CODE
Number of Variations Needed to Evaluate Design
MICROINTERACTIONS
SYSTEM DESIGN
Fidelity Needed
to Evaluate
Design
“details that make the experience delightful, humane, and effective” — Dan Saffer
Always
Be
Capturing
BOOKS TO READ
Designing For Interaction
The Design of Everyday Things
by Don Norman
Sketching User Experiences
by Bill Buxton
Microinteractions
by Dan Saffer
IMPLIMENT
If you cannot measure it you cannot improve it.
— Lord Kelvin
A VS B
100,000 users get option A
100,000 users get option B
A B
A
A CVS
B
A
A C
B
A
A C
B
A B C
TESTING DIFFERENT MICROINTERACTIONS…
BUSINESS TRAVELERS
LEISURE TRAVELERS
CALIFORNIANS
DIFFERENT DESIGNS CAN PROVE TO BE MORE EFFECTIVE FOR DIFFERENT AUDIENCES
IN CONCLUSION…
Less, but better.
— Dieter Rams
THANKS