Computer interface design

Chapter 1

Dr. Ghassan Abu Samhadana

 Outline
• What is a user interface?
• Usability motivations
• Usability factors
• Usability problems
• Basics of usability testing
• Usability measurements and requirements

User Interface Design 2

 User Interface
• The part of the system that you see, hear and
feel.
• Interactive computer systems
– You initiate some action and system responds with
some output
– System prompts you to do something, and you
have to respond with more inputs
• These interactions take place through the
user interface.

User Interface Design 3

Fig 1.1A System interfaces

User Courses? Technical

interfaces interfaces Accounting
system

System
Hotline?

Factory
Manual?

User Interface Design 4

 Outline
• What is a user interface?
• Usability motivations
• Usability factors
• Usability problems
• Basics of usability testing
• Usability measurements and requirements

User Interface Design 5

 Design of user interfaces
• In principle, it is easy to make a user
interface.
– Just make it possible for the user to see and
change all the data in the system.
• But it is not easy to make a user interface that
is easy to use.
– Ease of use is hard to define.
– Ease of use is hard to evaluate.

User Interface Design 6

Fig 1.1B Quality factors

Easy to make a user interface: Hard to make

Just give access to the database a good
se e, edit Database
user interface
te,
crea e
t
dele

Functionality: Quality factors:

Necessary features Correctness
Availability
Performance
Security
All factors important.
Ease of use
Hard to measure, Maintainability
but possible. ...

User Interface Design 7

 Usability motivations
• Many interfaces are poorly designed and this
is true across domains:
• Life-critical systems
– Air traffic control, nuclear reactors, power utilities,
police & fire dispatch systems
– High costs, reliability and effectiveness are
expected
– Length training periods are acceptable despite the
financial cost to provide error-free performance
and avoid the low frequency but high cost errors
– Subject satisfaction is less an issue due to well
motivated users

User Interface Design 8

 Usability motivations (cont.)
• Industrial and commercial uses
– Banking, insurance, order entry, inventory
management, reservation, billing, and point-of-
sales systems
– Ease of learning is important to reduce training
costs
– Speed and error rates are relative to cost
– Speed of performance is important because of the
number of transactions
– Subjective satisfaction is fairly important to limit
operator burnout

User Interface Design 9

 Usability motivations (cont.)
• Office, home, and entertainment applications
– Word processing, electronic mail, computer conferencing,
and video game systems, educational packages, search
engines, mobile device, etc.
– Ease of learning, low error rates, and subjective satisfaction
are paramount due to use is often discretionary and
competition fierce
– Infrequent use of some applications means interfaces must
be intuitive and easy to use online help is important
– Choosing functionality is difficult because the population has
a wide range of both novice and expert users
– Competition cause the need for low cost

User Interface Design 10

 Outline
• What is a user interface?
• Usability motivations
• Usability factors
• Usability problems
• Basics of usability testing
• Usability measurements and requirements

User Interface Design 11

Fig 1.2 What is usability?

Max three menu levels

On-line help ??
Windows standard

Usability factors: Responsibility?

Programmers?
a. Fit for use (adequate functionality)
Other developers?
Ease of use: User department?
b. Ease of learning
c. Task efficiency
d. Ease of remembering
e. Subjective satisfaction Measurable
f. Understandability
Priorities vary

Game programs:
a. ??
User Interface Design 12
 Usability factors
• Fit for use – the system supports the processes and
tasks that the user needs to perform.
• Ease of learning – the system is easy to learn for
various groups of users.
• Task efficiency – frequent users can perform their
tasks efficiently.
• Ease of remembering – occasional users find it easy
to remember what to do.
• Subjective satisfaction - how satisfied is the user?
• Understandability – it is easy to understand the
system’s behavior, especially in error cases.

User Interface Design 13

 Outline
• What is a user interface?
• Usability motivations
• Usability factors
• Usability problems
• Basics of usability testing
• Usability measurements and requirements

User Interface Design 14

 Usability problems
• Anything about the application that hampers
a user in performing his task.
• Usability problems are a special kind of
software defect. The system works as
intended by the developer, yet the user finds
it hard to get useful work out of the system.

User Interface Design 15

Fig 1.3 Usability problems

Examples: Severity classes:

The system works as intended by the
programmer, but the user: 1 Missing functionality
2 Task failure
P1. Cannot figure out how to start the
search. 3 Annoying
Finally finds out to use F10.
4 Medium problem
(succeeds after long
P2. Believes he has completed the task,
time)
but forgot to push Update.
5 Minor problem
P3. Sees the discount code field, but (succeeds after short
cannot figure out which code to use. time)
Critical problem =
P4. Says it is crazy to use six screens to
Missing functionality,
fill in ten fields.
task failure, or annoying
P5. Wants to print a list of discount
codes, but the system cannot do it.
User Interface Design 16
 Severity classes
• Missing functionality – the system cannot
support the user’s task.
• Task failure – the user fails (knowingly or
unknowingly) to complete the task on his
own.
• Annoying – the user complains that the
system is cumbersome.
• Medium – the user succeeds after stumbling
around for a long time.
• Minor – the user succeeds after a few
attempts.
User Interface Design 17
 Outline
• What is a user interface?
• Usability motivations
• Usability factors
• Usability problems
• Basics of usability testing
• Usability measurements and requirements

User Interface Design 18

 Usability testing
• One variant
– Method: think-aloud test
– System under test:
• Real system – carry out various tasks
• Prototype – evaluate window contents and navigation
– Team
• Facilitator – talks with the user
• Log keeper – records the test session
• Observer – extra

User Interface Design 19

Fig 1.4 Usability test - think aloud
Purpose:
Find usability problems
I try this User doesn’t
because ... notice ...

Facilitator
Listens
Logkeeper
Asks as needed Listens
Records problems
User
Performs tasks
Thinks aloud

User Interface Design 20

(Fig 1.4 cont.)

Plan
Test-users:
Test-tasks:
Study system yourself

Carry out
Explain purpose:
- Find problems when using the system
- System’s fault - not yours
Give task - think aloud, please
Observe, listen, note down
Ask cautiously:
- what are you looking for?
- why . . . ?
Help users out when they are surely lost

Reporting
List the usability problems - within 12 hours

User Interface Design 21

 Planning the test
• Choose test users
– Typical users for the system.
– Don’t select other developers (unless it is an application to
be used by developers).
• Choose test tasks
– Real work situation – select some realistic scenarios for the
user to perform.
– Closed – preferably, a task should accomplish something
useful – a complete function of the application.
– Without hidden help – without hints on how to carry out the
task.
• If you are not familiar with the system, then you must
also study the system yourself.
User Interface Design 22
 Carry out the test
• Explain the purpose clearly to the user.
– It is the system that is being tested, not the user.
• Assign the task
– Remind user to think aloud by explaining what he
does and why
• Observe and record the user’s actions and
words.
• Offer help when user asks for it.
– As much as possible, leave user alone to struggle
with the task.

User Interface Design 23

 Reporting the results
• Condense the issues found into a list of
problems.
• This should be done as early as possible,
within 12 hours, while your memory is fresh.

User Interface Design 24

Fig 1.5 Heuristic evaluation
Purpose: Find usability problems
Usability specialist looks at system
using common sense
and/or guidelines
The specialist lists problems
(Consults with other experts)
Expert - reviewer

First law of usability:

Heuristic evaluation has only 50% hitrate

Predicted False problems

problems

Actual Missed problems

problems

User Interface Design 25

 Heuristic evaluation
• Engage a usability specialist as consultant.
• Potentially more convenient that arranging for
usability tests with real users.
• Usability expert has lots of experience with user
interfaces but often lacks the domain knowledge for
the application.
• May lead to a lot of false positives.
– Usability specialist may point out problems that don’t really
cause problems to real users.
– Fixing these may be a waste of developers’ time.
– Fixing these may actually make the system worse.
• May fail to uncover serious usability problems arising
from missing functionalities or complex scenarios.

User Interface Design 26

 User review
• Engage a domain expert as usability
consultant and walk him through the
scenarios.
• Domain expert can point out missing
functionalities and imagine complex tasks
that might be difficult to accomplish with your
user interface.
• However, experts often miss the trivial things
that trip the novice user.

User Interface Design 27

 Outline
• What is a user interface?
• Usability motivations
• Usability factors
• Usability problems
• Basics of usability testing
• Usability measurements and requirements

User Interface Design 28

 Usability measures
• Task time – time it takes the user to complete the
given task.
• Problem counts – number of usability problems
uncovered.
• Keystroke counts – how many keystrokes, mouse
clicks and other operations did the user employ in
order to complete the task?
• Opinion poll – user completes a questionnaire after
usability testing.
• Score for understanding – quiz the user about the
system’s behavior.
• Guidelline adherence – identify deviations from
interface standards and guidelines.
User Interface Design 29
Fig 1.6A Measuring usability - task time (performance)

ATM
Users: 20 bank customers, random selection. How to measure
Task 1: Withdraw $100 from ATM. No instructions.
Measure: How many succeed in 2 min?
What to measure
Task 2: Withdraw as much as possible ($174)
Measure: How many succeed in 5 min?
Reqs: Task 1: 18 succeed. Requirement - target
Task 2: 12 succeed.

Internal ordering system

Users: 5 secretaries in the company.
Have tried the internal ordering system.
Have not used it for a month. What to measure
Task 1: Order two boxes of letter paper + . . .
Risky!
Measure: Average time per user.
Reqs: Average time below 5 min.

Pros: Classic approach. Good when buying.

Cons: Not good for development.
Not possible early. Little feedback.
User Interface Design 30
Fig 1.6B Choosing the numbers

Why 20?
Cost versus reliability.
Users: 20 bank customers ...
During development:
One, later two, later ...
Measure: In 2 min?
Why 2 mins?
Best practice,
Reqs: Task 1: 18 succeed. ideal way ...
Task 2: 12 succeed. Why 18?
90% of customers
should succeed.
Task 2 harder.

Open target
Specify how, what,
Reqs: 18 out of 20 must and expectations.
succeed within ____ min. Wait and see what is
We expect around 2 min. possible.

User Interface Design 31

Fig 1.6C Measuring usability - Problem counts

Users: 3 potential users. Think-aloud test.

Record usability problems. How to measure
Task 1: Order two boxes of letter paper + . . .
Task 2: ...
Measure: Number of critical problems per user.
What to measure
Number of medium problems on list.
Reqs: Max one user encounters critical problems.
Requirement
Max 5 medium problems on the list.

Pros: Possible early - mockup sufficient.

Good feedback to developers.
Cons: Best for ease of learning.
Only indications for other factors.

User Interface Design 32

Fig 1.6D Measuring usability - Keystroke counts

Task 1: Withdraw a standard amount from ATM. How to

Task 2: ... measure
Measure: Number of keystrokes and mouse clicks.
Reqs: Max keystrokes 6 - incl. PIN code. What to measure
Total system response time max 8 s.
Requirement
Total task time
6 keystrokes @ 0.6 s 3.6 s
total system response time 8.0 s
Plus other
Total task time 11.6 s
user actions?

Pros: No users needed.

Possible early - mockup sufficient.
Cons: Not sure users find the fast way.
Only task efficiency.

User Interface Design 33

Fig 1.6E Measuring usability - Opinion poll

Ask 20 novice users to complete the questionnaire.

How to measure
Measure: Count number of entries per box.
Reqs: 80% find system easy to learn. What to measure
50% will recommend it to others.
Requirement
Questionnaire agree neutral disagree
The system was easy to learn
The system is easy to use
The system helps me . . .
It is fun to use
I will recommend it to others

Pros: Widely used.

You may ask for any usability factor.
Cons: Doesn’t match objective evidence.
Only indications during development.
Little feedback to developers.
User Interface Design 34
Fig 1.6F Measuring usability - Score for understanding

Ask 5 potential ATM users what these error

messages mean:
Amount too large How to measure
PIN code invalid . . .
Ask them also:
What would the system do if . . .
Measure: Assess answers on scale A-D. What to measure

Reqs: 80% of answers marked A or B. Requirement

Pros: Easy way to test understandability.

Best way to cover error messages.
Useful both early and late in development.
Cons: Only measures understandability..

User Interface Design 35

Fig 1.6G Measuring usability - Guideline adherence

Ask an expert to review the user interface and

How to measure
identify deviations from guideline X. (Or ask two
experts to come up with a joint list.)
Measure: Number of deviations per screen. What to measure

Reqs: At most one deviation per screen.

Requirement

Pros: Adherence helps users switch between systems.

Company-specific guidelines for internal systems
can help even more.
Cons: Cannot guarantee high usability.
Developers find guidelines hard to follow
- examples help best.

User Interface Design 36

Fig 1.6H Which usability measure?

Development, early
Ease of remember

Development, late
Understandability
Subjective satisf.

Buying a system
Ease of learning
Task efficiency
Fit for use
Task time
Highly useful
Problem counts
Keystroke counts
Some use
Opinion poll ? ?
Score for underst. Indications
only
Guidelines

User Interface Design 37