What is Usability?

• Usability is part of the broader term “user

experience” and refers to the ease of access
and/or use of a product or website.
• A design must conform with the context of the
user (what the user wants to do with it) and the
user’s environment) to determine its level of
usability.
• The official ISO 9241-11 definition of usability
is: “the extent to which a product can be used by
specified users to achieve specified goals with
effectiveness, efficiency and satisfaction in a
specified context of use.”

Saul Greenberg
According to Usability Expert Jakob
Nielsen:
• On the Web, usability is a necessary condition for
survival. If a web site is difficult to use, people
leave. If the homepage fails to clearly state what a
company offers and what users can do on the site,
people leave.
• If users get lost on a web site, they leave. If a web
site's information is hard to read or doesn't answer
users' key questions, they leave.
• There's no such thing as a user reading a web site
manual or otherwise spending much time trying to
figure out an interface.
• There are plenty of other web sites available;
leaving is the first line of defense when users
encounter a difficulty. Saul Greenberg
What is Usability?
A usable system is:
– easy to use
– easy to learn
– easy to remember how to use
– effective to use
– efficient to use
– safe to use
– enjoyable to use

3 Saul Greenberg
A usable interface has three main
outcomes:

It should be easy for the user to become familiar with

and competent in using the user interface during
the first contact with the website. For example, if a travel
agent’s website is a well-designed one, the user should be
able to move through the sequence of actions to book a
ticket quickly.
It should be easy for users to achieve their
objective through using the website. If a user has the goal
of booking a flight, a good design will guide him/her
through the easiest process to purchase that ticket.
It should be easy to recall the user interface and how to
use it on subsequent visits. So, a good design on the
travel agent’s site means the user should learn from the
first time and book a second ticket just as easily.

Saul Greenberg
Why is usability important?
A Good user-interface can help the
client:
1. Be satisfied, not frustrated, with the web
site or product;
2. Enjoy interacting with the web site or
product;
3. Achieve their goals effectively and
efficiently;
4. Cultivate confidence and trust in the
product or web site.
5 Saul Greenberg
Why ..(cont.)
A Bad user-interface can:

1. be annoying, embarrassing, frustrating,

and even deadly.
2. Increase mistakes in data entry and
system operation.
3. Makes functions become completely
inaccessible.
4. System failure because of user rejection.

6 Saul Greenberg
It is not Simple to Make Good
User Interfaces

Basic misconceptions:
• If the developer can use it, everyone can
use it

• If the non-technical staff can use it,

everyone can

• Good user interfaces are applied common

sense

• A system is usable if all style guidelines

are met
7 Saul Greenberg
Examples of good and bad
design

8 Saul Greenberg
Examples ..(cont.)

9 Saul Greenberg
Examples ..(cont.)

10 Saul Greenberg
Examples ..(cont.)

11 Saul Greenberg
Examples ..(cont.)

12 Saul Greenberg
Examples ..(cont.)

13 Saul Greenberg
Traditional approaches to
system development
Is concerned with producing software,
software specification, maintainability, and
testing

Generally considers the interface to be just

another software component.

14 Saul Greenberg
Example of traditional
approach
Requirements
specification

Analysis

Design

Implementation

The waterfall model Testing

Operation and
maintenance

15 Saul Greenberg
Introduction to User
Centered approach
This approach normally involves a number of key
activities throughout the development of the
software including:
• Involving users
• Obtaining their feedback on the design
• Providing prototypes for system evaluation and re-
design in light of user feedback and comments.

16 Saul Greenberg
User Centered approach
• Real users involved at each step of the
process

• Find out about the users before

requirement specification

• Design and implementation

• Review (usability test) with the users

17 Saul Greenberg
The life cycle for interactive
systems
cannot assume a linear
user needs Requirements
sequence of activities
specification
as in the waterfall model
Analysis

Design

lots of feedback! Implementation

Testing

Operation and
maintenance

18 Saul Greenberg
User Centered Development
1. Data Collection
2. Data Analysis
3. Prototyping
4. Design
5. Evaluation

19 Saul Greenberg
1. Data Collection
Data recording
– Using media
Interviews
– Stakeholder interviews
– Subject Matter Expert interviews
– User and customer interviews
Questionnaires
– Surveys, product reviews
Literature review
– Studying existing systems

20 Saul Greenberg
2. Data Analysis
Requirement analysis
– Formal specifications of the system
User analysis
– Identifying and understanding the user
Task analysis
– Steps user take to accomplish this task
Functional analysis
– Functions that system perform to help the users carry out their
task

21 Saul Greenberg
3. Prototyping
Advantages of Prototyping:
Users are actively involved in the
development
It provides a better system to users
The users get a better understanding of the
system being developed.
Errors can be detected much earlier
Quicker user feedback is available leading to
better solutions 22 Saul Greenberg
4. Design
Goals
– Achieving goals
Users and systems
– Understanding the raw materials: computer and human
Limitations
– Accepting limitations of humans and of design

23 Saul Greenberg
5. Evaluation
Testing the usability, functionality and acceptability
of an interactive system
Expert evaluation
– Evaluation by Subject Matter Experts
User evaluation
– Evaluation by user or customer

24 Saul Greenberg
Designer vs. Users
Making a photocopy

Why this photocopier does not work? What do you

think!

25 Saul Greenberg
Designer vs. Users

Designer meant by ‘C’ = Clear People

thought that ‘C’ = Copy
26 Saul Greenberg
Examples ..(cont.)

27 Saul Greenberg
Examples ..(cont.)

28 Saul Greenberg
Examples ..(cont.)

29 Saul Greenberg
Examples ..(cont.)

30 Saul Greenberg
Examples ..(cont.)

31 Saul Greenberg
Examples ..(cont.)

32 Saul Greenberg
Examples ..(cont.)

33 Saul Greenberg
Examples ..(cont.)

34 Saul Greenberg
Examples ..(cont.)

35 Saul Greenberg
Examples ..(cont.)

36 Saul Greenberg
Usability Heuristics
Who is Jakob Nielsen
•Jakob Nielsen has been called:
•"the king of usability" (Internet Magazine)
•"the guru of Web page usability" (The New York
Times)
•"the next best thing to a true time machine" (USA
Today)
•"the smartest person on the Web" (ZDNet
AnchorDesk)
•"the world's leading expert on Web usability" (U.S.
News & World Report)
•one of the top 10 minds in small business
(FORTUNE Small Business)
•"the world's leading expert on user-friendly
design" (Stuttgarter Zeitung, Germany)

Saul Greenberg
Who is Jakob Nielsen cont’d

•"knows more about what makes Web sites work

than anyone else on the planet" (Chicago Tribune,
March 6, 2000)
•"one of the world's foremost experts in Web
usability" (Business Week)
•"the Web's usability czar" (WebReference.com)
•"the reigning guru of Web usability" (FORTUNE)
•"eminent Web usability guru" (CNN)
•"perhaps the best-known design and usability guru
on the Internet" (Financial Times)
•"the usability Pope" (Wirtschaftswoche Magazine,
Germany)
•"new-media pioneer" (Newsweek)

Saul Greenberg
Who is Jakob Nielsen cont’d

•(born 1957 in Copenhagen,

Denmark) is a leading web
usability consultant. He holds
a Ph.D. in human-computer
interaction from the Technical
University of Denmark in
Copenhagen.
•is a User Advocate and
principal of the Nielsen
Norman Group which he co-
founded with Dr. Donald A.
Norman (former VP of
research at Apple Computer).
Saul Greenberg
Who is Jakob Nielsen cont’d

•Before starting NNG in 1998 he was a Sun

Microsystems Distinguished Engineer.

•Dr. Nielsen founded the "discount usability

engineering" movement for fast and cheap
improvements of user interfaces and has
invented several usability methods,
including heuristic evaluation.

•He holds 79 United States patents, mainly

on ways of making the Internet easier to
use.

Saul Greenberg
Why heuristics?

Heuristic - A rule of thumb, simplification, or

educated guess that reduces or limits the search for
solutions in domains that are difficult and poorly
understood.

General principles for user interface design

– They are more in the nature of rule of thumb
• than specific usability guidelines

Saul Greenberg
 Ten Golden Usability Rules

A great set of guidelines created by Jakob Nielsen in

his book Usability Engineering.

Saul Greenberg
 1 Simple and natural dialogue

– use the user’s conceptual model

– match the users’ task sequence
– minimize mapping between interface and task semantics

From Microsoft applications Saul Greenberg

1 Simple and natural dialogue

Present exactly the information the user needs

– less is more
• less to learn, to get wrong, to distract...

– information should appear in natural order

• related information is graphically clustered
• order of accessing information matches user’s expectations

– remove or hide irrelevant or rarely needed information

• competes with important information on screen

– remove modes

– use windows frugally

• don’t add unneeded navigation and window management

Saul Greenberg
Simple and natural dialogue

•Interfaces should be
simplified
•Should match the
users’ task
•Present exactly the
information that the
user needs, at the
exact time and place
•Good graphic design
and color
•Less is more

Saul Greenberg
2 Speak the users’ language
My program gave me the That’s
message Rstrd Info. restricted But surely you can No, no… Rsdrd Info
What does it mean? information tell me!!! stands for “Restricted
Information”

Hmm… but what It means the program Ok, I’ll take a

does it mean??? is too busy to let you coffee
log on

Saul Greenberg
2 Speak the users’ language

Terminology based on users’ language for task

– e.g. withdrawing money from a bank machine

Use meaningful mnemonics, icons & abbreviations

– eg File / Save
• Ctrl + S (abbreviation)
• Alt FS (mnemonic for menu action)
• (tooltip icon)

Saul Greenberg
Speak the users’ language

•Terminology
•Native language
•Choice of words
•Vocabulary
•Good mapping
between the interface
design and the user’s
conceptual model
•Use of interface
metaphors

Saul Greenberg
 3 Minimize user’s memory load

Computers good at remembering, people are not!

Promote recognition over recall
– menus, icons, choice dialog boxes vs commands, field formats
– relies on visibility of objects to the user (but less is more!)

From Microsoft applications Saul Greenberg

Minimize user memory load

•Recognition, rather •Use of generic

than recall commands
•Display elements
and allow the user
to choose

Saul Greenberg
3: Minimize user’s memory load

Gives input format, example and default

Saul Greenberg
Minimize user memory load

Describe the Give range of legal

required format input

Saul Greenberg
3: Minimize user’s memory load

Saul Greenberg
4: Be consistent

Consistent syntax of input

Consist language and graphics

– same visual appearance across the system (e.g. widgets)
– same information/controls in same location on all windows
Ok Cancel Cancel Ok Ok Accept Dismiss

Cancel

Consist effects
– commands, actions have same effect in equivalent situations
• predictability

Saul Greenberg
4. Be Consistent

These are labels with a

raised appearance.

Is it any surprise that

people try and click on
them?

Saul Greenberg
From Peachpit website
From Peachpit website
Consistency

•Facilitate
recognition
•Decide among
possibly many
conventions
•Once the decision
is made, stick to it

Saul Greenberg
5: Provide feedback

Continuously inform the user about

– what it is doing
– how it is interpreting the user’s input
– user should always be aware of what is going on

What’s it > Doit

Time for
> Doit coffee.
doing? This will take
5 minutes...

Saul Greenberg
 5. Provide feedback

What mode
am I in now?

What did I
select? How is the
system
interpreting
my actions?

Microsoft Paint Saul Greenberg

5. Provide feedback

Be as specific as possible, based on user’s input

Best within the context of the action

Saul Greenberg
Provide feedback

Multiple files being copied,

but feedback is file by file.

Drawing Board LT

Saul Greenberg
Feedback

Inform the user Response time

about that the – 0.1 second - considered
instantaneous
system is doing and – 1 second - limit for the
how it is interpreting user’s flow of thought to
the input stay uninterrupted
– 10 seconds - limit for
Restate user input to keeping the user’s
indicate what is attention focused on the
dialogue box
being done with it
“Percent done” indicator
– overkill for small tasks - 2
to 10 seconds

Saul Greenberg
5. Provide feedback

Dealing with long delays

– Cursors
• for short transactions

– Percent done dialogs

– time left
– estimated time

– Random
• for unknown times Contacting host (10-60 seconds)

cancel

Saul Greenberg
Feedback

Saul Greenberg
Feedback

Saul Greenberg
6. Provide clearly marked exits

How do
I get
out of
this?

Saul Greenberg
Clearly marked exits

Cancel button
Escape
Undo
Acknowledge that
users will commit
errors
Make it easy to
recover from the
errors
Saul Greenberg
6. Provide clearly marked exits

Users don’t like to feel trapped by the computer!

– should offer an easy way out of as many situations as possible

Strategies:
– Cancel button (for dialogs waiting for user input)
– Universal Undo (can get back to previous state)
– Interrupt (especially for lengthy operations)
– Quit (for leaving the program at any time)
– Defaults (for restoring a property sheet) Core
Dump

Saul Greenberg
7. Provide shortcuts

Experienced users - perform frequent operations quickly

Strategies:
– keyboard and mouse accelerators
• abbreviations
• command completion
• context menus
• function keys
• double clicking vs menu selection

– type-ahead (entering input before the system is ready for it)

– navigation jumps
• e.g., going to window/location directly, and avoiding intermediate nodes

– history systems
• WWW: ~60% of pages are revisits

Saul Greenberg
Shortcuts

Shortcut keys
“Accelerators”
For commonly-used functions

Saul Greenberg
 Keyboard
accelerators for
menus

Customizable
toolbars and
palettes for
frequent actions

Split menu, with

recently used
fonts on top

Double-click
raises toolbar
dialog box

Double-click
raises object-
specific menu
Scrolling controls
for page-sized
increments
Microsoft Powerpoint
 Alternate
representation for
quickly doing
different set of
tasks

Toolset brought in
appropriate to this
representation

Microsoft Powerpoint
8: Deal with errors in a positive manner

People will make errors!

Errors we make
– Mistakes
• conscious deliberations lead to an error instead of correct solution

– Slips
• unconscious behaviour gets misdirected en route to satisfying goal
– e.g. drive to store, end up in the office

• shows up frequently in skilled behaviour

– usually due to inattention

• often arises from similar actions

Saul Greenberg
Designing for slips

General rules
– prevent slips before they occur
– detect and correct slips when they do occur
– user correction through feedback and undo

Saul Greenberg
8: Deal with errors in a positive manner

What is “error 15762”?

Saul Greenberg
8: Deal with errors in a positive manner

A problematic message to a nuclear power plant operator Saul Greenberg

 8: Deal with errors in a positive manner

Adobe's ImageReady

AutoCAD Mechanical

Windows Notepad
Microsoft's NT Operating System

Saul Greenberg
8: Deal with errors in a positive manner

Provide meaningful error messages

– error messages should be in the user’s task language
– don’t make people feel stupid

Try again, bonehead!

Error 25

Cannot open this document

Cannot open “chapter 5” because the application “Microsoft Word”

is not on your system

Cannot open “chapter 5” because the application “Microsoft Word”

is not on your system. Open it with “Teachtext” instead?

Saul Greenberg
Good error messages

•Clear language
•Precise
•Should help solve
the problem
•Should be polite

Saul Greenberg
Prevent errors

Give users options instead of asking them to

remember
•Avoid modes

Saul Greenberg
8: Deal with errors in a positive manner

Prevent errors
– try to make errors impossible
– modern widgets: can only enter legal data

Provide reasonableness checks on input data

– on entering order for office supplies
• 5000 pencils is an unusually large order. Do you really want to order
that many?

Saul Greenberg
Manuals...
9. Provide help

Help is not a replacement for bad design!

Simple systems:
– walk up and use; minimal instructions

Most other systems

– feature rich
– simple things should be simple
– learning path for advanced features Volume 37:
A user's
guide to...

Saul Greenberg
10. Help and documentation

Users do not read manuals.

If they do, they are in some kind of panic.
Model of documentation use
– Searching
– Understanding
– Applying
The minimalist manual
– http://www.ug.cs.usyd.edu.au/~cs1/unix/minimalistmanual/

Saul Greenberg
Documentation and how it is used

Many users do not read manuals

– prefer to spend their time pursuing their task

Usually used when users are in some kind of panic

– paper manuals unavailable in many businesses!
• e.g. single copy locked away in system administrator’s office
– online documentation better
– good search/lookup tools
– online help specific to current context

Sometimes used for quick reference

– syntax of actions, possibilities...
– list of shortcuts ...

Saul Greenberg
Types of help

Tutorial and/or getting started manuals

– short guides that people are likely to read when first obtaining
their systems
• encourages exploration and getting to know the system
• tries to get conceptual material across and essential syntax

– on-line “tours”, exercises, and demos

• demonstrates very basic principles through working examples

Saul Greenberg
 Types of help

Reference manuals
– used mostly for detailed lookup by experts
• rarely introduces concepts
• thematically arranged
– on-line hypertext
• search / find
• table of contents
• index
• cross-index

Microsoft Help Saul Greenberg

 Types of help

Reminders
– short reference cards
• expert user who just wants to check facts
• novice who wants to get overview of system’s capabilities

– keyboard templates
• shortcuts/syntactic meanings of keys; recognition vs. recall;
capabilities

– tooltips and other context-sensitive help

• text over graphical items indicates their meaning or purpose

Microsoft Word Saul Greenberg

 Types of help

Wizards
– walks user through typical tasks
– but dangerous if user gets stuck

What’s my
computer’s
name?
Fred?
Intel?
AST?

Microsoft Powerpoint Saul Greenberg

 Types of help

Tips
– migration path to learning system features
– also context-specific tips on being more efficient
– must be “smart”, otherwise boring and tedious

Microsoft Word Saul Greenberg

You know now

Nine principles of design

– Simple and natural dialog
– Speak the user’s language
– Minimize user’s memory load
– Be consistent
– Provide feedback
– Provide clearly marked exits
– Provide shortcuts
– Deal with errors in a positive manner
– Provide help

Heuristic evaluation
– Principles can be used to systematically inspect the interface for
usability problems

Saul Greenberg
Problems found by a single inspector

Average over six case studies

– 35% of all usability problems;
– 42% of the major problems
– 32% of the minor problems

Not great, but

– finding some problems with one evaluator is
much better than finding no problems with
no evaluators!

Saul Greenberg
Heuristic evaluation

•Looking at an •An individual judge

interface and can only find 35% of
formulating an usability problems
opinion about it •Better to have a
•Normally following panel in order to
guidelines aggregate the
•Systematic findings
inspection by a small •Three to five
set of judges members

Saul Greenberg
Heuristic evaluation, con’t.

•Each individual •Presence of an

inspects the interface observer
•Evaluators – can assist the
communicate only evaluator with
module
after they have
– can record findings
completed their
– can answer questions
evaluation

Saul Greenberg
Heuristic evaluation, con’t

One to two hours Output

Evaluators inspect – list of usability
the various elements problems
– references to
Evaluators are not usability principles
users; they just violated
inspect the interface – design advice
Preferable to have
expertise

Saul Greenberg
Problems found by a single inspector

Varies according to
– difficulty of the interface being evaluated
– the expertise of the inspectors

Average problems found by:

– novice evaluators - 22%
• no usability expertise
– regular specialists - 41%
• expertise in usability
– double specialists - 60%
• experience in both usability and the particular
kind of interface being evaluated
• also find domain-related problems

Tradeoff
– novices poorer, but cheaper!

Saul Greenberg
Problems found by a single inspector

Evaluators miss both easy and hard problems

– ‘best’ evaluators can miss easy problems
– ‘worse’ evaluators can discover hard problems

Saul Greenberg
Problems found by multiple evaluators

3-5 evaluators find 66-75% of usability problems

– different people find different usability problems
– only modest overlap between the sets of problems found

Saul Greenberg
Individuals vs teams

Nielsen
– recommends individual evaluators inspect the interface alone

Why?
– evaluation is not influenced by others
– independent and unbiased
– greater variability in the kinds of errors found
– no overhead required to organize group meetings

Saul Greenberg
Self Guided vs Scenario Exploration

Self-guided
– open-ended exploration
– Not necessarily task-directed
– good for exploring diverse aspects of the interface, and to follow
potential pitfalls

Scenarios
– step through the interface using representative end user tasks
– ensures problems identified in relevant portions of the interface
– ensures that specific features of interest are evaluated
– but limits the scope of the evaluation - problems can be missed

Saul Greenberg
Usability Testing

To identify problems
Typical users perform typical tasks
Collect data
Objective: Task times, error rates
Subjective: Ratings, Comments, Observations
Analyze data to identify usability
problems

Saul Greenberg
Testing Your Application

Usability testing is ESSENTIAL to the

development process
First, navigate the application or website
yourself:
if you’re a developer, it will help you to identify
problem areas and institute changes/corrections
if you’re doing the testing, it will provide you
with guidance about the kinds of problems users
are likely to encounter

Saul Greenberg
Saul Greenberg
Preparation

Determine who and what to evaluate

What questions do you want to answer?
Be sure team members know their
roles
Involve a qualified person to analyze
results
Test the protocol

Saul Greenberg
General Test Protocol

Introduction
Informed consent form
Training
Tasks
Questionnaire
Debriefing/Payment

Saul Greenberg
Think-aloud Approach

Users should navigate throughout the

website and say aloud what they are
thinking and doing as they do so
Users should understand they can make
both negative and positive comments
Record all user comments
Develop an interview protocol to guide your
discussion with users
probe on issues of concern

Saul Greenberg
Step 1: Plan the Tests

Determine how many users will participate

in the test
Estimate how many tests will be required
over the development cycle
Determine usability objectives and what
functions will be tested
Develop evaluation measures (timing data,
error counts, rating scales, etc.)

Saul Greenberg
Step 2: Conduct the Tests

Provide introduction/overview for users

(reinforce the fact that the application or
website is being tested; the users are
NOT the subjects of the test)
Provide training for users
Have observers watch, listen, and take
notes

Saul Greenberg
Watch Users Work!!

Sometimes users will say they are likely to do

something, but their actual behavior indicates
otherwise.
Better to learn from observing direct user
behavior.
Watch them as they attempt to use your
application or website.
DTM (Duct-Tape Method)

Saul Greenberg
Step 3: Debrief the Users

Collect observation/evaluation data

from users
Have users complete evaluation forms
Allow users to express their reactions
about the test

Saul Greenberg
Post-Test Work

Analyze data
Identify usability problems AND
SOLUTIONS
Identify problem severity
Identify software bugs (maybe)
Conduct second round of testing (if
necessary) and if time/resources permit

Saul Greenberg
Caveats

User preferences do not always

correspond to performance.
What users say is not always what
they do.
Consider all user groups.
Just conducting the test is not
enough—incorporate the findings.
Saul Greenberg
Exercise – Part 4
Evaluate your GUI for your web-site (consider the
usability principles and testing techniques).
Plan tests for at least the four scenarios that you
have previously created.
Get at least three users (people who are NOT in
this class) to walk through and evaluate your
design.
Perform your measurements, interviews,
observations, etc.

Saul Greenberg
Exercise – Part 5

Summarize what you have learned in terms

of usability principles.
Redesign your original web-site concept.
But now do it explicitly considering the
design heuristics!
State how your design has changed as a
result of the testing.

Saul Greenberg
Exercise – Part 6

Summarize your evaluation experience:

in a report and in a presentation
Your report/presentation must detail:
what you planned and why
what you did: use cases, procedures, + measures
your findings: what did you learn and what have
you changed as a result?

Saul Greenberg
Preparing a Summary Report
Describe your objectives, measures, and
procedures
Describe your results:
list key problems identified by users; there is likely
to be some uniformity among responses (e.g.,
common concerns, problems, issues)
sort problems by priority and frequency
Develop and implement solutions

Saul Greenberg