User-Centered Design: From Concept to Product Peter Merholz peterme [email protected].

32
User-Centered Design: From Concept to Product Peter Merholz peterme http://peterme.com/edgewise [email protected]

Transcript of User-Centered Design: From Concept to Product Peter Merholz peterme [email protected].

Page 1: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

User-Centered Design: From Concept to Product

Peter Merholzpeterme

http://peterme.com/[email protected]

Page 2: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

What is User-Centered?

Maintain focus on the end-users of your product at all times

Involve them from the outset in your design process

Endeavor to understand how your users work

introduction

Page 3: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

Why User-Centered?

Ensures relevant and useful functionality

Saves money with low-cost design methods

More than anything else, sites must work

introduction

Page 4: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

How User-Centered?

Research

Definition

Design

introduction

Page 5: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

RESEARCH

Page 6: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

1. Direct User Research

Ethnographic Field StudiesContextual InquiryInterviewsFocus Groups

research

Page 7: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

1. Direct User Research

Ethnographic Field Studies

Participant ObservationTime-intensiveNarrow but very very deepField Methods Casebook for Software Design, Wixon and Ramey

research

Page 8: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

1. Direct User Research

Contextual Inquiry

Study context of work tasksInterviews and observationBest bang for buckContextual Design, Beyer and Holtzblatt

research

Page 9: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

1. Direct User Research

Interviews

If you don’t have the time for CIInterview within their context

research

Page 10: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

1. Direct User Research

Focus Groups

Similar to marketing focus groupsStill try to get a handle on how people do things

Good in spurring dialog

research

Page 11: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

2. Site Audits

Competitive and Landscape Analysis

Competitors have faced same problemsUnderstand users’ perspectives Know what you’ll need to be competitiveBest of breed designsUnexploited nichesExample of competitive auditBest practices report

research

Page 12: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

3. Marketing Review

Witness larger trendsUnderstand the Big Picture

research

Page 13: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

DEFINITION

Page 14: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

4. Brainstorming

Grounded in real user data and understandingFocus on 3-4 typical customer typesTeam activity

definition

Page 15: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

5. Scenarios

Narratives for those 3-4 customer typesForce you to think non-logicallyThroughout process: “How would Suzy do this?”Can be given to a number of different designers to solve

definition

Page 16: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

5. Scenarios

Wile E. Coyote just used up his last anvil in an attempt to hunt a road runner in the middle of the desert. Leading a nomadic lifestyle, he enjoys using the Web to purchase from Acme, as he can do it any time and from anywhere.

Wile stops into a cybercafe and calls up the Acme Products site to order new supplies. He finds the anvil

he’s interested in and buys it…”

definition

Page 17: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

6. Task Analysis

Discrete step-by-step analysis of how users do thingsTakes mushy information and starts making it solidGood time for client inputTypically for transactional sites, handy for process-based contentUser and Task Analysis for Interface Design, Hackos and Redish

definition

Page 18: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

7. Task Analysis

I. Buy An Anvil

A. Find The Anvil

i. Search For Anvil

a. Type in "anvil" in Search box

b. Read results

ii. Browse the Store

iii. View anvil

B. Purchase The Anvil

definition

Page 19: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

8. Functional Requirements

List out all the possible features and functionality for the sitePrioritize themMajor sign-off agreement for proceeding with siteStart roadmap with subsequent phasesGood time for revisiting budget

definition

Page 20: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

DESIGN

Page 21: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

9. Content Grouping

Affinity Diagrams and Card SortingHave team or users place concepts together that make senseGood for developing hierarchy or menu groups

design

Page 22: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

10. Site Architecture

The Site’s BlueprintTask-oriented flowsSite mapsInformation Architecture for the World Wide Web, Rosenfeld and Morville

design

Page 23: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

10. Site Architecture

Task-oriented flowsFrom task analysis, focus on particular user task

Detail all the possibilities of that task

For more “interaction-heavy” areas

design

Page 24: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

10. Site Architecture

Task oriented flow

design

Page 25: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

10. Site Architecture

Site MapStructure of entire siteLess interaction detail, more content placement

Serve as blueprint for site’s design and production

design

Page 26: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

10. Site ArchitectureSite Map

design

Page 27: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

11. Paper Prototypes

Interactive paper sketches of your site’s key functionalityGreat team activityGood balance with the eminently logical site mapsUser testing and input

design

Page 28: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

12. Functional HTML Prototype

Fully functional prototype of the main areas of your siteNon-designed--the focus is on the functionalityA high-fidelity prototype that will make problems painfully clearExample

design

Page 29: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

13. Usability Testing

User TestingGive real people tasks to accomplish with prototype

Heuristic EvaluationsHave experts assess based on guidelines

Rev your prototype and architectureUsability Engineering, Nielsen

design

Page 30: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

14. Functional Specification

Detailed description of every page and the functionality on itThe site’s BibleThis, the prototype, and the site architecture should cover the totality of the site’s structure and functionality

design

Page 31: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

15. The Rest of the Process

Serve as a consultant throughout design and developmentShould review materials before presented to clientWork with team to fix any SNAFUs

Page 32: User-Centered Design: From Concept to Product Peter Merholz peterme  peterme@peterme.com.

peterme

Thank You!

Peter Merholzpeterme

http://[email protected]