ux and usability it's no picnic
TRANSCRIPT
Behind the buzzwords
UX and Usability
VOXXED DAYS ZURICH
Because « simple user testing » i.e. debugging a design is part of our jobs.
Because @g33konaut
2
Why am I speaking today?
UX is the totality of end-users’ perceptions as they interact with a product or service. - Kuniavsky , 2010
Defining User Experience
3
Increased customer satisfaction Loyalty More time = more money Less resources wasted
Think of your user’s needs as being your product goals
4
1. Functional: works as programmed2. Reliable: is available and accurate3. Usable: can be used without
difficulty4. Convenient: easy to use, works
like I think5. Pleasurable: memorable
experience
User Needs
5
Pleasurable
Convenient
Usable
Functional
Reliable
EffectivenessEfficiency
LearnabilityError prevention
Memorability
UX is broad and holistic. Usability is narrow and focused
6
Usability
SatisfactionEnjoyment
PleasureFun
Value
User Experience
How some of us see usability
7
Krug’s 3 Laws Of Usability
8
Steve Krug ”Don’t
Make Me Think”
Don’t make me
think
Let the
words go!Mindless &
unambiguous clicks
USABILITY PYRAMID
9
Efficient
Effective
Learnable
Useful
Memorable
Delightful
Desirable
The Myth of the Average User
10
37%
22%27%
14%
Experience is personal and subjective
11
Good web design isn’t a matter of figuring out what people like.
12
13
Loves Harry PotterHates Twilight
Plays with his socks during church
Prefers Google over Yahoo
Warning : average user may not reflect reality
A game that can be played in large meetings.
BULLSHIT BINGO
14
Jargon 101: UX, UXD, CX, UI, IxD
15
UX: USER EXPERIENCE
UXD: USER EXPERIENCE DESIGN
CX: CUSTOMER EXPERIENCE
UI: USER INTERFACE
IxD: INTERACTION DESIGN
Get awesome photos on Gratisography
User Experience Design is the process of designing for the all-encompassing, user-focused aspects of any system.
User Experience Design
16
CX is the product of an interaction between an organization and a customer over the duration of their relationship.
17
ATTRACTION
AWARENESS
Get awesome photos on Gratisography
ADVOCACY
CULTIVATION
PURCHASE
DISCOVERY
USE OF SERVICE
UX is a specific component within CX.
CX encompasses the experience of your entire brand.
CX and UX are not interchangeable!
18
UI is what your users interact with,
UX is how they feel while they’re doing it.
UI and UX are not interchangeable!
19
Interaction Design is about making the connection between a device, its interface and the user.
Interaction Design
20
Interaction Design delivers that almost human element that makes technology enjoyable and
pleasant to interact with.
21
Great image by Jeff Sauros
USABILITY BEST PRACTICES
24
1. Persona2. Empathy Map3. User Scenario4. Customer Journey Map
4 DOCUMENTS YOU NEED
Personas are a placeholder for your ideal user during the design process.
Personas: fictional personalities based on research
25
Step 1: print mapStep 2: ask dumb questionsStep 3: digest notes in post-its as a teamStep 4: go for quantityStep 5: chill out. Get more feedback.Step 6: define your mission
Empathy Map: a tool to organize user’s thoughts & emotions
26
Behavior Motivation Environment External Factors
User scenarios
User factors to consider when creating a scenario
http://designmodo.com/ux-documents/
It combines the user’s personality (persona) with how they’re interacting with your site (user scenario).
Each stage will offer different emotional progressions.
Customer Journey Map: give product context
28http://designmodo.com/ux-documents/
PAY ATTENTION TO MY TALKING!
10 USABILITY GUIDELINES FOR WEB APPS
29
Have a consistent and standardized UI
30
Guide the user
31
Make the CTA interactive objects obvious
32
Give feedback on the user interacting and progressing
33
Never have users repeat anything and keep signup information to a minimum
34
Always have default values in fields and forms
35
Explain how the inputed information will be used
36
Don’t offer any reset or mass delete buttons
37
Have clear and explanatory error and success messages
38
Include a clear and visual hierarchy and navigation
39
10 USABILITY GUIDELINES FOR MOBILE APPS
40
Make sure it works on all phones
41
Give incentives for sharing and purchase
42
Keep usability and conversion in mind
43
Navigation should be easy
44
Offer relevant content
45
Offer relevant content
46
Go for great aesthetics
47
Offer relevant content
48
Give all the information that a customer needs to make a purchase
49
Auto-fill customer data
50
Design for quick movement
51
Do usability testing through video
52
6 WEB APPLICATION DEVELOPMENT MISTAKES
53
Inconsistent approach to common functions
54
Ambiguous error messages
55
Giving users too many competing options
56
Having a lengthy registration process
57
Small clickable areas on mobile
58
Blaming negative feedback on “fear of change”
59
Digital analytics = what people are doing on your site. Usability = why they are doing things on your site.
What about digital analytics?
61
8 Cheap Usability Tools1. Crazy Egg: heat maps2. Optimizely: A/B testing, basic plan is
free3. Five Second Test: capturing first
impressions, free4. Qualaroo: voice of customer5. Usabilia: all in one solution6. Feedback Army: uses Mechanical
Turk to get feedback7. Userfeel: not just for websites in
English8. TrymyUI: usability testing tool
« Usability testing is the killing field of cherished notions»
- David Orr
62
Usability tests are about watching one person at a time try to use something to do typical tasks so you can detect and fix the things that confuse or frustrate them.
Twitter: @myriamjessier
"Ahoy ye landlubbers - get on board of the Usability debate! Scrub your apps and set ye sails for your users. This talk lets you walk the plank for the biggest UX pitfalls and gives you a treasure map of how you can make apps that your users will sail across oceans for"
65