1.
thinkLA // 24 March 2015
USER EXPERIENCE DESIGN:
A PRIMER FOR MARKETERS
JASON BRUSH

2.
IN THE PAST…

3.
≠ADVERTISING
CREATIVE
PRODUCT
DESIGN

4.
advertise (v.)
from Latin advertere : “turn toward”

5.
design (v.)
from Latin designare : “mark out, devise,
choose, designate, appoint”

6.
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

7.
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?

8.
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

9.
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

10.
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

11.
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL

12.
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL

13.
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL

14.
COMMUNICATION
PRODUCT DESIGN
PHYSICALDIGITAL

15.
USER
EXPERIENCE
DESIGN
Human
Computer
Interaction
Interaction Design
Human
Factors
Visual
Design
Information
Architecture
Architecture
Content Industrial
Design
Sound
Design
DAN SAFFER
@ODANNYBOY

16.
USER
EXPERIENCE
DESIGN
Human
Computer
Interaction
INTERACTION DESIGN
Human
Factors
Visual
Design
Information
Architecture
Architecture
Content Industrial
Design
Sound
Design
DAN SAFFER
@ODANNYBOY

17.
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

18.
Interaction design is about shaping digital
things for people’s use.
— Jonas Löwgren

19.
Behavior is our medium.
— Robert Fabricant

20.
EMPATHIZE EXPLORE EXECUTE

21.
(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

22.
HOW MIGHT WE…?
EMPATHIZE EXPLORE EXECUTE

23.
EMPATHIZE EXPLORE EXECUTE
We need a [solution(s)]
for [person/people]
to [achieve a particular goal].
ARTICULATE
PROBLEM
HOW MIGHT WE…?

24.
- 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

25.
UNDERSTAND & SYNTHESIZE

26.
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?

27.
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?

28.
POOR QUESTION
How do people buy video games?

29.
BETTER QUESTION
How do moms buy video games for their kids in a store?

30.
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?

31.
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?

32.
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

33.
If you want to find out what people really
need, you have to forget about your
problems and worry about their lives.
— Dale Carnegie

34.
INQUIRY
Ask people what
they do.
PARTICIPATION
Try what people
experience.
OBSERVATION
Look at what
people do.
METHODS FOR EMPATHY

35.
The only way to experience an experience is
to experience it.
— Bill Moggridge

36.
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.

37.
WHEN TALKING TO PEOPLE, ASK:
Who…?
What…?
Where…?
When…?
Why…?
How…?

38.
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!

39.
People
Context
Tasks
Technologies
WHAT TO OBSERVE
AFFORDANCES OBSTACLES

40.
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

41.
IDEATE

42.
DIVERGENCE / CONVERGENCE
Objective SolutionCreate Choices Make Choices
DIAGRAM AFTER TIM BROWN
@TCEB62

43.
A building must be considered “with due reference to
function, structure, and beauty”
— Vitruvius, 80 – 15 BCE

44.
TECHNICAL
FEASIBILITY
FINANCIAL
VIABILITY
DESIRABILITY
Solution
DIAGRAM PER IDEO
@IDEO

45.
WHAT IS THE STORY OF PEOPLE’S
INTERACTION WITH YOUR EXPERIENCE?

46.
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 …

47.
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

48.
START BY WRITING SCENARIOS
[A person] needs to [accomplish a task]
so that she or he can [achieve some benefit].

49.
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.

50.
Mental models are what people really have
in their heads and what guides their use of
things.
— Don Norman

51.
A A
A
A
Designer UsersSystem

52.
Ready-to-hand Present-to-handVS

53.
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.

54.
DESIGNING INTERACTIONS (PER BILL VERPLANK)
“HOW DO YOU DO?”
“HOW DO YOU FEEL?”
“HOW DO YOU KNOW?”
What does the user
need for interaction?

55.
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?

56.
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?

57.
Designing in the absence of content is not
design. It’s decoration.
— Jeffery Zeldman

58.
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

59.
Context
Fidelity
FULL EXPERIENCELIMITED USE CASES
PAPER PROTOTYPE
WIZARD OF OZ
CLICK-THROUGH
MOTION STUDY
CODE

60.
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

61.
Always
Be
Capturing

62.
BOOKS TO READ
Designing
For Interaction
The Design of
Everyday Things
by Don Norman
Sketching User
Experiences
by Bill Buxton
Microinteractions
by Dan Saffer

63.
IMPLIMENT

64.
If you cannot measure it you cannot
improve it.
— Lord Kelvin

65.
A VS B
100,000 users get
option A
100,000 users get
option B

66.
A B

67.
A
A CVS
B

68.
A
A C
B

69.
A
A C
B

70.
A B C
TESTING DIFFERENT MICROINTERACTIONS…

71.
BUSINESS
TRAVELERS
LEISURE
TRAVELERS
CALIFORNIANS
DIFFERENT DESIGNS CAN PROVE TO BE MORE
EFFECTIVE FOR DIFFERENT AUDIENCES

72.
IN CONCLUSION…

73.
Less, but better.
— Dieter Rams

74.
THANKS