Transcript 2.1

Usability & Design I
13th February
Effective Web Design

Introduction to usability issues

Evaluation and analysis of web-sites
What is Usability?
Usability
is NOT

Usability IS
Just common sense
intuitive, safe, error-free, enjoyable
all art (and no science)
best designed in from the beginning
stumbled onto by
accident
best achieved by knowing your
users
tacked on at the end
free
“The best predictor of customer
satisfaction”
“The next competitive frontier”
What is Usability?
Usability
can be defined as:
“the capacity to be used by humans easily and
effectively where,
easily = to a specified level of subjective assessment
effectively = to a specified level of human performance”
(Shackel, 1990)
Usability
affords the user easy access to the product’s
functions
Usability Issues
Users
User
Groups
Computer skills
& knowledge
Disabilities
Age
Cultural
Nielsen’s Heuristics
Nielsen
defined 10 usability principles that can be
applied to any system, although frequently used for
web applications
Similar
in aim to usability goals, except slightly more
prescriptive
Used
mainly as the basis for evaluating systems
Provide
a framework for usability evaluation
Nielsen’s Heuristics
Visibility
of status
Match to world
User control
Flexibility
Help
Consistency
Errors mgt
error prevention
Simplicity
Recognition
Nielsen’s Heuristics
1. Visibility of system status
Always keep users informed about what is going on,
-> provide appropriate timely feedback within
reasonable time
– e.g. when screen button clicked on provides sound or red
highlight feedback:
“ccclichhk”
Nielsen’s Heuristics
2.
Match between system and the real world
1.
Speak the users’ language
2.
Don’t use system oriented terms
3.
Use real world conventions to make information
appear in a natural and logical order
 Use a technique called mapping: Relationship
between controls and their movements and the results
in the world
Nielsen’s Heuristics
•Why is this a poor mapping of control buttons?
•Why is this a better mapping
Nielsen’s Heuristics
3.
User control and freedom
Provide ways of allowing users to easily escape
and navigate to/from places they unexpectedly find
themselves
e.g.







page forward / backward
hold
cancel
end / stop
help
resume
undo
Nielsen’s Heuristics
4.
Consistency and standards
Avoid making users wonder whether different
words, situations or actions means the same
thing

Design interfaces to have similar operations and use
similar elements for similar tasks

Main benefit is consistent interfaces are easier to learn,
use and remember
Nielsen’s Heuristics

Follow platform conventions



Avoid confusion over whether different words,
situations, or actions mean the same thing to
user
No custom link colours. They may conflict with
rest of Web and make site hard to use.
Web "standards"


Follow HTML specifications
Deviations from the standards results in
unusable features creeping in
Nielsen’s Heuristics
5. Help users recognise, diagnose and
recover from errors
Use plain language to describe the nature of
the problem and suggest a way of solving it

Careful design is better than good error messages
 prevents problems from occurring in the
first place
Nielsen’s Heuristics
6. Recognition rather than recall
Make objects, actions, and options visible.



Don’t force user to recall information
Instructions should be visible or retrieved easily when
needed.
From point of view of the Web, this heuristic is closely
related to system status




Users won’t get lost if they can see where they are by
looking at clues given by on current page.
No need to recall their path to the home page.
Good labels & descriptive links are essential for recognition.
Use images for links, but they need to be well designed.
Nielsen’s Heuristics
7.
Error prevention
Prevent them occurring in first place if possible
Key question: Does the system prevent users from making
serious errors, and if they do make an error, does it permit
them to recover easily
Nielsen’s Heuristics
8.
Flexibility and efficiency of use
Provide accelerators that are invisible to novice users, but
allow more experienced users to carry out tasks more
quickly:

Use accelerators (keyboard shortcuts)

Web Browser provides good accelerators e.g. bookmarks

Design for effective book-marking


contents of site can easily be linked to
users create specialized views of a site for specific tasks
Nielsen’s Heuristics
9.
Aesthetic and minimalist design
Avoid using info that is irrelevant or rarely needed

No irrelevant or rarely needed information in dialogues ->
diminishes visibility

Extraneous information on a page distracts user & slows
them down.

Use progressive levels of detail.

Support different uses of content. No brochures.
Nielsen’s Heuristics
10. Help and documentation
Provide information that can be easily searched
and provides help in a set of concrete steps that
can easily be followed

Better if the system can be used without documentation



it may be necessary to provide help and documentation
Make it easy to search, focused on the user's task,
list concrete steps to be carried out, and not too large.
Pros and Cons: Heuristic Evaluation
Advantages
detects both major (42%)
and minor (32%) problems
in UI
more effective than single
specialist
can be used on designs
“realistic” approach
“severity rating” helps to set
priorities
Disadvantages
groups can develop their own
bias
doing it properly is not that
cheap
new technologies (Web,
Multimedia, Virtual Reality)
may have specific problems
not covered by The
Heuristics
Analyse this using Nielsen’s Heuristics
Analyse this using Nielsen’s Heuristics
Analyse this using Nielsen’s Heuristics
Analyse this using Nielsen’s Heuristics
Analyse this using Nielsen’s Heuristics
References

Shneiderman, B. & Plaisant, C. (2005) Designing
the User Interface

Preece, J. et al. (2002) Interaction Design

Benyon, D. et al (2005) Designing Interactive
Systems
References