Guidelines, Principles and Theories

CS4HC3 / SE4HC3/ SE6DO3Fall 2011

Instructor: Kevin Brownebrownek@mcmaster.ca

Slide content is based heavily on Chapter 2 of the textbook: Designing the User Interface: Strategies for Effective Human-Computer

Interaction / 5th edition, by Ben Schneiderman & Catherine Plaisant

Guidelines, Principles and Theories

● Guidelines● Low-level specific practical guidelines that prescribe

good practices and caution against dangers

● Principles● Middle-level principles analyze and compare design

alternatives

● Theories● High-level theories and models that describe

objects and actions with consistent terminology, or make predictions regarding times for pointing, reading, etc.

Guidelines

● Guideline documents are common, useful● History back to early Apple\Microsoft guidelines● Provide common language for describing UI● Promote consistency amongst designers regarding:

– Appearance– Action sequences– Usage

● Describes best practices– Illustrated with examples, counter-examples– Typically based on experience, experiments

Guidelines

● Creating guidelines documents causes debate!

● Criticisms that guidelines are:● Too specific● Incomplete● Hard to apply● Sometimes wrong

● But guidelines more often better than nothing, lead to steady improvements

Guidelines

● National Cancer Institute government webpage guidelines for interface navigation:● Standardize task sequences● Ensure that embedded links are descriptive● Use unique and descriptive headings● Use radio buttons for mutually exclusive choices● Do not display unsolicited windows or graphics

● Note: there are do's and don'ts

Guidelines

● Guidelines exist for different aspects of the UI:● Navigation● Organization of the display● Getting the user's attention● Facilitating data entry

Guidelines

● 1981 Lockheed display guidelines from report on design of control rooms for electric-power utilities (still valid today!)

– Be consistent in labelling and graphic conventions– Standardize abbreviations– Use consistent formatting in all displayers– Present data only if they assist the operator– Present information graphically where appropriate by

using widths of lines, positions of markers on scales, and other techniques that relieve the need to read and interpret alphanumeric data

Guidelines

● Smith and Mosier (1986) guidelines for data-entry:

– Consistency of data-entry transactions ● Similar sequences of actions should be used under all conditions

– Minimal input actions by user● Greater productivity, fewer chances for error

– Minimal memory load on users● Should not be required to memorize lengthy lists of commands

– Compatibility of data entry with data display– Flexibility for user control of data entry

Principles

● Principles:● Less narrowly focused than guidelines● More fundamental, widely applicable, and enduring● Tend to need more clarification \ interpretation

– Example: “principle of recognizing user diversity”

8 Golden Rules of interface design

● Strive for consistency– Identical terminology in prompts,menus, help screens– Consistent colour, layout, capitalization, etc.

● Cater to universal usability– Novice\expert, age, disability, technological diversity

● Offer informative feedback– Every user action should have system feedback

● Design dialogs to yield closure– e.g. Confirmation page on eCommerce websites

8 Golden Rules of interface design

● Prevent errors– Design system such that designers cannot make errors

● Permit easy reversal of actions– Relieves anxiety, users know errors can be undone– Encourages exploration

● Support internal locus of control– User should feel in control, unsurprised

● Reduce short term memory load– Humans have limited capacity for short-term memory

information processing (7 plus or minus 2 chunks of info)

Principles

● “Determine users' skill levels”● Difficult, undervalued goal● Understanding of users should be starting point of

all design!– Education, cultural, ethnic, training, motivation, goals,

personality, experience● Example separation: novice or first-time users,

knowledgeable intermittent users, expert frequent users

● Multi-layer approach to learning– Let novices learn minimal subset, training-wheels

interface, progress from there

Principles

● “Identify the tasks”● Too often, done informally or incomplete● Task analysis:

– Observing and interviewing users, long process– Establishes action frequency and sequences

● High-level, middle-level, atomic tasks● Frequent tasks should be simple\quick, even at cost

of more infrequent tasks

Principles

● “Identify the tasks”● E.G.

– Frequent tasks performed by pressing special keys– Less frequent might involve ALT, CTRL plus a key– Infrequent actions might require pulling down menu bars,

etc.

Principles

● “Choose an interaction style”● Direct manipulation

– Visual representation of world of action– e.g. Desktop metaphor, drawing tools, air-traffic control

systems, games– Visual representation of objects and actions allows users

to carry out tasks rapidly, observe results immediately– Advantages:

● Allows easy learning & retention, allows errors to be voided, encourages exploration, affords high subject satisfaction

– Disadvantages● May be hard to program, may require graphics display

Principles

● “Choose an interaction style”● Menu selection

– Users read list of items, select most appropriate for their task, observe the effect

– Distinct terminology and meaning of items -> users can accomplish tasks with little learning, memorization, high performance

– Ideal for novice intermittent users, can be for expert as well if menu display and selection is quick

Principles

● “Choose an interaction style”● Form fill-in

– Users fill data into form fields– If data entry required, menu selection alone is too slow– Users must be able to understand field labels,

permissible values, data-entry method– Users must be able to respond to error messages

Principles

● “Choose an interaction style”● Command language

– For frequent users, provides feeling of being in control● Can express complex possibilities rapidly, no distracting prompts

– Error rates typically high– Training is necessary– Retention may be poor– Error messages, online assistance hard to provide– Typically used by expert frequent users– Powerful advantages: history keeping, macro creation

Principles

● “Choose an interaction style”● Natural language

– Limited success so far– Little context provided for issuing next command– Frequently requires clarification dialog– May be slower and than selecting from a well-organized

menu– Useful when users are knowledgable about a task

domain whose scope is limited, and intermittent use inhibits command-language training

Principles

● “Choosing an interaction style”● Blending interaction styles may be appropriate

– When required tasks and users are diverse– E.G. Form fill-in interface for shopping checkout

● Menu items for accepted credit cards● Direct manipulation to select a colour● Form fill in for personal information

Principles

● “Prevent errors”● Extremely important, one of the golden rules

– e.g. Experienced analysts make mistakes in half their spreadsheets, even those involving important business

● Improved error messages provided by interface– Higher success rate in repairing errors– Lower future errors– Increase subjective satisfaction– Use informative messages, not vague or hostile

● e.g “Printer is off, please turn it on” vs. “Illegal Operation”

Principles

● “Prevent errors”● More effective approach: prevent errors from

occurring– Make it difficult to make irreversible actions– Provide feedback about sate of the interface

● Change cursor to represent state

– Design for consistency of actions● Order of Yes/No buttons

Principles

● “Prevent errors”● Allow for correct answers

– E.G. Airplane engines cannot be put into reverse until landing gear is down

– Inappropriate menu items can be greyed out– Calendar can be clicked instead of typing in day and

month – Instead of entering 10 digit phone number, scroll through

list of previously or frequently dialled numbers– Automatic command completion based on first actions,

previous entries

Principles

● “Prevent errors”● Complete sequences

– Offer sequence of required steps as a single action– E.G. Car signal causes both front and back signal lights

to flash

Principles

● “Ensuring human control while increasing automation”● Automate that which does not require human

judgement, capability● Excess automation can cause tragedy:

– Automatic pilot related plane crashes● Controversy: create tool-like interfaces,or

autonomous, adaptive agents?

Theories

● Theories● Tested, reliable, broadly useful

● Descriptive theories● Develop consistent terminology for objects and

actions

● Explanatory theories● Describe sequences of events, possibly cause and

effect (makes intervention possible)

Theories

● Prescriptive theories● Guide designers' choices

● Predictive theories● Allow designers to compare potential designs:

execution time, error rates, conversion rates, trust levels

● Grouping theories by type of skill involved:● Motor, perceptual, cognitive

Theories

● Taxonomies● “Impose order by classifying complex set of

phenomena into understandable categories”● Useful for descriptive and explanatory theories● e.g. Novice, knowledgable, expert● e.g. Input devices: indirect or direct, linear or rotary,

1D or 2D or 3D

● Hundreds of theories in field, competing for attention, being refined, applied

Theories

● Critics:● Theories should be more central to research and

practice● Theories should lead rather than lag behind practice

– Too often theories are used to explain practice, instead of guiding it

● Theories or models are just abstractions of reality, but a good theory should:● Be understandable, produce similar results for

different users, help solve practical problems

Theories

● Developing descriptive theories: design-by-level approach

● 4-level conceptual, semantic, syntactic and lexical model (Foley et al., 1995)● Conceptual level

– User's “mental model” of the interactive system– e.g. Actions on objects in a drawing program

● Semantic level– Meanings covey by user's input and computer's output– e.g. Deleting an object in a drawing program

Theories

● 4-level conceptual, semantic, syntactic and lexical model (Foley et al., 1995)● Syntactic level

– How user actions that convey semantics are structured– e.g. Dragging object into trash can

● Lexical level– Device dependencies, precise mechanisms of how users

specify syntax– e.g. Function key, mouse speed

Theories

● Applying design-by-level strategies?● Start with clear definitions of high level objects and

actions, use task domain language● e.g. Songs by different artists, can be played, in a

playlist● e.g. Baseball leagues play seasons of games made

up of innings...● e.g. Civilization 4 has civilizations made up of cities

Theories

● Stage-of-action models● Forming explanatory theories by portraying stages

of actions that users go through trying to use interactive products

Theories

● Norman (1988) seven stages of (cyclical) actions:

1 Forming the goal

2 Forming the intention

3 Specifying the action

4 Executing the action

5 Perceiving the system state

6 Interpreting the system state

7 Evaluating the outcome

Theories

● Key part: cycles of action and evaluation● Also leads naturally to identification of “gulf of

execution” and “gulf of evaluation”● Gulf of execution:

● Mismatch between the user's intentions and allowable actions

● Gulf of evaluation● Mismatch between the system's representation and

the user's expectations

Theories

● Norman derived four principles from this model:● State an action alternatives should be visible● There should be a good conceptual model with a

consistent system image● Interface should include good mappings and reveal

relationships between stages● Users should receive continuous feedback

Theories

● Critical points where user failure can occur● Users may form inadequate goals● Users might not find correct interface object

– Incomprehensible menu, icon, button?● Users may not know how to specify or execute a

desired action● Users may receive inappropriate or misleading

feedback

Theories

● Contextual theories● Half-day tightly controlled lab experiments are

limited– Interactions with people, environment, other devices,

shape the user's experience● Design cannot be separated from patterns of usage● Suchman (1987) book launched movement: Plans

and Situated Action● More important for context: Ethnographic

observation, longitudinal case studies● Particularly important for mobile interfaces

References

Designing the User Interface: Strategies for Effective Human-Computer Interaction / 5th edition, by Ben Schneiderman & Catherine Plaisant (2010)

National Cancer Institute, Research-based Web Design and Usability Guidelines, Dept. Of Health & Human Services, National Institutes of Health (2006)

Lockheed Missiles and Space Company: Human Factors Review of Electric Power Dispatch Control Venters, Volume 2: Detailed Survey Results, Electric Power Research Institute, Palo Alto, CA (1981)

Smith, Sid L. And Mosier, Jane N., Guidelines for Designing User Interface Software, Electronic Systems Division, MITRE Corporation, Bedford, MA (1986)

Foley, James D., van Dam, Andries, Feiner, Steven K. And Hughes, John F., Computer Graphics: Principles and Practice in C, Second Edition, Addison-Wesley, Reading, MA (1995)

Norman, Donald A., The Psychology of Everyday Things, Basic Books, New York (1988)

Suchman, Lucy A. Plans and Situated Actions: The Problem of Human-Machine Communication, Cambridge University Press, Cambridge, U.K. (1987)