System Messages and Screen Design

Error Message Guidelines

• Specific to cause of error
• Constructive guidance for repair
• Positive tone
• User-centered phrasing
• Consider using incremental help displays
• Appropriate physical format
• Avoid anthropomorphic phrasing

Guidelines for Systems Designers

• Increase attention to message design
• Establish message quality control procedures
• Develop internal guidelines
• Conduct usability tests
• Collect user performance data

Process of Developing Effective Messages

• Establish message quality control group
• Include messages in design phase
• Place all messages in a file
• Review messages during development
• Attempt to eliminate need for message
• Carry out acceptance tests
• Collect frequency data for each message
• Review and revise messages over time

Anthropomorphic Design

Advantages

• Can exaggerate computer capabilities
• Can clarify differences between people and machines
• Can reduce user anxiety caused by fear of technology

Disadvantages

• Obstacle of animism
• Expensive to develop
• Takes longer for user to complete CAI tasks when used
• People often prefer talking head to animated informant

Non-anthropomorphic Guidelines

• Avoid presenting computers as people
• Choose appropriate humans for guides
• Use caution in designing computer generated faces or cartoon characters
• Use cartoon characters in kids' games or educational software
• Design comprehensible, predictable, and controllable interfaces
• Provide user-centered overviews for orientation and closure
• Do not use I when computer responds to human actions
• Use you to guide users or state facts

Display Design Approach

• User's task is to make decisions about what to do
• Identify the decision user needs to make at each point
• Identify the information the user requires to make each decision
• Make sure the information is easily available from the display at that point

How do you make the information easily available?

• If possible put all the information on the display at once
• Make sure the information is easy to find visually
• Make sure information is easy to interpret or apply

Aiding Visual Search

• Search order (anticipate where is likely to be looking)
• Put information in fixed, known locations
• Object coding (e.g. color is best, numeric is next best) can increase search efficiency
• Grouping (e.g. border, spatial proximity, alignment, color) is important

Principles of Display Design

• Elegance and simplicity
• Scale, contrast, proportion
• Organization and visual structure
• Modular programming
• Image and representation
• Style

Screen Display Metrics (Tullis)

• Overall density (% of available character positions actually used on screen)
• Local density (average # filled character positions in 5 degree visual angle increments)
• Grouping (character clusters weighted by size of cluster)
• Layout complexity (distribution of horizontal and vertical distances of each label or object from standard reference point on display)

Displaying Quantitative Data

• Analog displays indicate magnitude differences using size, distance, brightness, etc.
• Digital display shows actual numeric values

Quantitative Display Design Principles

• Don't force use to do mental arithmetic (e.g. show x - y, not x and y separately)
• Don’t rely on user as a memory device

Analog Display Advantages

• Better when value changes rapidly
• Better when it is only necessary to note rate or direction of change
• Conveys qualitative and approximate quantitative information
• Useful for marking boundary conditions
• Can be checked quickly

Analog Display Disadvantages

• Takes lots of display space
• Not read as accurately
• Users must interpolate between scale marks

Digital Display Advantages

• Better when exact numeric values needed
• Value strings displayed long enough to be read
• Can be read quickly
• Requires little display space

Digital Display Disadvantages

• Difficult to judge rate of change
• Hard to read when changing quickly
• Judging boundaries distances to boundaries is difficult

Table - displays multiple digital values (aids visual search, when user only needs to search within a specific row or column)

Graph - displays multiple analog values (good when user needs to recognize relationships and paths)

Diagram Graphics Guidlines

• Use conventional semantics (nodes, edges, color coding, labels)
• Use conventional style rules (horizontal and vertical alignment, no crossings, follow domain specific rules)
• Make sure user understands rules for interpretation and how to access the information required by the task

Color Display Problems

• Colors can't be represented perfectly on digital computer systems
• People don’t have the same perceptions of colors
• Color blindness
• Eye fatigue can be caused by using bad color combinations

Color Description Schemes

• Computer Industry Approach (RBG)
• Psychological Dimensions (brightness, hue, saturation)

Using Color Effectively

• Limit total number of colors
• Recognize power of color to speed up or slow down a task
• Ensure color coding supports user task
• Have color coding appear with minimal user effort
• Place color coding under user control
• Design for good monochrome display first
• Use color to help formatting
• Use consistent color coding
• Be alert to user expectations for certain colors (e.g. red means stop or danger)
• Use color changes to indicate state changes
• Use color in graphic displays to increase information density
• Be alert to bad color pairings (e.g. saturated blue and red)
• Consider needs of color impaired users