Interface Design Principles

http://www.cs.cmu.edu/~
bam/uicourse/special/

1
 AIMS
• Introduced The UI design process
• Discussed UI Design Principles

www.id-book.com 2
 The user interface
• System users often judge a system by its
interface rather than its functionality
• UI should match the skills, experience,
and expectations of potential users
• Critical for system dependability
• A poorly designed interface can cause a
user to make catastrophic errors
• Take into account mental and physical
capabilities of users
• Poor user interface design is the reason
why so many software system features are
never used
 The UI design process
• UI design is an iterative process
involving close interaction between users
and designers.
• The 3 core activities in this process
are:
– User analysis. Understand what the
users will do with the system;
– System prototyping. Develop a
series of prototypes for experiment;
– Interface evaluation. Experiment
with these prototypes with users.
 User interface design
process

Analyse and Produce paper- Evaluate design

understand user based design with end-users
activities prototype

Produce
Design Evaluate design
dynamic design
prototype with end-users
prototype

Executable Implement
prototype final user
interface
 UI Design Principles
Principle Description
User familiarity The interface should use terms and concepts which are
drawn from the experience of the people who will make most
use of the system.

Consistency The interface should be consistent in that, wherever

possible, comparable operations should be activated in the
same way.
Minimal surprise Users should never be surprised by the behaviour of a
system.
Recoverability The interface should include mechanisms to allow users to
recover from errors.
User guidance The interface should provide meaningful feedback when
errors occur and provide context-sensitive user help facilities.
User diversity The interface should provide appropriate interaction
facilities for different types of system user.
 UI Design Principles
• User familiarity
– The interface should be based on user-oriented terms
and concepts rather than computer concepts.
– For example, an office system should use concepts
such as letters, documents, folders etc. rather than
directories, file identifiers, etc.
• Consistency
– The system should display an appropriate level of
consistency.
– Commands and menus should have the same syntax,
format, etc.
• Minimal surprise
– If a command operates in a known way, the user
should be able to predict the operation of comparable
commands
 UI Design Principles
• Recoverability
– The system should provide some resilience to
user errors and allow the user to recover from
errors.
– This might include an undo facility, confirmation
of destructive actions, check-pointing, 'soft'
deletes, etc.
• User guidance
– Some user guidance such as help systems, on-
line manuals, etc. should be supplied
• User diversity
– Interaction facilities for different types of user
should be supported.
– For example, some users have seeing difficulties
and so larger text should be available
 Design Issues

• Two problems must be addressed

in interactive systems design
– How should the user interact with the
computer system?

– How should information from the

computer system be presented to the
user?
 Design rules
•Designing for maximum usability
– the goal of interaction design

•Principles of usability
– general understanding

•Standards and guidelines

– direction for design

•Design patterns
– capture and reuse design knowledge
 Types of design rules
• principles
– abstract design rules Guidelines
– low authority

increasing generality
– high generality

increasinggenerality
– E.g.: “an interface should be easy
to navigate”
• guidelines
Standards
– lower authority
– more general application
– E.g.:“use colour to highlight links”
• standards increasing authority
increasing authority
– specific design rules, measurable
– high authority
– limited application
• Pattern: A pattern is an invariant solution to a recurrent
problem within a specific context.
 Usability Attributes
Attribute Description
How long does it take a new user to
Learnability become productive with the system?
Speed of How well does the system response
operation match the user’s work practice?
How tolerant is the system of user
Robustness error?
How good is the system at recovering
Recoverability from user errors?
How closely is the system tied to a
Adaptability single model of work?
 Principles to support
usability
Learnability
the ease with which new users can begin effective
interaction and achieve maximal performance
Flexibility
the multiplicity of ways the user and system
exchange information
Robustness
the level of support provided the user in
determining successful achievement and
assessment of goal-directed behaviour
Learnability
 Principles of Learnability
Predictability
– determining effect of future actions
based on past interaction history
– operation visibility

Synthesizability
– assessing the effect of past actions
– immediate vs. eventual honesty
 Principles of Learnability
(ctd)
Familiarity
– how prior knowledge applies to new system
– guess ability; affordance

Generalizability
– extending specific interaction knowledge to
new situations

Consistency
– likeness in input/output behaviour arising
from similar situations or task objectives
Flexibility
 Principles of flexibility
Dialogue initiative
– freedom from system imposed constraints on
input dialogue
– system vs. user pre-assumptions

Multithreading
– ability of system to support user interaction for
more than one task at a time
– concurrent vs. interleaving; multimodality

Task migratability
– passing responsibility for task execution
between user and system
 Principles of flexibility (ctd)
Substitutive
– allowing equivalent values of input and
output to be substituted for each other
– representation multiplicity; equal
opportunity

Customizability
– modifiability of the user interface by
user (adaptability) or system (adaptively)
Robustness
 Principles of Robustness
Operability
– ability of user to evaluate the internal state of
the system from its perceivable representation
– Brows-ability; defaults; reachability;
persistence; operation visibility

Recoverability
– ability of user to take corrective action once
an error has been recognized
– reachability; forward/backward recovery;
commensurate effort
 Principles of robustness
(ctd)
Responsiveness
– how the user perceives the rate of
communication with the system
– Stability

Task conformance
– degree to which system services
support all of the user's tasks
– task completeness; task adequacy
ok
 Design factors in message
wording
Context The user guidance system should be aware of what the user is
doing and should adjust the output message to the current
context.
Experience As users become familiar with a system they become irritated
by long, ‘meaningful’ messages. However, beginners find it
difficult to understand short terse statements of the problem.
The user guidance system should provide bothtypes of message
and allow the user to control message conciseness.
Skill level Messages should be tailored to the user’s skills as well as their
experience. Messages for the different classes of user may be
expressed in different ways depending onthe terminology which
is familiar to the reader.
Style Messages should be positive rather than negative. They should
use the active rather than the passive mode of address. They
should never be insulting or try to be funny.
Culture Wherever possible, the designer of messages should be familiar
with the culture of the country where the system is sold. There
are distinct cultural differences between Europe, Asia and
America. A suitable message for one culture might be
unacceptable in another.
 Using design rules

Guidelines

Design rules

increasing generality
increasinggenerality
• suggest how to increase usability
• differ in generality and authority
Standards

increasing
increasing
authorityauthority
 Standards
• set by national or international bodies to
ensure compliance by a large community of
designers standards require sound underlying
theory and slowly changing technology

• hardware standards more common than

software high authority and low level of
detail

• ISO 9241 defines usability as

effectiveness, efficiency and satisfaction with
which users accomplish tasks
 Guidelines
• more suggestive and general
• many textbooks and reports full of
guidelines
• abstract guidelines (principles)
applicable during early life cycle activities
• detailed guidelines (style guides)
applicable during later life cycle activities
• understanding justification for
guidelines aids in resolving conflicts
 HCI Design patterns
• An approach to reusing knowledge about
successful design solutions. Originated in
architecture (Alexander).
• A pattern is an invariant solution to a
recurrent problem within a specific context.
• Examples:
– Light on Two Sides of Every Room (architecture)
– Go back to a safe place (HCI)
• Patterns do not exist in isolation but are linked
to other patterns in a pattern languages which
enables complete designs to be generated
 HCI Design patterns(cont.)
• Characteristics of patterns
– capture design practice not theory
– capture the essential common properties of good examples of
design
– represent design knowledge at varying levels: social,
organisational, conceptual, detailed
– embody values and can express what is humane in interface
design
– are intuitive and readable and can therefore be used for
communication between all stakeholders
– a pattern language should be generative and assist in the
development of complete designs.
 Golden rules and heuristics
• “Broad brush” design rules
• Useful check list for good design
• Better design using these than using nothing!
• Different collections e.g.
– Nielsen’s 10 Heuristics
– Shneiderman’s 8 Golden Rules
– Norman’s 7 Principles
 Nielsen's Ten Usability
Heuristics - Summary
1. Visibility of System Status
2. System Matches 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
Shneiderman’s 8 Golden Rules
1. Strive for consistency
2. Enable frequent users to use shortcuts
3. Offer informative feedback
4. Design dialogs to yield closure
5. Offer error prevention and simple error handling
6. Permit easy reversal of actions
7. Support internal locus of control
8. Reduce short-term memory load
 Norman’s 7 Principles
1. Use both knowledge in the world and
knowledge in the head.
2. Simplify the structure of tasks.
3. Make things visible: bridge the gulfs of
Execution and Evaluation.
4. Get the mappings right.
5. Exploit the power of constraints, both natural
and artificial.
6. Design for error.
7. When all else fails, standardize.
Jakob Nielsen’s 10 Heuristics for evaluation:
1. Visibility of system status
The system should always keep users informed about what is
going on, through appropriate feedback within reasonable time.

2. Match between system and the real world

The system should speak the users' language, with words,
phrases and concepts familiar to the user, rather than system-
oriented terms. Follow real-world conventions, making
information appear in a natural and logical order.

3. User control and freedom

Users often choose system functions by mistake and will need a
clearly marked "emergency exit" to leave the unwanted state
without having to go through an extended dialogue. Support
undo and redo.
Jakob Nielsen’s 10 Heuristics for evaluation:
4. Consistency and standards
Users should not have to wonder whether different words, situations, or
actions mean the same thing. Follow platform conventions.

5. Error prevention
Even better than good error messages is a careful design which
prevents a problem from occurring in the first place.

6. Recognition rather than recall

Make objects, actions, and options visible. The user should not have to
remember information from one part of the dialogue to another.
Instructions for use of the system should be visible or easily retrievable
whenever appropriate.

7. Flexibility and efficiency of use

Accelerators -- unseen by the novice user -- may often speed up the
interaction for the expert user such that the system can cater to both
inexperienced and experienced users. Allow users to tailor frequent
actions.
• Jakob Nielsen’s 10 Heuristics for evaluation:
8. Aesthetic and minimalist design
Dialogues should not contain information which is irrelevant or rarely
needed. Every extra unit of information in a dialogue competes with the
relevant units of information and diminishes their relative visibility.

9. Help users recognize, diagnose, and recover from errors

Error messages should be expressed in plain language (no codes), precisely
indicate the problem, and constructively suggest a solution.

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.
 Twelve Principles for good human-centred
interactive systems design
proposed by Benyon, Turner & Turner in
‘Designing Interactive Systems’

Learnability Robustness
• 1. Visibility • 8. Recovery
• 2. Consistency
• 9. Constraints
• 3. Familiarity
• 4. Affordance Accommodation
Ease of Use • 10. Flexibility
• 5. Navigation • 11. Style
• 6. Control • 12. Conviviality
• 7. Feedback
37
 Summary
Principles for usability
– repeatable design for usability relies on maximizing
benefit of one good design by abstracting out the
general properties which can direct purposeful design
– The success of designing for usability requires both
creative insight (new paradigms) and purposeful
principled practice

Using design rules

– standards and guidelines to direct design activity