hcsd talk ibm

Human Centered Software Design

If it doesn’t work for people, it doesn’t work!(And now for something completely different…)

Created by: Hadar Ziv, Judy Olson, Bart KnijnenburgUniversity of California Irvine

About Me

Bart Knijnenburg

– Current: UC Irvine– Institute for Software Research– Privacy and personalization

– TU Eindhoven– Human Technology Interaction

– Carnegie Mellon University– Human-Computer Interaction

Institute

@usabart -- www.usabart.nl

Presentation Outline

Introduction and motivation

HCSD: Augmenting software engineering with HCD

Overview of HCD methods

Success stories

Questions and Discussion

Unstoppable Innovation

0 18 36 54 72

Moore’s Law

Unstoppable Innovation

Unstoppable Innovation

“Threshold of Frustration”After a certain point technology gets so complex that it becomes too frustrating to use

Unstoppable Innovation

Hoping (and testing)… with people!

Two versions of barackobama.com– A/B testing

– Different…– Photo (rally, family, …)– Button (sign up, learn more, …)

We have a winner!– The second version…

– Collected more email addresses– $ 60 000 000 additional campaign

dollars!

Usability is essential…

Expensive, safety-critical technology– Tested with real

people!

Examples:– Medical devices

Usability is essential…

Expensive, safety-critical technology– Tested with real

people!

Examples:– Medical devices

– Nuclear power plant control rooms

Usability is essential…

Expensive, safety-critical technology– Tested with real

people!

Examples:– Medical devices

– Nuclear power plant control rooms

– Airplane cockpits

Usability (UCD) works!

User-centered design works– Simple

– Inexpensive

– Higher sales

– Higher satisfaction

Why is it not used?– Printers?

–

Usability (UCD) works!

User-centered design works– Simple

– Inexpensive

– Higher sales

– Higher satisfaction

Why is it not used?– Printers?

– Car stereos?

–

Usability (UCD) works!

User-centered design works– Simple

– Inexpensive

– Higher sales

– Higher satisfaction

Why is it not used?– Printers?

– Car stereos?

– Tax forms?

Unstoppable Innovation

0 2 4 6 8

Moore’s Law

More!

Moore!

Mooore!

Moooore!

Is this your software? Very likely…

How can we solve this problem?

Answer: Human Centered Software Design!

The Software Iterative Model

Business Modeling

Implementation

Test

Analysis & Design

Preliminary Iteration(s)

Iter.#1

Iter.#2

Iter.#n

Iter.#n+

1

Iter.#n+

2

Iter.#m

Iter.#m+

1

Deployment

Requirements

Who here is doing this?

Business Modeling

Implementation

Test

Analysis & Design

Preliminary Iteration(s)

Iter.#1

Iter.#2

Iter.#n

Iter.#n+

1

Iter.#n+

2

Iter.#m

Iter.#m+

1

Deployment

Requirements

User Test

What is wrong with this?

Testing at ALL stages

Preliminary Iteration(s)

Iter.#1

Iter.#2

Iter.#n

Iter.#n+

1

Iter.#n+

2

Iter.#m

Iter.#m+

1

User Test

More than just testing

Preliminary Iteration(s)

Iter.#1

Iter.#2

Iter.#n

Iter.#n+

1

Iter.#n+

2

Iter.#m

Iter.#m+

1

User Requirements

Interaction Analysis & Design

User Test

Interviews and ObservationsPersonas

ScenariosSwimming Lane Diagrams

StoryboardsDesign guidelines

Site mapMockups

Heuristic EvaluationUser tests

HCSD: A Blended Model

Business Modeling

Implementation

Test

Analysis & Design

Preliminary Iteration(s)

Iter.#1

Iter.#2

Iter.#n

Iter.#n+

1

Iter.#n+

2

Iter.#m

Iter.#m+

1

Deployment

Requirements

User Requirements

Interaction Analysis & Design

User Test

HCSD: A Blended Model

Process of designing from the user’s perspective– Does the right thing

– Is easy to learn and use

– Is satisfying

Beyond business goals, fancy features, and technological capabilities

Informatics at UC Irvine

University of California, Irvine– The “Best UC” in “The OC” (Orange County, CA)

– Top (#1) university in the US and #4 worldwide in a ranking of universities “under 50” (2012)

Bren School of Information and Computer Sciences– The only CS/ICS school in the UC system

– Multiple degrees, including a major in Informatics

HCSD at Informatics

Capstone senior design project – Year-long (3 quarters)

– Required for the Informatics major

– Develop software for real needs of real users and stakeholders

HCSD at UC Irvine

Software engineering

– Business and software requirements– Scenarios, use cases, user

stories, activity diagrams

– Software analysis and design– OOAD, UML, MVC

– Implementation– Java coding, .Net/C#,

PHP/MySQL, Python, Ruby

– Software Testing

– Project management

Human-Centered Design (HCD)

– Requirements– Interviews & observations,

Personas, Scenarios, Swimming lanes

– HC analysis and design– Site maps, Storyboards,

Guidelines, Mockups

– HC testing– Heuristic evaluation, User

testing

Human Centered Design Methods

An Overview

User Testing

InteractionAnalysis &

Design

User Requirements

Human Centered Design Methods

Interviews and observations of end users

Personas

Scenarios

Swimming Lane Diagrams

Storyboards

Design guidelines

Site Map / Generalized Transition Network

Mockup

Heuristic Evaluation

User testing

Interviews and observations

On site– “to see”

Watch– Tacit knowledge

Personas

A user-archetype– The “embodiment” of user needs, goals, desires and

limitations

– See the real purpose behind requirements

Useful during design– What would George do?

– How would Sharon use this feature?

During user testing– Bring in 3 Maries

– What tasks does she want to accomplish?

CaseTrak: Persona

Angela Lee– 28 year old resident physician at the UCI

Medical Center

– passionate about becoming a better physician

– loves working in the Emergency Department

– Enthusiastic about the potential of the new Electronic Medical Records (EMR)

– Used Merlin as a student, but didn’t like it because the system took up a lot of her limited free time

– She prefers going home over staying longer at work to enter required case data into one of the computer stations

Scenarios

Story of use with the new product– Leads well into use cases

– Focused on the why of each use case

Companies do this successfully– One of the main tools of the Gmail team

Our students do this successfully

CaseTrak: Scenario

While eating lunch, Angela uses the new app enter information from a few of her cases today

She grabs her chart notes and starts the application

The app makes data entry a lot faster: it is structured and requires less free typing than the Merlin system

For example, there are fields for acuity, involvement level, age and gender, with all the options given

She loves that CaseTrak saves her case information, so she can go back and add a secondary diagnosis

While her peers are stuck in front of the Merlin system after work, she’ll be on her way home to relax

Swimming Lane Diagrams

Introduce the software design into the scenario– What is the user’s workflow?

– What components are needed to support this workflow?

– How does the user interact with these components?

Invaluable for “groupware”!

CaseTrak: Swimming Lane Diagram

Retrieve Cases for Review

Su

perv

isin

gP

hysic

ian

Storyboards

Introduce the interface design into the scenario– How does the user interact with the system in

each step of her workflow?

– How can we support and improve their current workflow?

CaseTrak: Storyboard

CaseTrak: Storyboard

Generalized Transition Network (GTN)

Integrate all storyboards into one system diagram– A “screenshot” of each step in the interaction

– All possible transitions between steps

Useful for reflection– “Remote” features, “dead ends”, infinite loops

CaseTrak: GTN

Mockups (using Balsamiq)

CaseTrak: Mockups (before testing)

Design Guidelines

Heuristic Evaluation

– Visibility of system status

– Match system words to the real world

– User control and freedom

– Consistency and standards

– Error prevention

– Recognition rather than recall

– Accelerators

– Minimalist design

– Help users recognize and recover from errors

– Help and documentation

User Testing

CaseTrak: Mockups (after testing)

User Testing

InteractionAnalysis &

Design

User Requirements

Human Centered Design Methods

Interviews and observations of end users

Personas

Scenarios

Swimming Lane Diagrams

Storyboards

Design guidelines

Site Map / Generalized Transition Network

Mockup

Heuristic Evaluation

User testing

What do I get in return?Profit! Profit! Profit!

Apple knows…

Example: breastcancer.org

Return on Investment

When using HCD well– Sales increase by 100%

– It doubles

– Traffic count increases by 150%– More than doubles

– User performance increase by 160%– Cuts time by more than half

Nielsen & Gilutz 2006

HCSD at UC Irvine

“This is a jewel at UCI… I feel very lucky to be involved…”

(Stew Sutton, Aerospace Corp.)

HCSD at UC Irvine

“It is probably the most useful class I’ve taken at UCI…”

(A student)

Summary

Usability works!– If it doesn’t work for people, it doesn’t work!

HCD Benefits:– Traffic/Sales increase

– User happiness/User productivity increase

– Customer retention/Customer loyalty increase

How?– HCD Methods

– Easy to integrate in existing software engineering processes

Thank you!

We teach this integrated process/lifecycle

Our students follow it during a year long capstone course at UCI– CaseTrak, other projects successful

Contact us if you’d like to:– Learn more about how it (usability) works

– Participate in UCI Informatics capstone project course

ziv@ics.uci.edu jsolson@uci.edu bart.k@uci.edu