Why Usability Should Never Come First

And the importance of Front-End Design

May, 2008

David Rondeau, Design Chair

Traci Lepore, Principal Interaction Designer

What are we going to talk about?

Difference between User-Centered Design, Usability, and User Experience

Relationship of “Value” and “Ease of use”

Various types of customer data and how they impact design differently

Understand the benefits of contextual data in a front-end design process

What is user-centered design….

As defined by the field: User-centered design (UCD) can be described as a design philosophy and

process that takes into account the needs, wants, and limitations of an end user of an interface in every stage of development. (Don Norman)

User Centered Design (UCD) is an approach that supports the entire development process with user-centered activities, in order to create applications which are easy to use and are of added value to the intended users. (usability.net)

User-centered design (UCD) is an approach to design that grounds the process in information about the people who will use the product. UCD processes focus on users through the planning, design and development of a product. (UPA)

A design approach in which the emphasis is on the user and through which a high level of usability is achieved. (theusabilitycompany.com)

There’s no agreement on what to really do—what info to gather, when to use it, or how to use it

What is usability….

As defined by the field: After all, usability really just means that making sure that something

works well: that a person of average (or even below average) ability and experience can use the thing - whether it's a Web site, a fighter jet, or a revolving door - for its intended purpose without getting hopelessly frustrated. (Steve Krug, Don't Make Me Think)

Usability is a quality attribute that assesses how easy user interfaces are to use, based on learnability, efficiency, memorability, errors, and satisfaction. (Jakob Nielsen)

Efficiency with which a user can perform required tasks with a product, for example, a website. (www.webindexing.biz/Webbook2Ed/glossary.htm)

Usability is the measure of a product's potential to accomplish the goals of the user. (www.netaonline.org/PD-DigitalGlossary.rtf)

There is no agreement on whether usability is a concept or a methodology

What is User Experience…

The User Experience (UX) encompasses all aspects of the end-user's interaction with a company, its services, and its products. It aims to achieve a positive perception through customers who are satisfied entering into, during and after interactions. (Peter Boersma)

This also means that users experience everything: Visual design Information architecture Interaction design Copy & technical writing Customer relationship management Environment Colors moods Smell Touch

All design creates an experience, but what kind of experience do you want?

Audio feedback Visual feedback Trust Show-off effect Usefulness Practicality Coexistence Emotional effect

Achieving the intended “good” UX

Two distinct facets of design can help make the UX a positive one:

The “practical” value or usefulness for the user (UCD) Addresses central aspects of the user’s work or intent It is appropriate, interesting and relevant to the target audience

The ease of use of the design (usability) Users can complete their intended tasks The process for completing tasks is efficient

What does this mean in the context of design?

The relationship between value and ease of use

Hard to use Easy to use

High value

Low value

AcceptableHard to use but highly valuable

DesirableEasy to use and highly valuable

Inconceivable Hard to use and little value

UnsuccessfulEasy to use but little value

We try, but then discard the Unsuccessful

Unsuccessful designs may be easy to use, but they don’t provide much value

Easy to use

Low value

Since we can’t even imagine you’d produce the inconceivable we’ll start here…

3com Audrey

Pets.com

Candle warmer

Left-handed mug

Apple Cube

We live with Acceptable

Even though Acceptable designs can be hard to use, people still use them because they have value

Hard to use

High value

TV remote

Chocolate

Goldmine

Nintendo Wii

We embrace the Desirable

Easy to use

iPod

Desirable designs are what everyone wants and usesHigh value

Inconceivable Hard to use and little value

UnsuccessfulEasy to use but little value

But what does this mean for us?High value

Low value

Hard to use Easy to use•Strive to move in this direction• Increasing usability is easy

•Designs must provide value• Increasing value is more difficult

AcceptableHard to use but highly valuable

DesirableEasy to use and highly valuable

Value trumps usability

How can UCD help deliver desirable?The important principles of UCD:

A clear & first-hand understanding of user work practice and intent Active involvement of user to generate and evaluate designs Integrating user centered design with other development activities

Plan Strategy

Plan Strategy Gather DataGather Data DesignDesign Validate

& Refine

Validate & Refine

Specify & Implement

Specify & Implement EvaluateEvaluate

Strategic Data

Marketing segmentation

Surveys

Stakeholder input

Card sorting

Focus groups

Gathered Data for this project

Competitive/Trend Analysis

Web logs & stats

Heuristics

Journal or diaries

In-home interviews

Creative Stimulation

Brainstorming

Personas

User Scenarios

Storyboards

Design Testing

Fixed state prototype testing

Rollout & Functional Specs

Rollout plan (in phases)

Use cases

1st release specs

Bugs & Technical Info

Feasibility Study

QA testing

Usability Measurement

Usability testing

Questionnaires

How do they impact design?

Steps in the typical process and data gathering methodologies

We use data to generate a design

Gathered DataCompetitive/Trend AnalysisWeb logs & statisticsHeuristics Journals or DiariesIn-home Interviews

ImpactsFeatures, functionality and “under the hood” technology

But it doesn’t tell you the value of features and functionality or “why” they are valuableG

athe

r D

ata

Creative StimulationBrainstormingPersonasUser ScenariosStoryboards

ImpactsUser characterization helps drive buy-in within the organization

But it doesn’t move you from data to actual design

And producing a design

Des

ign

ImpactsBusiness direction and focus

But doesn’t tell you what to design, how people would use it, or the context of use

By gathering requirements

Pla

n S

trat

egy Strategic Data

Marketing segmentationSurveysStakeholder inputCard sortingFocus groups

Design TestingFixed state (med to high fidelity) prototype testing

ImpactsActual user interaction and informal usability

But it doesn’t let you validate structure and high level concept

We use data to refine the implemented design

By iterating and improving

But all this data doesn’t assure us the design has value

Val

idat

e &

Ref

ine

Rollout & Functional SpecsRollout plan (in phases)Use Cases1st release specs

Bugs & Technical InfoFeasibility StudyQA testing

ImpactsTechnical implementation

But it doesn’t tell us if this technology supports the work practice

Spe

cify

& I

mpl

emen

t

Usability MeasurementUsability TestingQuestionnaires

ImpactsEase of use

But it doesn’t affect the valueEva

luat

e

What’s missing from these processes?

Actionable data that will drive new directions for the business and new design concepts Methods to support collecting & interpreting of

contextual customer data Validating that the concepts provide larger

value beyond the specific work practice Including users in the validation & iterative

refinement

How do we do this?

Contextual customer data gathering methods

Strategic DataFocus Setting

Pla

n S

trat

egy

ImpactsClear and shared focus

Understanding the business concerns and value proposition

Customer DataEthnographic Interviews

Ga

the

r D

ata

ImpactsUnderstanding the work practice and user intents

Finding out the “why” and “how”

Creative StimulationData modeling – Affinity Diagrams, Sequences, Flows (a consolidated picture)

ImpactsCreate big picture of issues, needs, and wants of the users

Produces design concepts and business directions to move towards to support the user population

Des

ign

Concept TestingParticipatory (low to med fidelity) paper prototype testing

Fixed state (med to high fidelity) prototype testing

ImpactsValue, actual user interaction, informal usability, and conceptual visual or industrial design

Concepts will get validated before implementation

Val

idat

e &

Ref

ine

These methods allow us to do “generative front-end design”

Prioritization for rollout and usability testing are important to ensure a high quality UX for an implemented design

Implement & Improve

Generative design is dynamic & iterative – it produces, validates, and refines the concept to a design prior to implementation & ensures intended UX

Producing a Concept

Crucial for driving new concepts and business directions

Gathering RequirementsAt any point you can always go back and gather more data if needed

These 2 steps don’t gather the same kind of data

Working in a generative process

PlanStrategy

Gather Data

Validate & Refine

Specify & Implement

To generate new concepts you have to start here

If you start here you can only drive ease of use, and not generative, valuable design

Without these 2 steps you can’t generate and validate new concepts

These 2 steps don’t impact design inthe same way

Evaluate

Concept Design

This isn’t the right kind of data to drive new concepts

Implement & Improve

Producing a Concept

Gathering Requirements

Working in a generative process

PlanStrategy

Gather Data

Validate & Refine

Specify & Implement

Evaluate

Concept Design

Generative Front End Design gathers the data that produces concepts which drive value

Following up with Usability ensures the best implementation of the concepts and UX

Analog.com

Design Problem: Redesign the site to ensure engineers can easily find the products and information they need to make purchasing decisions

Analog.com - customer data

Customer data gathered Focus Setting Contextual inquiry interviews

Affinity Diagram Flow Model Sequence Model

Paper prototype testing Online prototype testing

Site structure and organization I don't know everything that is on the site

I didn't know about the product lists that show all products Now that I know its here, I will use the site more I didn't know about design resources

I don't know where you put the information It’s not clear to me where I should look for the information I need I don't know how or where to find a product If I don't see a part in the selection guide, I assume it doesn't exist I don't know where to find application notes

Categories need to make sense to the engineers Categorizing products by application doesn't work for me The product category tree reflects organizational structure, which doesn't

help me I am using a product in a new or different way so its harder to find

information The site structure gets in my way

I can't find things in the collapsed menus I can't find things as information is nested too deeply I don't understand your terminology

Finding and Searching Searches are confusing and don't usually give the results that I

am looking for I need to find parts easily without having to go through the search I get different results depending on where I start I am confused by the different kinds of searches on websites When search results don't give me info I need, I use alternative ways

(navigation) Search results don't often give me what I need I don't find what I need in the first attempt

U01-31 There is also a product A-Z index that bypasses the organizational structure and lists all products alphabetically. But he didn't notice it.U01-31 There is also a product A-Z index that bypasses the organizational structure and lists all products alphabetically. But he didn't notice it.

U10-794 He likes the master product list because he can see all the parts - but he had never seen it before shown by the interviewerU10-794 He likes the master product list because he can see all the parts - but he had never seen it before shown by the interviewer

Analog.com

Solution: Raise information to the top of the

site to expose the content and support functions

Provide clear navigation to deeper levels of content

Product page that provided all the critical information engineers needed

Results: Increased customer satisfaction Ranked first in industry reviews and

independent studies Time on call lines reduced 30-40% Tool usage went from 10-15,000

views per months to 100,000 Users were still happy with the site

3 years later

Whew…we talked about a lot

There is a clear distinction between UCD, Usability, and how they are related to creating a good UX

Increasing value has more customer impact than increasing usability

To provide value you need to generate new concepts Contextual customer data helps drive generative front-

end design Remembering that all customer data is not equal; each type

has its purpose And if you do all this you will also drive

Business value: it supports the business goals Practical value: it can be delivered by the organization Technical value: it is technically feasible

Why front end design is important

If a UCD process is going to deliver value it needs to be at the front-end

Gathering requirements using contextual data will drive new business directions and concepts

Producing design concepts with contextual data and continued user participation will validate value

Usability will provide the most benefit when it follows generative front-end design

Evaluating usability of implemented designs ensures the highest quality implementation that will deliver a good UX

We developed the industry-leading customer-centered design process

Our clients are industry leaders – including other design firms

Our experience spans a wide range of work practices, industries and technologies

We have a proven track record creating solutions for the people who use them

“The only method I have seen that really tells you how to go out and collect customer data, and then what to do about it.” - Don Norman

“The only generative method in the field” -Ben Shneiderman