COSC2628 User
Centred Design
Week 3: Usability and Design Principles, Heuristic Evaluation
Copyright By Assignmentchef assignmentchef
RMIT University acknowledges the people of
the Woi wurrung and Boon wurrung
language groups of the eastern Kulin Nation on whose unceded lands we conduct the business of the University.
RMIT University respectfully acknowledges their Ancestors and Elders, past and present. RMIT also acknowledges the Traditional Custodians
and their Ancestors of the lands and waters across Australia where we conduct our business.
Ngarara Place
User interface hall of shame: Whats wrong with this picture?
5 minute breakout groups
User interface hall of fame: Whats right with this picture?
5 minute breakout groups
Learning objectives
Understand Nielsens principles
Learn the basics of heuristic analysis
Understand some design principles based on Nielsen
User Centered Design:
https://www.youtube.com/watch?v= 90yW0vQpKVs
Part 1: Nielsens Principles
Who is Nielsen?
Developed the most used heuristics for interface design in 1990 with.
main heuristics released in 1994.
Has a consulting group for usability: http://www.nngroup.com/articles/te n-usability-heuristics/
Why heuristics?
These are not specific rules
More like rule of thumb
Not mutually exclusive
Usability issues cant be pigeonholed
Nielsens 10 principles
Visibility of system status
Match between system and the real world
Error prevention
Recognition rather than recall
User control and freedom
Flexibility and efficiency of use
Consistency and standards
Aesthetic and minimalist design
Help users recognize, diagnose and recover from errors
Help and documentation
1 Visibility of system status
User should always be informed of what is happening behind the scenes, when appropriate.
For example, when uploading a file there should be a progress bar.
In general always tell the user what is happening if they have no control.
Keyword here is when appropriate and necessary. No need to bombard your users with your servers CPU cycles.
1 Visibility of system status
RMIT University2020 CS&IT
2 Match between real world and system
The system should speak users language
Use familiar metaphors, e.g. envelope for email
If a niche product make sure to use words that your market recognises
Use logical and instinctive phrases and graphics.
2 Match between real world and system
Which is better? Why? (5 minutes)
3 User control and freedom
Escape hatches for users are important.
Allow users to exit state without extended dialogue, but do warn of consequences (e.g. shopping cart)
Supporting redo and undo functions.
4 Consistency and standards
Use the same words to mean the same thing Example: Exit and Log out or even Leave
Navigation should be consistent Follow platform conventions.
4 Consistency and standards
4 Consistency and standards
5 Error prevention
Anticipate common mistakes and prevent them
Example: number keypads for entering phone numbers.
Confirmation dialogues may be useful before users do anything irreversible
5 Error prevention
From Seminara, Gonzales, & Parsons, 1977. Photograph courtesy of. Seminara.
5 Error prevention
Picture: Frankfarm (Creative Commons)
RMIT University2020 CS&IT 21
6 Recognition rather than recall
Instructions to use your system should be easily visible and followed.
What is possible should be readily visible Dont expect users to memorise functions
Use layout, graphics and design to ensure that functions are easily identified.
6 Recognition rather than recall
6 Recognition rather than recall
6 Recognition rather than recall
What do you type?
6 Recognition rather than recall
What do you say to these?
7 Flexibility and efficiency of use
Shortcuts for expert users
Functionality based on user skills
Help for novice users, accelerators for experts
User accounts and settings drive experience
7 Flexibility and efficiency of use
8 Aesthetics and minimalist design
Do not clutter!
Every element should be vital Avoid overwhelming your users
Funnel your users, dont blanket them with functions.
8 Aesthetic and minimalist design
Google 2015 and now
Design is cultural! Shanghai Jiao-
9 Recognize, diagnose and recover
Error messages should be: phrased in clear & natural
constructive: offer alternatives
polite; do not intimidate or blame the user
9 Recognize, diagnose and recover
Good error messages help the user to
resolve their problem
learn more about the system
Bad error messages
WinSCP error message
RMIT University2020 CS&IT 34
Remmina Remote Desktop, Ubuntu
10 Help and documentation
Help is the last resort
If help is needed, the user is already frustrated, help must be: Easy to locate
Contextual where possible.
10 Help and documentation
10 Help and documentation
10 Help and documentation
Heuristic Evaluation
Heuristic evaluation (Nielsen and Molich, 1990; Nielsen 1994) is a usability engineering method for finding the usability problems in a user interface design so that they can be attended to as part of an iterative design process. Heuristic evaluation involves having a small set of evaluators examine the interface and judge its compliance with recognized usability principles (the heuristics).
https://www.nngroup.com/articles/how-to-conduct-a-heuristic-evaluation/
Heuristic Evaluation
No single set of Heuristics. Nielsen famous, but there are also others:
Bastien and Scapin created a set of 18 Ergonomic criteria Gerhardt-Powals 10 Cognitive Engineering Principles
Connell & Hammonds 30 Usability Principles
Smith & Mosiers 944 guidelines for the design of user-interfaces (from 1986)
(http://www.measuringu.com/blog/he.php )
Applying Heuristics
Usability violation of heuristic(s)? Assign a severity. 0 = no problem to
4 = usability catastrophe
Table of issues and severity.
Issues fixed according to ease of fix and severity
Effectiveness
From: Nielsen, J., & Molich, R. (1990). Heuristic evaluation of user interfaces. In Proc CHI (pp. 249-256)
5 analysts trap
75% of all problems
>90% of serious problems
Same results for 2 domain expert analysts
Pros and Cons
Inexpensive
Early feedback
Requires multiple experts
May require additional usability testing
More Heuristics: Shneidermans Eight Golden Rules
Designing the User Interface: Strategies for Effective Human-Computer Interaction,
Strive for consistency
Enable frequent users to use shortcuts
Offer informative feedback
Design dialogue to yield closure
Offer simple error handling
Permit easy reversal of actions
Support internal locus of control
Reduce short-term memory load https://www.interaction-design.org/literature/article/shneiderman-s-eight-golden-rules-will-help-you-design-better-interfaces
How Shneidermans 8 Golden Rules
Consistency
How Shneidermans 8 Golden Rules
How Shneidermans 8 Golden Rules
How Shneidermans 8 Golden Rules
Informative Feedback
How Shneidermans 8 Golden Rules
How Shneidermans 8 Golden Rules
Permit reversal of actions
How Shneidermans 8 Golden Rules
Error Handling
How Shneidermans 8 Golden Rules
Support internal locus of control
How Shneidermans 8 Golden Rules
Reduce short-term memory load
Evaluating your interface using Schneidermans 8 Golden Rules
Worksheet PDF: https://public- media.interaction- design.org/pdf/Shneiderman.s.Eight. Golden.Rules.Worksheet.pdf
Quiz time: Code is to Quizzes in Canvas, and complete Quiz 2
Part 2: Design Principles
Design Principles? Heuristics?
Heuristics
Abstract Focus on cognition
Design Principles
Specific Concrete Focus on interaction
How to use
Understand context
Type of system
Type of user
Context of use
Guidelines, not rules!
Principle of proximity
Also known as the grouping principle.
Objects near each other do related things
Navigation particularly affected
e.g. no will be next to yes
Proximity example
Visibility and visual feedback
Prominence
Colour/contrast
Prominence
Can be used to bring important messages to the fore
Youll read this
Before this
RMIT University2020 62
a) Prominence
RMIT University2020 CS&IT
Often used to bring items into focus without losing context
Guide attention
RMIT University2020 CS&IT 65
Readability effects
RMIT University2020 CS&IT 66
Colours/contrast
Higher contrast or brighter colours will draw more attention.
Youll read this
Before this
RMIT University2020 CS&IT
Affordance
Cues for use
Doors again
What is the system doing? Waiting for input?
Processing?
Consistency
Internal consistency: Ensuring like things in your interface look similar
Position of functions
Style/font/colours
Language (log in vs. sign in)
External consistency: employing the conventions of similar interfaces
Design patterns
Interface element placement
Language
Whats wrong with this picture?
Hicks law
Amathematicalformula describing how long it will take users to choose the item from a set of items.
More items to choose from -> longer time.
Time increases logarithmically
Hicks Law
Hicks Law
Fitts law
A mathematical formula that models how accurate users will be when moving the cursor between objects (e.g. buttons) on screen.
Further apart -> less accurate.
Its faster to hit larger targets closer to you than smaller targets
further from you.
Found to work with touch interfaces
Fitts law
RMIT University2020 CS&IT 77
Fitts law
RMIT University2020 CS&IT 78
Reflecting on interface design principles
RMIT University2020 CS&IT 79
Image Credit:
Looking back Microsoft Bob
https://youtu.be/5teG6ou8mWU?t=28
RMIT University2020 CS&IT 80
Nielsens 10 principles
How to do a Heuristic Analysis Shneidermans 8 golden rules Design principles
CS: assignmentchef QQ: 1823890830 Email: [email protected]
Reviews
There are no reviews yet.