TH6204

Advance Interface
Design

Design Method (Part I)

Requirements: Data gathering, User
and Task Analysis
Lecture 6

User Centered Design

Contents
What is User Centered Design?

(Definition)
Why User Centered Design?

(Benefits)
How we achieve UCD?

(Methodology)

What is User-Centered
Design?
Is an approach to interactive system

development that focuses specifically on

making products/web interfaces usable.
The quality of interaction between the person

who uses the product to achieve actual work

and the product itself is the primary goal of
user-centered design.
User-centered systems empower users and

motivate them to learn and explore new

system solutions

What is User-Centered
Design?
User Centered Design (UCD) is a

process and design philosophy

focused on placing input from
user research as the focal point
of design decision

What is User-Centered Design

Process?
User Centered Design (UCD) is an approach to design that
grounds the process in information about the people who
will use the product
-Usability Professionals Association

A design philosophy and a process in which the needs, wants

and limitations of end users of are given extensive attention
at each stage of the design process
-Wikipedia

User Centered Design (UCD) is an approach for employing

usability. It is a structured product development
methodology that involves users throughout all stages of
web site development, in order to create a web site that
meets users needs

What is User-Centered Design

Process?
The user-centered design
methodology is characterized
by:
* the involvement of users throughout the
design
process* the use of an iterative design cycle

What is User-Centered Design

Process?
Focus on users
There are a number of ways in which user participation

can be facilitated throughout the design process:

Focus groups, Survey (Questionnaire), Interviews,

Observation, User testing, and many more

more information at http://www.usableweb.com

What is User-Centered Design

Process?
Iterative Design Cycle

Validate

Develop

Define

Design

Why User Centered

Design
1.
2.
3.
4.
5.
6.

Decreased development cost

Increased revenue
Improved user productivity
Reduced training costs
Better customer loyalty
Reduced customer service cost

More information.
http://www.usabilitynet.org/trump/methods/integration/benefits.htm
http://www.flow-interactive .com/business-case-for-ucd

Requirements
Gathering
The outcome of any design is judged by how

successful it meets the needs of the product

desired by both users and organisation that
commissioned it.
Designer must understand:
Clear and detailed knowledge of the users
What users can do with the product tasks

users can perform using the product

How the product in used in the organisation
the environment where the product is used

Requirements
Gathering
The purpose of data gathering are:
to collect sufficient, accurate, and relevant

data so that a set of stable requirements can

be produced.
To capture users reactions and performance
with a system or prototype.

How do we get there?

Methods for involving the users 3
main techniques in data gathering:

Interviews

Questionnaires

Observation

Four key issues

1.

Setting goals

2.

Decide how to analyze data once collected

Relationship with participants

Clear and professional
Informed consent when appropriate

3.

Triangulation

4.

Use more than one approach

Pilot studies

Small trial of main study

Data recording
Notes, audio, video, photographs
Notes plus photographs
Audio plus photographs
Video recorder

Informed Consent Form

Contents may include:
Purpose of study
How data collected will be used
Participants confidentiality
Withdrawal of participation

Data Recording
Criterion

Notes +
Camera

Audio + Camera

Video

Equipmen
t

Paper, pencil,
and camera are
easily available

Inexpensive, handheld recorder with a

good microphone.
Headset useful for
easy transcription

More expensive.
Editing, mixing, and
analysis equipment
needed

Flexibility
of use

Very flexible,
unobtrusive

Flexible. Relatively
unobtrusive

Needs positioning
and focusing camera
lens. Obtrusive

Complete
ness of
data

Only get what

note taker thinks
is important and
can record in the
time available.
Problem with
inexperienced
evaluators

Can obtain
complete audio
recording but visual
data is missing.
Notes, photographs,
sketches can
augment recording
but need
coordinating with

Most complete
method of data
collecting, especially
if more than one
camera used, but
coordination of video
material is needed

Data Recording
Criterion

Notes +
Camera

Audio + Camera

Video

Disturban
ce to
users

Very low

Low, but
microphone needs
to be positioned

Medium. Camera
needs to be
positioned on tripod.
Care needed to avoid
Hawthorne effect

Reliability
of data

May be low.
Relies on
humans making
good record and
knowing what to
record

High but external

noise, e.g. fans in
computers, can
muffle what is said

Can be high but

depends ion what
camera is focused on

Analysis

Relatively easy
to transcribe.
Rich
descriptions can
be produced.

Critical discussions
can be identified.
Transcription
needed for detailed
analysis. Permanent
original record that

Critical incidents can

be identified and
tagged. Software
tools are available for
detailed analysis.
Permanent original

Technique 1

Interviews

Interviews
Unstructured - are not directed by a
script. Rich but not replicable.
Structured - are tightly scripted, often
like a questionnaire. Replicable but may
lack richness.
Semi-structured - guided by a script
but interesting issues can be explored in
more depth. Can provide a good
balance between richness and
replicability.

Interviews
Depends on the purpose of the interview,
the question to be address, and the stage in
the lifecycle.
For examples,
if the goal is to gain first impression about how
users react to a new design (ie. interactive
features)-informal or open-ended interview.
If the goal is to get feedback on particular
design feature, layout or a new web browserstructure interview of questionnaire.

Interview questions

Two types:

closed questions have a predetermined answer

format, e.g., yes or no
open questions do not have a predetermined format
Closed questions are easier to analyze
Avoid:
Long questions
Compound sentences - split them into two
Jargon and language that the interviewee may not
understand
Leading questions that make assumptions e.g., why do
you like ?
Unconscious biases e.g., gender stereotypes

Running the interview

Introduction introduce yourself, explain the
goals of the interview, reassure about the ethical
issues, ask to record, present any informed
consent form.
Warm-up make first questions easy and nonthreatening.
Main body present questions in a logical order
A cool-off period include a few easy questions
to defuse tension at the end
Closure thank interviewee, signal the end,
e.g, switch recorder off.

Enriching the interview process

Props - devices for prompting interviewee, e.g., a
prototype, scenario

Focus Group
Group interview
More appropriate to investigate community

issues rather than individual experiences.

3-10 people involve-led by trained facilitator.
Participants are selected to provide a
representative sample of a target population.
Example
Evaluation of university website-a group of

admin staffs, faculty members or students

Focus Group
Interview with a number of representative

stakeholders at the same time

Also known as workshop
Issues are discussed and each participant
responses
Decisions can be made based on consensus
Conflicts and disagreement can be resolved

Technique 2

Questionnaires

Questionnaires
Questions can be closed or open
Closed questions are easier to analyze,
and may be done by computer
Can be administered to large populations
Paper, email and the web used for
dissemination
Sampling can be a problem when the size
of a population is unknown as is common
online

Questionnaire design
The impact of a question can be influenced by
question order.
Do you need different versions of the
questionnaire for different populations?
Provide clear instructions on how to complete the
questionnaire.
Strike a balance between using white space and
keeping the questionnaire compact.
Decide on whether phrases will all be positive, all
negative or mixed.

Question and response format

Yes and No checkboxes
Checkboxes that offer many options
Rating scales
Likert scales
semantic differential scales
3, 5, 7 or more points?
Open-ended responses

Likert Scale Example :

http://oldwww.acm.org/perlman/question.html

Semantic Differential
Scale (eg)

Encouraging a good
response
Make sure purpose of study is clear
Promise anonymity
Ensure questionnaire is well designed
Offer a short version for those who do not have

time to complete a long questionnaire

If mailed, include a stamped addressed
envelope
Follow-up with emails, phone calls, letters
Provide an incentive
40% response rate is high, 20% is often
acceptable

Advantages of online
questionnaires

Responses are usually received quickly

No copying and postage costs
Data can be collected in database for analysis
Time required for data analysis is reduced
Errors can be corrected easily

Problems with online questionnaires

Sampling is problematic if population size is

unknown
Preventing individuals from responding more
than once
Individuals have also been known to change
questions in email questionnaires
Tools :
Google Drive
QuestionPro (http://www.questionpro.com/)

Technique 3

Observation

Observation
Useful data gathering at any stage

during product development.

Early in design- to understand users
contact, tasks and goals.
Later in development-to investigate how
well the developing prototype support
tasks and goal.

Observation
Direct observation in the field
Structuring frameworks
Degree of participation (insider or

outsider)
Ethnography
Direct observation in controlled
environments
Indirect observation: tracking users
activities
Diaries
Interaction logging

Structuring frameworks to guide

observation
- The person. Who?

- The place. Where?

- The thing. What?
The Goetz and LeCompte (1984) framework:

Who is present?
What is their role?
What is happening?
When does the activity occur?
Where is it happening?
Why is it happening?
How is the activity organized?

Ethnography
Ethnography is a philosophy with a set of techniques that

include participant observation and interviews

Debate about differences between participant
observation and ethnography
Ethnographers immerse themselves in the culture that
they study
A researchers degree of participation can vary along a
scale from outside to inside
Analyzing video and data logs can be time-consuming
Collections of comments, incidents, and artifacts are
made

Ethnography
Co-operation of people being observed is

required
Informants are useful
Data analysis is continuous
Interpretivist technique
Questions get refined as understanding
grows
Reports usually contain examples

Direct observation in a controlled

setting
Think-aloud technique

Indirect observation
Diaries
Interaction logs
Tangible objects

Choosing and combining techniques

Depends on
The focus of the study
The participants involved
The nature of the technique
The resources available
For Triangulation

Choosing and combining

techniques
Techniqu Good for
e

Data

Advantages

Disadvantage
s

Interview
s

Exploring
issues

Some
quantitativ
e, but
mostly
qualitative

-Interviewer can
guide interviewee if
necessary
-Encourages contract
between developers
and users

-Time
consuming
-Artificial
environment
may intimidate
interviewee

Focus
groups

Collecting
multiple
viewpoint
s

Some
quantitativ
e, but
mostly
qualitative

-Highlights areas of
consensus and
conflict
-Encourages contact
between developers
and users

- Possibility of
dominant
characters

Choosing and combining

techniques
Techniqu Good for
e

Data

Advantages

Disadvantage
s

Questionn Answerin
aires
g specific
questions

Quantitativ
e and
qualitative

-Can reach many

people with low
resources

-The design is
crucial
-Response rate
may be low
-Responses
may not be
what you want

-Observing actual
work gives insights
what other
techniques cant
give

-Very timeconsuming.
-Huge amounts
of data

Direct
observati
on

Understa Mostly
nding
qualitative
context of
user
activity

Activity 1 Data
Recording
Imagine you are a consultant who is employed to

help develop a new computerised garden planning

tool to be used by amateur and professional
garden designers. Your goal is to find out how
garden designers use an early prototype as they
walk around their clients gardens sketching design
ideas, taking notes, and asking clients about what
they like and how they and their families use the
garden. What are the advantages and
disadvantages of the three approaches to data
recording discussed above, in this environment?

Activity 2 Observation (field vs

controlled)
Scenario 1
A usability consultant joins a group who have been given

GPS-based phones to test on a visit to Stockholm. Not

knowing the restaurants in the area, they use the GPSbased phone to find a list of restaurants within a five-mile
radius of their hotel. Several are listed and while the
group waits for a taxi, they find the telephone numbers of
a couple, call them to ask about their menus, select one,
make a booking, and head off to the restaurant. The
usability consultant observes some problems keying
instructions because the buttons seem small. She also
notices that the text on the screen seems rather small, but
the person using it is able to get the information needed
and call the restaurant. Discussion with the group
supports the evaluators impression that there are
problems with the interface, but on balance the device is
useful and the group is pleased to get a table at a good
restaurant nearby.

Activity 2 Observation (field vs

controlled)
Scenario 2
A usability consultant observes how participants perform

a pre-planned task using the GPS-based phone in a

usability laboratory. The task requires the participants to
find the telephone number of a restaurant called Matisse.
It takes them several minutes to do this and they appear
to have problems. The video recording and interaction
log suggest that the screen too small for the amount of
information they need to access and this is supported by
participants answers on a user satisfaction
questionnaire.

Activity 2 Observation (field vs

controlled)
Questions:
In which situation does the observer take the most

control?
What are the advantages and disadvantages of these two
types of observation?
When might each type of observation be useful?

Summary
Three main data gathering methods: interviews,

questionnaires, observation
Four key issues of data gathering: goals,
triangulation, participant relationship, pilot
Interviews may be structured, semi-structured or
unstructured
Questionnaires may be on paper, online or
telephone
Observation may be direct or indirect, in the field
or in controlled setting
Techniques can be combined depending on study
focus, participants, nature of technique and
available resources

User Study

Why Study Users?

Users decide whether to use a product, not

designers or supervisors
Even if dictated by the supervisors, how the
product is used is self-determined.
This is affected by :
Likes and dislikes
Habits and skills
Education and training

The more we know about users, the better

we can design for them

Understanding Users
We need to discover the answers for the

following questions:
What are the individual characteristics that

may affect their behaviour with the software of

information we design? preference /
problems
What values to they bring to the job? Are they
enthusiastic learners? Do they hope that their
interaction with the interface will be fun, not
boring? Are they interested in saving money,
saving time, becoming expert, having an easy
job to do? attitude, motivation

Understanding Users
(Continued):
What do they know about the subject matter
and the tools they use today, or the ones we
might present in the new interface?
knowledge, expectations
What is their prior experience using similar
tools and interfaces?
What are their actual jobs and tasks? What
reasons do they have for using the product?
roles, responsibilities

User Profile
Users have characteristics that are relevant

to UI design user profile

User profile includes:
Age
Gender
Culture

Physical abilities and disabilities

Educational background
Computer/IT experience
Motivation
Attitude

User Profile
Example of user profile of ATM customers
Age

Will range in age from about 12 to 80+. Will be of

varying heights

Gender

Both male and female

Physical
limitations

May be fully able-bodied or may have some physical

limitations in relation to hearing, sight, mobility,
use of hands, or wheelchair use.

Educational
background

May have only minimal education qualifications and

possess limited literacy and numeracy skills

Computer/IT
skills

May have little or no prior experience of computer

or IT use

Motivation

May be very motivated to use the ATM, particularly

if they can do their banking quickly and avoid
waiting in long lines at the bank

Attitude

Attitudes to use may vary, depending on the

services the ATM offers, the reliability of the
technology itself, and the attitude of users toward
computers

User Profile
The user profile is translated into UI Requirements, eg.:
Age range from 12 to
80+

ATM screen height needs to accommodate

users of varying height

May be fully able-bodied

or may have some
physical limitations

ATM screen height needs to accommodate

able-bodied users as well as users with
walking sticks or wheelchairs.

May have some physical

limitations in relation to
hearing

All user inputs should have both visual and

auditory feedback

May have some physical

limitations in relation to
sight

Screen text should be of a reasonably large

font, in order to be read by both the
visually impaired and unimpaired

May have some physical

limitations in relation to
use of hands

Touchscreens, if used, should have target

area large enough to locate
Touchscreens, if used, should be sensitive
enough to respond to users with decreased
strength in fingers

Little or no experience
of computer/IT use

The application should be easy to learn and

use.

User Profile
Smaller user groups are easier to design for
Different user group use a system differently
The user profile for ATM customers can be

broken into 3 user groups:

Teens / young adults
Young adults to middle age
Middle age to senior citizen

User Profile
The user characteristics for teens/young adults
Age

12 to 25

Gender

Both male and female

Physical
limitations

May be fully able-bodied or may have some

physical limitations in relation to, e.g. hearing or
sight. Height varies.

Educational
background

May have minimal or no educational qualifications

Computer/IT use

Probably have some prior experience of computer

or IT use

Motivation

Probably very motivated to use the ATM, especially

in relation to their banking habits

Attitude

Attitudes to use may vary, depending on the

services the ATM offers and the reliability of the
technology itself

User Profile
The user characteristics for young adults to middle age
Age

25 to 50

Gender

Both male and female

Physical
limitations

May be fully able-bodied or may have some

physical limitations in relation to, e.g. hearing or
sight. Height varies.

Educational
background

May have only minimal educational qualifications

Computer/IT use

May have little or no prior experience of

computer/IT use

Motivation

Could be very motivated to use the ATM, especially

if they can do their banking quickly and avoid
standing in line at the bank

Attitude

Attitudes to use may vary, depending on the

services the ATM offers and the reliability of the
technology itself

User Profile
The user characteristics for middle age to senior citizens
Age

50 to 80+

Gender

Both male and female

Physical
limitations

May be fully able-bodied or may have some

physical limitations in relation to, e.g. hearing or
sight, mobility, or use of hands. Height varies.

Educational
background

May have only minimal educational qualifications

Computer/IT use

May have little or no prior experience of

computer/IT use

Motivation

Could be very motivated to use the ATM, but would

probably prefer to stand in a line in the bank

Attitude

Attitudes to use may vary, depending on the

services the ATM offers and the reliability of the
technology itself

Persona
Derived from patterns observed during

interviews with and observations of users and

potential users (sometimes customers) of a
product
A precise description of a user and what he or
she wishes to do when using a system
Could also be an imaginary example of the
real users
Give as specific as possible about the madeup details
Serve as a concrete person in the designers

Persona
Example of persona for the ATM users: the user

group teens/young adults

Felix is 13 years old. He gets an allowance every

week, but spends it while out with his friends, and
there usually is not anything left over to bank. He
often gets money from his grandparents and
uncles for his birthday and at Christmas, and this
money is always deposited into his bank account.
He saves this for more expensive or extravagant
purchases; for example, he has a game console
and likes to have the newest games. Plus he likes
to be trendy and have the newest jeans and
trainers. Felixs account allows him to withdraw
small amounts of money from ATMs.

Persona
Example of persona for the ATM users: the user

group young adults to middle age

Sandra is 30 years old. She is married to Jason, and
they have two children: Todd, age 6, and Carly, age
18 months. When Carly was born the family moved
into one of the newly built housing areas in the
town; local amenities such as shops, bars, or a bank
have yet to be built. This means that any shopping
or banking must be done in the town center, which
is six-mile round-trip from the family home. Jason
uses the car for work, and he works long hours he
is often gone from 6:45 am to 8 pm.

Persona
Sandra is partially sighted, so she does not drive
and depends on public transportation to get
anywhere.
She tries to do any errands, like
shopping and banking, during Todds school hours,
as handling one child by public transportation can
be difficult (especially with a stroller), but it is far
easier than trying to cope with two. Sandra likes the
ATM for depositing and withdrawing money and for
checking her balance because she can see the
screen if she gets near enough to it, and she has
learned the menu sequence. The ATM is in the
front wall of the bank, and there is no canopy to
protect customers from poor weather conditions.

Persona
Example of persona for the ATM users: the user

group middle age to senior citizen

Grandpa Maurice is 68 years old. His pension is
automatically credited to his bank account once a
month. Every week he goes into the bank to
withdraw enough cash for the week as he prefers to
pay for his groceries and other day-to-day expenses
with cash. While standing in line is a bit difficult
(Grandpa Maurice has arthritis in his hip), he does it
because he prefers to get his money from a person.
Also, he is not very comfortable with technology,
he does not have an ATM card.

Task Analysis

Why Analyse Tasks?

Each task performed by users aims to

accomplish a certain goal

Goals determine the success of users jobs
To ensure a job is successful, the design
should support users to accomplish all the
goals of all the tasks required
The more we know about the tasks, the
better we can design for them

Task Analysis
Task analysis the activity system designers

use to gain an understanding of what a computer

must do and the functionality that the system
must provide if it is to support users in their goals
and tasks.
Goal an end result to be achieved
Task a structured set of related activities that

are undertaken in some sequence

Action an individual operation or step that
needs to be undertaken as part of the task

Task Analysis
Like users, tasks have characteristics that affect

UI design :
The extent to which tasks vary from one occasion to another

similarity and differences

Whether tasks will be carried out regularly, infrequently, or
only once frequency
The knowledge and kinds of skill required to perform tasks
How much of the work is affected by changes in the
environment
Whether time is critical for work
Whether there are safety hazards
Whether the user will do the work alone or with others
collaboration
Whether the user will normally be switching between

Tasks Analysis
To understand the users work, need to look at

several levels of detail:

Work-flow analysis how workers

communicate and how they coordinate their

work to get the job done
Job analysis look at responsibilities of
individual workers and examine what they do in
their jobs
Task list and task inventory what the users
have to be able to accomplish
Process analysis and task sequence How
individual users do a process / task
Task Hierarchy levels of tasks and their

Models of Tasks Analysis

Models describing steps required to

complete a task

Scenarios

Use cases

Hierarchical Task Analysis (HTA)

Scenarios
Task scenario a narrative description of a

task
Personalised, and describe a specific instance

and situation of use :

Step-by-step procedures to complete a task
Features and behaviour of the system
Problems and difficulties that users may have

had with the current system

Scenarios : Example
Emily Adams has just arrived at Kuala Lumpur
airport en route to a large conference. Looking
around for a bank in order to get some local
currency, she sees a foreign currency exchange ATM
that seems similar to the one she uses at home.
She parks her suitcase, takes out a credit card,
and inserts it into the slot. A message is displayed
on the screen:
Enter your PIN.
Emily thinks for a few moments and then types a
four-digit number on the numerical pad, listening to
the reassuring beep that follows each key press.
The machine pauses for a few seconds and then
displays:
Select currency required.

Scenarios : Example
Emily pauses again. What is the currency in
Malaysia? Fortunately the machine offers a default
of Ringgit, so she guesses that must be the local
currency and presses the key. The machine displays
the message:
Exchange rate is 3.75 Ringgit to one dollar US.
Enter amount required in Ringgit in units of 10.
Press (Proceed).

Emily enters 380 and presses <Proceed>. There

is a whirring noise and a few other indeterminate
clunks and clicks. Her credit card is returned from
the card entry slot and the money is deposited in the
delivery slot, along with a print-out of the

Exercise 1
Based on your own mobile phone, write a

scenario for storing a contact number of a

person you just called you.

Task Analysis : Use Cases

Use cases can be used
As part of requirements gathering
in the design phase

Concrete use case

similar to task scenario, a detailed description

of a task, but not personalised
Essential use case
describes a task at a high level of abstraction
contains no assumptions about the UI or
technology used

Concrete Use Case :

Example
User Action

System Response

User inserts credit card

into the slot.

System requests PIN.

User types in 4-digit PIN System verifies users identity.

number using the
System requests foreign currency required,
keypad.
to be selected using menu keys.
User presses the key
corresponding to the
required currency.

System displays the exchange rate.

System requests the user to enter the
amount of foreign currency required using
the keypad.
The unit of currency is also displayed, as
the system only deals with banknotes.

User enters amount

required using the
keypad.

System returns the credit card via the slot.

System dispenses the currency via the
currency delivery slot.
System delivers a printout of the
transaction via the receipt slot.

Essential Use Case :

Example
User s Purpose

System Responsibility

Identify self.

Validate users identity.

Display currencies available.

Select currency required.

Display exchange rate.

Enter amount of foreign

currency required.

Calculate amount multiplied by

exchange rate.

Confirm amount.

Request initiation of payment.

Obtain authorization for amount.
Give money

Take money and go.

Exercise 2
Based on your own mobile phone, write a

concrete use case for calling a person using

the number stored in your contacts list.

Task Analysis :
Hierarchical Task Analysis
(HTA)
Breaks a task down into subtasks and then into

sub-subtasks and so on.

These sub-subtasks are then grouped together as
plans that specify how tasks might be performed
in an actual situation
Focuses on the physical and observable actions
that are performed, and includes looking at
actions that are not related to software or an
interaction device at all

HTA : Example

An HTA for borrowing a book from the library:

0. In order to borrow a book from the library

1. go to the library
2. find the required book
2.1. access library catalog
2.2. access the search system
2.3. enter search criteria
2.4. identify required book
2.5. note location
3. go to correct shelf and retrieve book
4. take book to checkout counter
Plan 0: do 1-3-4. If book isnt on the shelf expected, do 2-3-4
Plan 2: do 2.1-2.4-2.5. If book not identified do 2.2-2.3-2.4-2.5.

Exercise 4
Write a Hierarchical Task Analysis (HTA) for

registering HCI course at the beginning of

semester using SMP