Transcript User Centered Design

SIMS 213:
User Interface Design &
Development
Marti Hearst
Tues, Jan 23, 2001
Announcements

Talk today
–
–

Paul Pangaro: Who's Wants To Be Prototyper? The
End-User Does - A Subversive Perspective for HCI
4:00-5:30, 202 South Hall
The reader is ready
Assignment

Class Project Proposal
–

It’s on the webpage now.
Readings
–
–
–
–
Cooper (chapters 9-11) (Reader)
Nielsen Ch. 3, 4, & 7
Johnson, Ch. 1
Gomoll, Ims (Reader)
Usability in the News


Front page of today’s NYTimes Science Times
Don Norman (first in the reader!)
–
Talking about problems with doors
Simple usability tests show this ballot is
flawed,others aren’t
–
http://www.nytimes.com/2001/01/23/science/23USEA.html?pagewanted=all
–
Web Design in the News


Politics meets web design: www.whitehouse.gov
–
The Unnoticed Presidential Transition: Whither Whitehouse.gov? By
Richard Wiggins
–
http://www.firstmonday.org/issues/issue6_1/wiggins/index.html
Don’t make this mistake:
Why User-Centered Design?

System will fail if it
–
–

does not do what the user needs
is inappropriate for the user
Why don’t we just define what a “good
interface” is?
–
–
Infinite variety of users and tasks
guidelines are usually too vague
e.g. “Provide feedback”, “Be intuitive”
Slide by James Landay
Participatory Design



A subset of user-centered design
User actively participates in design of the system
Pros
–
–
–
–
potentially more accurate information about the tasks
more opportunity for users to influence the design decisions
buy-in from sense of participation
potential greater acceptance of final system
Slide adapted from Ben
Shneiderman
Participatory Design

Cons (potential)
–
–
–
–
–
–
more costly
lengthier implementation period
antagonism from those whose suggestion are not
incorporated
force designers to compromise design
exacerbate personality conflicts between designers
and users
highlight organizational politics
Slide adapted from Ben
Shneiderman
User-Centered Design Overview

Needs assessment
–
Find out



–
Task Analysis





who users are
what their goals are
what tasks they need to perform
Characterize what steps users need to take
Create scenarios of actual use
Decide which users and tasks to support
Design based on this
Evaluation
–
–
Test interface by “walking through” tasks
Do this before implementation
Caveats

Politics
–
–
–

Don’t design forever without prototyping
–

advocating change can cause controversy
get a sense of the organization
important to get buy-in from all those involved
rapid prototyping, evaluation, & iteration is key to
technique
Systems level apps are poor candidates
–
networking, etc.
Slide by James Landay
Student Course Enrollment:
Helping the University Help
Students Achieve their Goals
achieve lifetime of success
become successful IT manager
learn to build useful systems
enroll in sims 213
Help Users Achieve Goals

Example: Course Enrollment Software
–
–
–
What matters from the programmers’ point of view?
What matters from users’ point of view?
What about the course administrators?
User-Centered Design Example


You have been hired by Pizzas R Us (PRU)
Design a system to
–

make online orders from the web
Also considering special features
–
–
–
–
online discount coupons
allowing party orders in advance
customer recommendations, linking to reviews
comparing local pizza parlors
User-centered Design Example

Your job: figure out
–
–
–
–


how people do their pizza ordering now
how they would like to do it online
what features would make sense when
must also take into account the needs of the pizza parlor
owners and workers.
This is the needs assessment.
Techniques:
–
–
–
Observation
Interview
Study existing successful designs
User-Centered Design Example

Observation
–
–
Visit one or more pizza parlors. Observe how
people achieve their pizza ordering goals.
Observe what the counter people need to do.
Optionally: interview these people
User-Centered Design Example

Interview
–
–
–
Prepare a list of questions about how people do their pizza
ordering and what they would like in an automated ordering
system.
Interview at least three people about what they would like in an
automated ordering system and how they would like it to work.
Try to identify people with different needs and preferences,
with respect to their attitudes about using online ordering
systems.
Ask them what, if anything, must be in the system in order for
them to prefer it over a phone ordering system or an in-person
ordering system.
(E.g., no busy signals, cheaper prices, comparison shopping, faster
service, or would they prefer anything over current methods.)
User-Centered Design Example

Consider existing designs
–
Look at least one existing on-line food ordering web
site and see how they handle these tasks.
User-Centered Design Example

Procedure
–
–
–
Answer the needs assessment questions
Try to understand the basic tasks that are currently supported
within pizza parlors and via phone orders
Make a table showing



–
user types
tasks
(guesses about) relative frequencies of tasks
Decide which of the new tasks customers may perform using
the new interface.

Make note of which ideas you decided to drop based on your
interviews.
Needs Assessment Questions






Who is going to use the system?
What tasks do they now perform?
What tasks are desired?
How are the tasks learned?
Where are the tasks performed?
What is the relationship between the user and
the data?
Slide adapted from James
Landay
Needs assessment Questions





What other tools does the user have?
How do users communicate with each other?
How often are the tasks performed?
What are the (time) constraints on the task?
What happens when things go wrong?
Slide adapted from James
Landay
Task Analysis


Characterize what happens when users
perform typical tasks
Tools:
–
–
–
–
table of user communities vs tasks
table of task sequences
flowchart or transition diagram
videotape depicting scenario
Slide adapted from Ben
Shneiderman
Make a Table: Who by What
(adapted from Shneiderman 98)
Job Title
Query by Patient
Update Data
Nurse


Physician


Superviser


Appointment
administrator

Query across
Patients
Add Attributes

Clinical researcher

Database
programmer


How Often Do Users Perform the
Tasks?



Frequent users remember more details
Infrequent users may need more prompting
Which function is performed
–
–
–
most frequently?
by which users?
optimize system for tasks that will improve
perception of its performance
Slide adapted from James
Landay's
Augment Table with Percentages
(What percentage of the is this task done by this person)
(Numbers are only suggestive, adapted from Shneiderman 98)
Job Title
Query by Patient
Update Data
14%
11%
Physician
6%
4%
Supervisor
1%
1%
Nurse
Appointment
administrator
Query across
Patients
Add Attributes
4%
26%
Clinical researcher
8%
Database
programmer
2%
2%
User-Centered Design Example

Scenarios
–
–
Create three scenarios that will exercise these tasks
in the proposed interface
Create a description in which you outline



–
A person’s background
Their goal(s)
How they achieve these goals using the steps in the
system
Note: this will change a bit when we use personas
User-Centered Design Example

Sketch an initial design
–
Explain how the pizza ordering system will work.


–
Either a textual description or a flow chart (or both)
showing the sequences of steps that will be allowed in the
system.
Provide rough sketches showing at least three of the
important screens.
Walk through at least one of the scenarios you
developed and show how it can be handled by the
interface.
User-Centered Design Example

Pizza ordering system: Two examples
–
http://www.sims.berkeley.edu/~shom/is213/task_analysis.html
–
http://www.cs.berkeley.edu/~ivory/sims213/task-analysis/interview.html
Online Pizza Ordering Example


By Masako Sho
Overview
–
–
Based on the task analysis of pizza ordering and the
study of existing food ordering web sites, it is found
that users prefer quick and easy access, as well as
additional online features when ordering pizza.
The new online pizza ordering system supports user
registration, order modification, online help, and
features such as a preview image and calorie
calculation.
Online Pizza Ordering Example


Interviewed three people
Each has different pizza ordering and Web experience.
A. Order pizza often by phone. Use the Web mainly at work.
B. Order pizza sometimes by phone. Use the Web mainly from
home.
C. Never order pizza by phone. Use the Web both at work and
home.
Online Pizza Ordering Example

Interview questions:
1. Do you prefer to choose toppings and other options for your pizza by
yourself? Or, do you prefer to select one from the restaurant's
special combinations?
2. How long do you expect to spend on the Internet in order to place
an online order?
3. Do you want to receive confirmation of your order? If so, in what
way – via a web page, e-mail message or phone call - ?
4. Do you expect the price to be cheaper for an online order than for a
phone order?
5. What if the online order system does not respond to your order
submission? Will you try the same order again , call the pizza place,
or forget about the pizza?
6. What features would you like to find in an online ordering system?
For example, a preview image of your pizza, total calorie calculation
for your order, the top ten pizza orders of the week …?
Online Pizza Ordering Example

Summary of results:
1. Prefer to choose toppings (A)(B)(C)
2. Should not take more than five minutes. I am hungry(A). Save time by
registration (B)(C).
3. Confirmation on the web immediately after the submission of order
(A)(C). Additional confirmation by phone (B).
4. Just a little bit cheaper (A). Doesn't matter. What matters is the taste
(C).
5. Try again if the ordering process won't take time. Order by phone if it
takes too long (A). Want to get a free pizza if pizza is not delivered (A).
Give up to use the online system and make a phone call (B).
6. Nice to have a preview image (A)(C). Attractive if the calorie chart of
the order shows pizza is not actually high in calories as I thought (A).
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Online Pizza Ordering Example
Another Example (Abbreviated)

By Melody Ivory
Another Example (Abbreviated)

By Melody Ivory
Online Pizza Ordering Example
Summary

User-Centered Design
–
Design from the user’s point of view

–
As opposed to the system’s, the company’s
Participatory design involves the potential users, via



Observation
Interviews
Testing the design iteratively
Summary

Important steps
–
–
–
Needs assessment
Task analysis
Sketching and assessing designs according to
these