Evaluation 1 - University of Victoria · Evaluation 1 Introduction & Usability Inspection ....
Transcript of Evaluation 1 - University of Victoria · Evaluation 1 Introduction & Usability Inspection ....
Evaluation 1
Introduction & Usability Inspection
Objectives
By the end of class you will be able to… • Describe different usability inspection
techniques and discuss the advantages and disadvantages of usability inspection methods.
• Conduct a heuristic evaluation and cognitive walkthrough of a user interface.
Course Overview
What might you hope to learn from a usability evaluation?
• Is the interface… – Effective? – Engaging? – Efficient? – Easy to learn? – Equally usable by different groups?
• What problems do users have? • Suggestions to improve the interface • …
The 5 E’s of usability
How could you evaluate an interface?
• With users – User testing (after Reading Break)
• Without users – Usability inspection (today!)
• Cognitive walkthrough • Heuristic evaluation
– User modeling (Later)
Usability inspection
• A ‘discount’ method of usability evaluation where an interface is evaluated by usability experts rather than end users.
• Usually several evaluators work independently, then debrief together later.
Heuristic evaluation
• A type of usability inspection • HCI experts (sometimes also domain
experts) review an interface design with respect to a set of predefined heuristics
• Developed by Jacob Nielsen
Nielsen’s heuristics • Visibility of system status • Match between system and real world (Speak the user’s
language) • User control and freedom (Clearly marked exits) • Consistency and standards • Help users recognize, diagnose, recover from errors • Error prevention • Recognition rather than recall • Flexibility and efficiency of use • Aesthetic and minimalist design • Help and documentation
1. Visibility of system status
• The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.
Upload button is enabled, until clicked. Then it is replaced with a progress indicator until the upload has finished
This and later examples from http://designingwebinterfaces.com/6-tips-for-a-great-flex-ux-part-5 More examples available there.
BaseCamp by 37signals
2. Match between system and real world
• Speak the users’ language, with words, phrases and concepts familiar to the user. Follow real-world conventions, and natural / logical order.
Uses terms and metaphors familiar to the user.
iTunes
3. User control & freedom
• Users often choose system functions by mistake and will need a clearly marked and quick “emergency exit”. Support undo and redo, a clear way to navigate.
Clear how to navigate functions, search can be easily activated and canceled.
CollabFinder
4. Consistency & Standards • Users should not have to wonder
whether different words, situations, or actions mean the same thing. Follow platform conventions.
MS Word, Excel, and PowerPoint all use the same style toolbar with the same primary menu options
BUT: different on Mac vs. Windows Microsoft Office
5. Error Prevention • Even better than good error messages
is a careful design, which prevents a problem from occurring in the first place.
Google: auto recommend reduces spelling errors
Primary action is more visually prominent
6. Recognition rather than recall
• Minimize the user’s memory load. Make objects, actions, options, and instructions visible.
Preview of fonts, not just font name
Auto complete for coding in an IDE – no need to remember exact names
7. Flexibility & Efficiency of Use • Accelerators — unseen by the novice —
may speed up interaction for the expert. Allow users to tailor frequent actions.
Accelerator keys
Apple Numbers: Previews common function results on the left when a column is selected -- efficient
8. Aesthetic and minimalist design
• Dialogues should not contain information that is irrelevant or rarely needed. Visual layout principles: contrast, repetition, alignment, and proximity.
Search menu exemplifies the four principles of visual design
Kon
tain
9. Help users recognize, diagnose, and recover from errors
• Error messages should be expressed in plain language, precisely indicate the problem, and suggest a solution.
Digg
Provides immediate feedback with specific instructions
10. Help and documentation • Even though it is better if the system
can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.
Help tips are displayed on hover, answering the most likely questions about a field or instructions Ze
noss
Heuristic Evaluation: Output • List of usability problems, with references to
the usability principles that were violated • Does not (necessarily) provide a solution
– But problems are often easy to correct based on the guidelines
Heuristic Evaluation Activity
• Evaluation of Fugu
How many inspectors?
Jakob Nielsen - www.useit.com
Evaluation of a banking system:
How many inspectors?
Jakob Nielsen - www.useit.com
35%
75%
What is a cognitive walkthough (CW)?
• A type of usability inspection where experts ‘walk’ through an interface following a specified set of tasks.
• Step through the task. At each step, ask yourself four questions.
CW Questions
1. Will users be trying to produce whatever effect the action has?
2. Will users see the control (button, menu, switch, etc.) for the action?
3. Once users find the control, will they recognize that it produces the effect they want?
4. After the action, will users understand the feedback they get so they can go on to the next action with confidence?
CW Example - Rapid Transit Ticket Machine
• User wishes to purchase a round-trip ticket to Dragon Plaza.
• The ticket costs $17.50 but the user doesn’t know this yet.
• The user has only $10, but doesn’t know this yet either.
This example taken from http://asi-www.informatik.uni-hamburg.de/informatik/SE_Evaluation/html/pages/walk.htm
• User can do steps 1 and 2 in any order • Or user can enter desired fare using keypad
Step 1: Enter Destination or Journey Type
• Design Flaw no. 1: Option to indicate journey type first is not made sufficiently evident.
• Solution:
Step 2: Enter Journey Type
Step 3: Deposit money
• Design Flaw no. 2: No display of total money received.
• Solution:
Step 4: Retrieve $10 from machine since it wasn’t enough
• Design Flaw no. 3: No means of retrieving money deposited.
• Solution:
Cognitive Walkthrough Activity
Press Start
What are the advantages & disadvantages of usability
inspection?
Key points
Usability inspection… • Is quick and inexpensive • May miss important problems or identify
false ones • Complements (but does not replace)
testing with users