EHCI07 Heuristic
EHCI07 Heuristic
Evaluation Using
Heuristic Analysis
Brad Myers
1
Note:
Turn in Homework 3 today
Start on Homework 4
Individual
Assignments of people to groups
2
Usability Evaluation Methods
How to tell if your interface is any good
Following the design methods important but not
sufficient
Still need to evaluate and test
Also called “Usability Inspection Methods”
Ref: Jacob Nielsen and Robert Mack, eds. Usability Inspection
Methods. 1994: John Wiley & Sons.
3
Various techniques available
Heuristic Evaluation Method
Usability Testing
Cognitive Walkthrough
Analytic methods
Keystroke model, GOMS model
Questionnaires, Interviews, Focus Groups, Logging,
Feedback
4
Heuristic Evaluation Method
5
10 Basic Principles
From Nielsen’s web page
1. Visibility of system status
2. Match between system and the real world
3. User control and freedom
4. Consistency and standards
5. Error prevention
6. Recognition rather than recall
7. Flexibility and efficiency of use
8. Aesthetic and minimalist design
9. Help users recognize, diagnose, and recover from errors
10. Help and Documentation
6
70 More Guidelines
1) Things that look different should act different.
2) If it is not needed, it's not needed.
3) The information for the decision needs to be there when the decision is needed.
4) The user should control the system. The system shouldn't control the user. The user is
the boss, and the system should show it.
5) The idea is to empower the user, not speed up the system.
6) Don't overload the user's buffers.
7) Keep it simple.
8) Things that look the same should act the same.
9) The user should be able to do what the user wants to do.
10) Every action should have a reaction.
11) Everything in its place, and a place for everything.
12) Let people shape the system to themselves, and paint it with their own personality
13) Error messages should actually mean something to the user, and tell the user how to
fix the problem.
14) The best journey is the one with the fewest steps. Shorten the distance between the
user and their goal.
15) Everyone makes mistakes, so every mistake should be fixable.
16) The more you do something, the easier it should be to do.
7
70 More Guidelines, cont.
17) Cute is not a good adjective for systems.
18) Keep it neat. Keep it organized.
19) Consistency, consistency, consistency.
20) The user should always know what is happening.
21) Minimize the need for a mighty memory.
22) Know they user, and YOU are not thy user.
23) If I made an error, at least let me finish my thought before I have to fix it.
24) Design for regular people and the real world.
25) Eliminate unnecessary decisions, and illuminate the rest.
26) You should always know how to find out what to do next.
27) If I made an error, let me know about it before I get into REAL trouble.
28) Even experts are novices at some point. Provide help.
29) Provide a way to bail out and start over.
30) Don't let people accidentally shoot themselves.
31) Color is information.
32) The user should be in a good mood when done.
33) The fault is not in thyself, but in thy system.
34) To know the system is to love it.
35) Deliver a model and stick to it.
8
70 More Guidelines, cont.
36) Follow platform conventions.
37) Make it hard for people to make errors.
38) The system status (i.e., what's going on should always be visible.
39) Accommodate individual differences among users through automatic adaptation or user
tailoring of the interface.
40) Make it easy for a beginner to become an expert.
41) No you can't just explain it in the manual.
42) Provide user documentation that is easy to search, focused on the user's task, lists
concrete steps to be carried out, and is not too large.
43) The system should speak the users' language, following real-world conventions.
44) Instructions for use of a system should be visible or easily retrievable.
45) What does marketing want? Ok, now how do we show them they're wrong?
46) What does management think it wants? Ok, now how do we show them they're
wrong?
47) Allow users to tailor frequent actions.
48) Users don't know what they want, and users can't always say what they know.
49) Roll the videotape.
50) Common sense is an uncommon commodity
51) Make objects, actions, and options visible.
9
52)
70 More Guidelines, cont.
Data drives good design.
53) Help users develop a conceptual representation of the structure of the system.
54) Minimize the amount of information a user must maintain in short-term memory.
55) It's a jungle. Be careful out there.
56) People should not have to remember information across a dialogue.
57) Make it impossible to make errors that will get the user into REAL trouble.
58) Dialogues should not contain information that is irrelevant or rarely needed.
59) Testing, testing, testing.
60) Keep the user mental workload within acceptable limits.
61) Minimize the amount of information recoding that is necessary.
62) Minimize the difference in dialogue both within and across interfaces.
63) An ounce of good design is worth a pound of technical support.
64) Provide the user with feedback and error-correction capabilities.
65) So how is this better than what the competition is doing?
66) Provide good error messages that are expressed in plain language, precisely indicate the
problem, and constructively suggest a solution.
67) Whadya mean, they're not all computer scientists?
68) Support undo and redo.
69) Different words, situations, or actions should result in different things happening.
70) The best user interface is one the user doesn't notice.
10
1. Visibility of system status
Keep users informed about what is going on
What page they are on and what part of a process
Provide appropriate feedback
About what system is doing, and how input is being
interpreted
"articulatory" and "semantic"
Response time:
0.1 sec for articulatory
up to about 4 sec for an operation
Percent-done progress bars
E.g. in XXX product,
"really ungroup?" -- loses associated behavior
11
2. Match between system and the
real world
Terminology in user’s language
Not computer terminology
Language from user’s perspective
“You have bought…” not “We have sold you…”
Use common words, not "techno-jargon"
Error messages and feedback refer to user
objects
Allow full-length names
E.g. "Hit any key to continue" 12
3. User control and freedom
Easy to abort: Cancel buttons
Cancel order, cancel changing a profile
Easy to Undo
Web issue: what does “Back” button do?
Example: travel.yahoo.com gets confused if use back
Users (even experts) will make errors
E.g. in XXX product,
no way to get out of editing a text field
13
4. Consistency and standards
Same command always have the same effect
Locations for information, names of commands
Size, location, color (also Amazon), wording, function,
sequencing, etc.
Example of violations
Give the user a mental model of the system
Following standards helps
Web: use templates or CSS, style guides, CMU
Seems easy, but often not followed; e.g. in XXX
naming "F#1.C#1" vs. "F#1", "C#1"
consistent with industry standards: e.g., Copy
prefix vs. postfix: "delete" vs. "moving object“
14
5. Error prevention
Selection rather than entry
Travel.yahoo: popups, when ambig. city (e.g.
Columbus)
Remove or gray-out illegal choices
Not common for web pages
Confirmation
Avoid modes
Definition: same user action has different results
Make unavoidable modes visible
E.g. in XXX product, fillet uses invisible mode
E.g. Typing "daytime" to a mail program
15
6. Recognition rather than recall
Make objects, actions, options visible
See and pick it, not generate it
Short-term memory= 7 ± 2 items; 30 sec to 2 min
unless interrupted
Menus rather than type-in (but short enough)
Prompts provide format and limits: travel.yahoo example
Don't require retyping of remembered information
Pervasive, generic rules (cut/paste)
E.g. in Aegis, remembering altitude
16
Example:
prompts
What is a DTIC
user code and
how to get one?
17
7. Flexibility and efficiency of use
Provide Shortcuts
For experienced users
Command keys, macros, styles
Jump directly to desired location
Reuse previously entered information
Usually stored in “cookies”
But make easy to remove if wrong or changes
Good default values
18
8. Aesthetic and minimalist design
Good Graphic Design and Color Choice
Appropriately direct attention
Group related objects (alignment, decorations)
Balance and white space
Maintain display inertia
Few fonts and colors (5 to 7 colors)
Appropriate contrast
19
Graphic Design Example
www.hotbot.com
Many fonts and poor colors
Too many drop-down buttons
Not apparent that drop-downs modify search
due to poor layout
20
Minimalist design
“Less is More”
Identify what is really needed
If complex to explain/document, then redesign
Concise language
Avoid extraneous pictures and information
Fewer options and menu choices
Reduces planning time
Minimize distractions
Extra options can confuse users
Reduces manual size, etc.
E.g. in XXX product: "Show Cartouche", "swap"
21
9. Help users recognize, diagnose,
and recover from errors
Help users when they are in trouble
Opportunities for users to learn about the system
Clear language; no codes
Be precise; Not "syntax error"
Constructively help the user solve the problem
Tell why the error happened and how to fix it
Be polite and not accusing; positive wording:
Not: "FATAL ERROR", etc.
22
Error Messages, cont.
Blame the system, not the user
“Unrecognized” vs. “illegal” command
No humor or snide comments
Easy error recovery
Can have multiple levels of messages
E.g. in XXX product, “can't save file” — why
not?
E.g. in Stargate: “data incorrect or in an
incorrect format. Try again”
23
Stargate bad error message
24
Pretty Good Example
Pretty Good: travel.yahoo.com: Says what to do to fix it
But language is inconsistent
25
Bad Example
http://stinet.dtic.mil/
26
Another Bad Example
www.acm.org
27
10. Help and Documentation
True walk up and use?
Most people will not read documentation
If do, then
First time product is used, or else
In a panic, so need information right away
Iterative design of documentation needed
also
SuperBook application answer found in 4.3
minutes, compared to 7.6 minutes before fixing
28
Help, cont.
Help system is an extra feature to learn
“Help doesn’t”
If need to add help, maybe fix the feature?
Use documentation writers to help refine the
system
Good quality writing
Examples:
“what’s the difference” in travel.yahoo
29
Good Help Example
NSF
report
system
What
& Why
30
How to do Heuristic Evaluation
Systematic inspection of system
Multiple evaluators are better
Trained evaluators are better
22% vs. 41% vs. 60% of errors found
Result: list of problems, guidelines violated,
and proposed fixes
31