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" ([Link])
•"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
– [Link]
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