demystifying user experience

52
Demystifying UX NYU Stern Workshop FEBRUARY 28, 2017

Upload: cake-and-arrow

Post on 20-Mar-2017

55 views

Category:

Design


0 download

TRANSCRIPT

Page 1: Demystifying User Experience

Demystifying UXNYU Stern Workshop

F E B R UA RY 2 8 , 2 0 1 7

Page 2: Demystifying User Experience

A primer for understanding what UX is, its benefit within

an organization and how to work with UX practitioners.

P U R P O S E O F TO DAY ’S WO R K S H O P

Page 3: Demystifying User Experience

Agenda

01

02

03

04

05

06

Introduction

What is UX?

UX Process

Research & Testing

Working with UXers

Appendix: Frameworks & Reading List

Page 4: Demystifying User Experience

Introductions

Page 5: Demystifying User Experience

What Role Do You Want After Graduation?

Page 6: Demystifying User Experience

6

Christina Goldschmidt

Christina has 20+ years of digital experience in a wide

variety of industries, including financial services,

insurance, legal, healthcare, advertising, media,

technology start-ups and e-commerce. She has helped

design innovative experiences and products and

integrated lean and agile methodologies into the

design process for an array of Fortune 500 Clients

including MetLife, Wolters Kluwer, American Express,

The Discovery Channel, Omnicom Media Group, and

Morgan Stanley. She is a champion for the end-user

and has expertise in interaction & visual design, user

research and testing, data visualization and mobile-

first experiences. Christina received her MBA from

NYU Stern in 2008.

D I R E C T O R O F U X

@ChristinaOnUX

[email protected]

Page 7: Demystifying User Experience

We do customer experience.We’re a customer-experience agency who

partners with insurance, finance, professional

services and ecommerce companies. We’re

leading global digital initiatives with MetLife,

Saks Fifth Ave, Citi, Genpact, Lowes, KIND, The

New York Times, among others. We use

customer data to achieve results, focusing on

driving profitable growth and creating digital

experiences to get you closer to customers and

allow for more self-service.

We build stuff people love using.We start every project by studying the needs of

every group of users who’ll be involved in the

experience. Our research methodologies ensure

we uncover actionable insights based on human

behavior that are current and relevant. Those

insights help us plan an accurate trajectory for a

solution that achieves our clients’ business

goals and leaves users feeling valued. Placing

people at the heart of the process is how we

deliver results.

7

W H O W E A R E W H AT W E D O

Page 8: Demystifying User Experience

What is UX?

Page 9: Demystifying User Experience

“User experience” encompasses all aspects of the end-user’s interaction with the

company, its services, and its products.

NEILSON NORMAN GROUP https://www.nngroup.com/articles/definition-user-experience/

Page 10: Demystifying User Experience

Common mistakes for how people limit the definition of UX

UI Design

UX is the total experience and

not just about the user interface,

though the UI is a very

important part other things like

content are critical

Usability

Usability judges the quality of

the UI and if it is efficient to use,

easy to learn and delightful,

though important it is only one

aspect of good UX

Digital

UX refers to the total experience a user has

with a company inclusive of digital. Customer

Experience (CX) is emerging as a term to

describe this, but it doesn’t speak to all users

such as internal employees and vendors

UX is Not Just…

Page 11: Demystifying User Experience

The different elements of user

experience design moving from

concepts to the final

manifestation of the end

experience.

Components of UX

• User Needs & Site Objectives

• Functional Specifications

• Content Objectives

• Information Architecture

• Interaction Design

• Interface Design

• Navigation

• Information Design

• Visual Design

Page 12: Demystifying User Experience

Google was launched on

September 4, 1998 and

revolutionized how users

accessed sites on the internet

though a focused and simplified

experience

Good UX at Work

Page 13: Demystifying User Experience

UX Process

Page 14: Demystifying User Experience

There is no one right process

for UX. See the Appendix for

more in-depth discussion

about each approach.

3 Major Different Approaches

Linear step-by-step process. Most standardized approach, but falling out of fashion.

Agile is a process that responds to change. Design is split into sprints and this process is primarily used to coincide with development teams.

WAT E R FA L L

L E A N U X

AG I L E U X

Constant learning and iteration. Grown out of the lean start-up movement but now influencing process at enterprise companies.

Page 15: Demystifying User Experience

Business Strategy Investigation

Rapid Research & Insights

Design Thinking Workshops

Prototyping & User Testing

Continued Prototype Development

Ongoing Testing & Validation

CONCEPTING BUILDING

ITERATE

UX Process – Emphasis on Speed & InnovationC H R I S T I N A’ S H Y B R I D A P P R OAC H :

Page 16: Demystifying User Experience

Exploring the solutionCombining lean UX, design thinking, service

design, ethnography, data, rapid

prototyping and testing, my approach

empowers teams to quickly solve problems,

ideate, validate the approach and build

experiences that users love.

Creating the final solutionThe iterative process of building an experience

can take a waterfall or agile approach.

Regardless of which works best for a particular

development team, it's critical that the

experience is validated by users every step of the

way and that the team is comfortable adapting

the experience accordingly.

1 6

C O N C E P T I N G B U I L D I N G

C H R I S T I N A’ S H Y B R I D A P P R OAC H :

UX Process – Emphasis on Speed & Innovation

Page 17: Demystifying User Experience

Company/Business Model

Understand the business model, competitive advantage, current performance and goals employees are trying to achieve. Deep dives into marketing and operations are also beneficial.

Industry

Understand the landscape the company is operating in. What characterizes the industry and what trends are driving change.

Substitutes

How are users accomplishing similar goals now? What people, processes and technology can be leveraged for experience principles.

Competitive

What is happening in the over all digital landscape, both with direct competitors and also digital experiences that users interact with on a regular basis.

Content

What characterizes the content in this experience? What is currently blocking content from being as effective as it needs to be?

Users

What do users need? What are their key characteristics, motivations and goals and current frustrations and pain points?

C O N C E P T I N G

Technology

What is the right architecture? What technical limitations should be considered in designing the best experience?

Brand

What is the value proposition? How is the brand expressed in both visual identity and tone?

Business Strategy Investigation

1 7

The goal is to have a high level understanding of the opportunity and agreement on competitive landscape and point of departure. All else will inform questions to be answered in research.

Page 18: Demystifying User Experience

Rapid Research & InsightsC O N C E P T I N G

1 8

The best design is grounded in a deep understanding of users and sparked by research-generated insights. Ensure a thorough grounding in market segmentation and key targets. From there, determine how to identify them and uncover their mindset. What do users need?  What are their key characteristics, motivations and goals?  What are their current and anticipated frustrations and pain points?

Conducting rapid research starts with optimal methods for reaching the target. Best results come from working with fast online recruiting start-ups and utilizing intercept methods to get in front of the target from the very beginning.  Other forms of recruiting can also prove effective, but these two approaches will typically decrease the cost of research and the time it takes to conduct it.  

Additionally, wherever possible, contextual inquiry and ethnography inform a clear understanding of what people actually do, as opposed to relying on their memory. 

Page 19: Demystifying User Experience

Design Thinking WorkshopsC O N C E P T I N G

1 9

Affinity Mapping

Moodboard Ideation & Collage Content Workshop

Persona Roleplaying & Improv

Sensory Ignition

User Journey Sketching

Feature Prioritization

Design Studio

W O R K S H O P O P T I O N S :

Design thinking methods and workshops unlock the creativity within us all.  Bringing cross-functional team members together injects the ideation process with fresh perspectives and helps lift team members outside their everyday constraints. Moreover these activities can foster buy-in and build excitement across stakeholders.

Body Storming

Page 20: Demystifying User Experience

Prototyping & User TestingC O N C E P T I N G

2 0

Thorough validation of the experience is critical to cementing the experience strategy.  Development of medium fidelity prototypes (comps or high fidelity wireframes in Invision) ensures maximum user input in the most efficient way.  While paper prototyping has its place, higher fidelity artifacts are able to better represent subtleties in interfaces.  

The choice between remote and in-person testing and moderated and unmoderated testing will often be guided by timing, budget, geography and quantity of personas to be tested.

It's highly desirable to test multiple options, wherever possible, as doing so generates valuable dialogue with the test subjects. It also helps prevent the design team from becoming too attached to just one idea. 

Once validated, the final approach for an experience can be set.  The team can then proceed confidently into the iteration cycle for launch. 

Page 21: Demystifying User Experience

Continued Prototype DevelopmentB U I L D I N G

2 1

The preferred approach leads with a low fidelity version of the entire experience, before refining the pieces. Starting with sketching and going into high fidelity wireframes or loose comps helps developers visualize the experience and contribute. Using the same tool across all phases of design increases speed and efficiency, and enables designers to seamlessly iterate on the same files. Tools like InVision Inspect can help eliminate ambiguity for developers.

Page 22: Demystifying User Experience

Ongoing Testing & ValidationB U I L D I N G

2 2

It is important to test interactions, copy and interface elements in advance of launch, since all individual elements together create the final experience and impact usability. Test design must ensure actionable results. Multiple quick rounds of testing can better enable incorporation of feedback and more efficiently lead to the optimal experience.

Page 23: Demystifying User Experience

Rapid innovation and getting the most out of teams. Launching

technically feasible products that are validated by users.

P R O C E SS G OA L

Page 24: Demystifying User Experience

Research & Testing

Page 25: Demystifying User Experience

• Ensures you’re solving a problem that exists in peoples lives

• Key to building a product that is tailored to its audience

• Ensure that your product solution aligns to behaviors

W H Y CO N D U C T U S E R R E S E A R C H ?

Page 26: Demystifying User Experience

Exercise: Generating User Insights

Page 27: Demystifying User Experience

E X E R C I S E

Watch the following videos. Jot down any content or features for KINDsnack.com inspired by these users’ needs and pain points

Page 28: Demystifying User Experience

Energy Enthusiast

Joe Clarissa Dyan

Triathlons

Rock & ice climbing

Sea kayaking

7-day a week gym addict

Hiking

Group fitness instructor

Personal trainer

Holistic health coach

What insights do you take away from these videos?

Page 29: Demystifying User Experience

Did you catch any of these?

Joe Clarissa Dyan

Nutrition Info

Flavor Profiles

Usage Suggestions - Indulgence

Flavor Samples

Bulk Discount Orders or Subscriptions

Filter by Sugar Content

Suggestions for how to eat/use the product, different times and

usages

Free Shipping

Exclusive Flavors

Flexible Subscriptions for Travel

Flavor profiles

Super Detailed Photos of Products

Store Locator

Client Referral Program

Student Education and comparison vs other products for health

content

Page 30: Demystifying User Experience

56

R E S U LT: KINDsnacks.com Redesign

Assignment Increase sales, build a direct relationship with customers and turn them into enthusiasts.

• Conducted interviews with employees to get an understanding of areas for improvement.

• Observed different customer segments to understand their behavior and mindset.

• Developed and validated a working prototype over three user testing sessions.

• Launching March 2017.

Page 31: Demystifying User Experience

User Research Methods

Q UA L I TAT I V E

Ethnography

• Being there

• Deep hanging out

• Observation

Pros: Most rich research method we

have which allows for very deep

insight into behavior

Cons: Can sometimes be costly and

timely

Q UA N T I TAT I V E

Surveys

• Surveys allow for gathering

quantifiable information from a

large number of people

• Most are completed online remotely

Pros: Gather large numbers of

quantitative responses very quickly

Cons: Hard to get rich responses, or

know why problems occur. Subject to

many cognitive biases

Q UA L I TAT I V E

Interviews (Contextual: A+)

• One-on-one discussions with end

users

• Focused on probing behaviors,

thought patterns, and motivations

Pros: Can gather rich, targeted

information and are flexible for

tangents

Cons: Time consuming to organize,

run and analyze. Subject to many

cognitive biases

Page 32: Demystifying User Experience

Ask Questions• Be wary of priming • Don’t ask leading questions• Don’t ask about intention, always probe

behavior• Focus on specific instances

Keep People Talking• “Tell me more about that”• “What do you mean by...”• “Help me understand better…”• Start with small talk • Embrace the silences as people will fill the space

3 2

R E S E A R C H & T E S T I N G

How To

Bad Question: “How many times do you plan to go to the gym?”

Good Question: “How many times have you been to the gym in the last 3 months?”

Page 33: Demystifying User Experience

Identifying Trends With Affinity MappingGoal of affinity mapping is to extract common

trends/themes:• Document one insight/observation per post-it• Group post-its by likeness• Reorganize as needed• Circle insights and name key concepts

3 3

R E S E A R C H & T E S T I N G

Analyzing Results

Page 34: Demystifying User Experience

3 4

R E S E A R C H & T E S T I N G

Analyzing Results

Interpretation• People have no idea what they want• It’s your job to interpret what they say• What is said only accounts for a small piece of

the actual research insights

A G O O D U S E R R E S E A R C H E R D O E S N ’ T A S K W H AT U S E R S WA N T

B U T P R O B E S B E H AV I O R A N D M A K E S CO N C L U S I O N S

Page 35: Demystifying User Experience

3 5

R E S E A R C H & T E S T I N G

Personas – Research Output

What is a Persona?• A summary that captures a subset your user

base. Based on attributes, demographics, use

cases and user needs• Created by conducting user research –not

stereotypes– into archetypes• Does NOT represent a single person

Why are Personas Important?• You are not your user.• Communication tool for what you know about

your user.• Highlights pain points and opportunities to

tailor your product to your user –builds empathy.• Keep your product focused (MVP).• Builds team consensus and leads to better

decision making.• Useful for validating business strategy,

requirements and initiatives.

Page 36: Demystifying User Experience

3 6

R E S E A R C H & T E S T I N G

Personas – Research Output

What Should It Include?Personas should not be based on a single person;

rather, they are representative of groups of

users.

• At a minimum, each persona should include:• demographic information (age, occupation,

etc.)• goals: what the user needs to accomplish• pain points: what is frustrating about their

current experience • narrative: a paragraph or two explaining the

user’s current experience

How Do You Synthesize Your Data?• Look for trends (demographic, ethnographic,

psychographic)• What do they want to do?• What are their characteristics?• Different behaviors correlated to characteristics?• Look at like types of users and see if there are

other similarities.

Page 37: Demystifying User Experience

MOTIVATIONS & GOALS

Managing costs and financing is a full-time job. A documentary is an ever-evolving thing with unexpected events to capture. It's always a challenge to budget for unforeseen expenses like extra shooting days & re-shoots.”

• Successfully manage funding so that I have flexibility to capture the key moments that make a great film

• Travel is a part of my process. I need to be supported and prepared for any situation even when I’m away from home and out of the country

• Each project is different. I want to understand the right amount of coverage for our level of risk for each and multiple projects

• Documentaries are unpredictable, I want to manage safety even when I don’t know what’s going to happen

KEY STRATEGIES• Keep up with his busy production and travel schedule by letting him access ProSight Online

Backpack anytime and from anywhere

• Teach him about his insurance coverage and what he really needs to be protected

• Demonstrate ProSight’s knowledge of his industry and how they offer services uniquely tailored to his needs

Persona Example

Internet Use: 7 hours per day, often on mobile

Business Knowledge: Low (2 years in business)

Insurance Knowledge: Low

FRUSTRATIONS & PAIN POINTS• I don’t understand the coverage I have, what I need

and if I have enough

• Most brokers don’t understand my business. I want an agent who understands what I do and my needs so that I get the right coverage

• When I’m on a shoot and filming, I don’t have time to think about anything else

Mark LewisDocumentary Film Producer, 42

Page 38: Demystifying User Experience

• Face-to-face or remote

• Simulate reality by testing in the

environment/situation where the

design solution would actually be used

• Provide users with tasks to complete

on a prototype (paper or digital)

• Encourage them to talk out loud as

they move through interactions

• Observe their actions

Usability Testing Methods

STEP 1: Prepare

• Write a test plan and script

• Explain any recordings and get permission

• Explain the purpose of the testing

• Create task scenarios

• Should describe the task in a clear and

unambiguous way

• Written in the user’s language (no jargon)

• Don’t prompt the solution

STEP 2: Facilitate the Test

• Record the test

• Observe behaviors

• Act like a therapist

• Keep them talking aloud

STEP 3: Interpret Findings

• Review and edit your notes as soon as you finish

each interview

• Aim to have 1 typed page of findings per participant

• Perform an affinity diagram exercise to identify the

biggest problems

• Write a list of design recommendations to address

the problems

• When writing research notes, remember to:

• Report on the good and the bad

• Avoid making design changes (that will come

later)

• Stick to what you observed in the test

STEP 4: Iterate

• Review your finding and design recommendations

• Iterate on the design by sketching and prototyping

modified solutions

• Test again!

Bad Question: “Go to the search bar and type in where you want to go, then tap ‘go’.”

Good Question: “Imagine you want to take a subway from your hotel in Times Square. What would you do?”

Page 39: Demystifying User Experience

Working With UXers

Page 40: Demystifying User Experience

The Right Way to Run a Design Critique• Introduce yourself as the facilitator • Outline what the key goals of the design were• Ask for what you want (eg. feedback on the

high level flow, the details)• Ask for a ‘like’ and an ‘crit’ from each person• Discourage people from designing solutions in

the meeting, instead give problems to solve.• Assign a note-taker to record the feedback and

create a list of action items

The Right Way to Give Feedback to a Designer• You are not critiquing art. This is not about what

you like.• You are critiquing a business tool. Does this solve

the business goals?• Focus on project goals and business needs, not

subjective feelings• Be direct, specific, and provide reasons

Bad feedback: “This is not working for me” “Make it

pop more”

Good Feedback: “The wording on this button does

not feel positive, and we are trying to make people

feel good about the brand”4 0

W O R K I N G W I T H U X E R S

Design Critiques

Page 41: Demystifying User Experience

Experience Designer

Defines a holistic vision of how users interact with products and/or services

User Researcher

Identifies user behaviors, goals and needs through interviews, studies and surveys

Content Strategist

How are users accomplishing similar goals now? What people, processes and technology can be leveraged for experience principles.

Information Architect (IA)

Defines the structure of a system, how content is described, organized and discovered

Visual Designer

Responsible for the planning, development, and management of content—written or in other media.

Interaction Designer (IxD/UX Designer)

Defines interactions, user flows, wireframes, and affordances of a system

W O R K I N G W I T H U X E R S

Usability Analyst

Tests prototypes and working products with users and helps integrate feedback into future design iterations

Common UX Roles

4 1

Page 42: Demystifying User Experience

Appendix

Page 43: Demystifying User Experience

Different types of frameworks

you can use to answer UX

questions during interviews.

Frameworks• UX Case Study Evaluation

• Heuristic Evaluation

• UX Hierarchy of Needs

• Usability Principles

• UX Processes

Page 44: Demystifying User Experience

Case Study Evaluation

Q U E S T I O N 1

What user need does this address?

Any UX problem needs to be grounded

in user needs. Any evaluation of an

experience should always start from

the user’s perspective.

Q U E S T I O N 2

What are we hoping to achieve by doing this?

Understand the hypothesis for the

solution. That will help design KPIs

and a testing and validation

methodology. Plus any solution needs

to have a clear justification as to how

it ties back to user needs or it can’t

start to deliver on them.

Q U E S T I O N 3

How will we measure success?

Understanding how you’ll measure

success is critical to proving that the

design of your experience is the

correct one.

F R A M E W O R K S

Page 45: Demystifying User Experience

4 5

F R A M E W O R K S

Heuristic EvaluationsJacob Nielsen• Visibility of system status: The system should always keep users

informed about what is going on, through appropriate feedback within

reasonable time.

• Match between system and the real world: The system should speak

the users' language, with words, phrases and concepts familiar to the

user, rather than system-oriented terms. Follow real-world

conventions, making information appear in a natural and logical order.

• User control and freedom: Users often choose system functions by

mistake and will need a clearly marked "emergency exit" to leave the

unwanted state without having to go through an extended dialogue.

Support undo and redo.

• Consistency and standards: Users should not have to wonder whether

different words, situations, or actions mean the same thing. Follow

platform conventions.

• Error prevention: Even better than good error messages is a careful

design which prevents a problem from occurring in the first place.

Either eliminate error-prone conditions or check for them and present

users with a confirmation option before they commit to the action. 

• Recognition rather than recall: Minimize the user's memory load by

making objects, actions, and options visible. The user should not have to

remember information from one part of the dialogue to another.

Instructions for use of the system should be visible or easily retrievable

whenever appropriate. 

• Flexibility and efficiency of use: Accelerators -- unseen by the novice

user -- may often speed up the interaction for the expert user such that

the system can cater to both inexperienced and experienced users. Allow

users to tailor frequent actions.

• Aesthetic and minimalist design: Dialogues should not contain

information which is irrelevant or rarely needed. Every extra unit of

information in a dialogue competes with the relevant units of information

and diminishes their relative visibility.

• Help users recognize, diagnose, and recover from errors: Error messages

should be expressed in plain language (no codes), precisely indicate the

problem, and constructively suggest a solution.

• Help and documentation: Even though it is better if the system can be

used without documentation, it may be necessary to provide help and

documentation. Any such information should be easy to search, focused on

the user's task, list concrete steps to be carried out, and not be too large.

Page 46: Demystifying User Experience

4 6

F R A M E W O R K S

Heuristic EvaluationsConversion Heuristics

The probability of Conversion (C) is dependent upon

visitor Motivation (m), force of the Value Proposition

(v), presence of Friction (f) & Anxiety (a) in

the process, and Incentive (i) offsetting Friction that

cannot be eliminated.

C = 4 M + 3 V + 2 ( I - F ) - 2 A

The Conversion Sequence Heuristic is not an equation

to solve. Rather, it is a heuristic, or thought tool (i.e.,

really cool checklist), to use as you work on webpages

and marketing collateral.

Page 47: Demystifying User Experience

4 7

F R A M E W O R K S

UX Hierarchy of Needs

PHYSIOLOGICAL food, water, shelter, warmth

SAFETY security, stability, no fear

SOCIAL friends, family, love

ESTEEM achievement, confidence

SELF- ACTUALIZATION

creativityfulfillment

problem solving

FUNCTIONAL it works

RELIABLE it is available and accurate

USABLE can be used without difficulty

PLEASURABLE memorable experience

MEANINGFUL personal

significance

MASLOW’S HIERARCHY OF NEEDS

USER EXPERIENCE HIERARCHY OF NEEDS

Page 48: Demystifying User Experience

Learnability

How easy is it for users to accomplish basic tasks the first time they encounter the design?

Error Handling

How often are mistakes being made? Are error messages clear? How easily can the user recover from mistakes?

Satisfaction

How pleasant is it to use the design?

Efficiency

How quickly can users perform tasks after learning the design?

Memorability

When users return to the design after a period of not using it, how easily can they reestablish proficiency?

F R A M E W O R K S

Usability Principles

4 8

Page 49: Demystifying User Experience

F R A M E W O R K S

UX Processes

4 9

Waterfall• Discover: gather info, brainstorm, conduct

competitive audit, define scope and create

personas and user stories/use cases

• Define: create the interaction model,

content and functionality requirements,

information architecture and project plan

• Design: create site maps, user flows and

the experience design (start with sketches

and increase fidelity through wireframes,

user interface designs and prototypes

• Develop: provide clarity to devs to help

create the final experience

• Deliver: conduct usability testing, refine

and prepare for deployment

Lean UX

Agile UX

Page 50: Demystifying User Experience

Key books and sites to further

your UX knowledge… in no

particular order.

Reading List

Sites

• https://www.smashingmagazine.com

• https://alistapart.com

• https://www.nngroup.com

• http://blog.invisionapp.com

• http://rosenfeldmedia.com/books/

Page 51: Demystifying User Experience

Key books and sites to further

your UX knowledge… in no

particular order.

Reading List

Books

• Smashing UX Design, by Jesmond Allen and James Chudley

• Web Form Design, by Luke Wroblewski

• Mobile First, by Luke Wroblewski

• Don’t Make Me Think, by Steve Krug

• The Design of Everyday Things, by Don Norman

• 100 Things Every Designer Needs to Know About People, by Susan Weinschenk

• Envisioning Information, by Edward R. Tufte

• Lean UX, by Jeff Gothelf and Josh Seiden

Page 52: Demystifying User Experience

Thank You.