Human-Computer Interaction

2

Software Usability: Usability Criteria

• Learnability• Time to learn.• Issue: learn how well?

• Efficiency• Degree to which system supports user performance.• Time efficiency.• Procedural efficiency (number of steps).

• Memorability• Extent to which use procedures can be

remembered.• Issue: Casual users and intermittent use.

3

Software Usability: Usability Criteria (2)

• Errors• Extent to which software induces errors.• User “traps”.• Issue: Violation of arbitrary standard may

not be an error.

• User Satisfaction• Subjective estimation.• Rating scales.

4

Task and User Characteristics

• Task frequency

• Discretionary vs. mandatory use

• Types of users• novice• knowledgeable intermittent user• expert frequent user

5

Theories, Models, and Metaphors

• Norman’s seven stages of action model1. Establish the goal.

• Carry out an action by:2. Forming an intention

3. Specifying the action sequence (planning)

4. Executing the action sequence (execution)

• Assess the effects of the action by5. Perceiving the system state

6. Interpreting the state

7. Evaluating the system state with respect to the goal and intentions

6

GOMS Modeling

• Goals• desired end, result• e.g., new version of a Word document (original

preserved)

• Operators• steps that can be performed towards achieving

the goal• e.g., open document in Word, copy file

7

GOMS Modeling (2)

• Methods• ordered set of operators• e.g., “Save From Word”:

1.open document in Word2.Save As new name

• Selection Rules• Rules to select which method to use• e.g.,

• IF currently using WordTHEN use “Save From Word” method

• IF currently using Windows ExplorerTHEN use “Copy and Rename”

8

Models and Metaphors

• Conceptual model/metaphor• Real-world task that helps user interact with the system• e.g.,

• cut-and-paste • desktop metaphor• spreadsheet metaphor

• Mental model• How the user thinks about how the software works:

beliefs about• parts of the software• how the parts interact• what functions can be performed• how to perform those functions

9

Conceptual Models vs Mental Models

• Goal: Design interface so that user quickly develops an “accurate” mental model.

• Approach:• make invisible parts visible• provide feedback• be consistent• present functionality through a familiar

metaphor

10

Basic Screen Design Principles

• General Layout

• Text

• Numbers

• Coding Techniques

• Color

11

General Layout Principles

• Include only essential information.• Include all essential information.• Start in upper left corner.• Develop and follow formatting standards.• Group items logically.• Provide symmetry and balance.• Avoid use of ALL UPPER CASE.• Distinguish captions (field labels) and

fields.

12

Text Principles

• Make messages concise.

• Text should be simple, specific, comprehensible, and clear.

• Use level of detail appropriate to user and task.

• Make messages constructive, not critical.

• Message should imply that user is in control.

• Use wording consistent with appropriate action.

13

Text Principles (2)

• Place instructional prompts when and where needed.

• Use active voice.

• Avoid negatives.

• Order prompts chronologically.

• Format prompts for easy scanning.

• Use consistent terminology.

14

Number Principles

• Right justify numbers.

• Decimal-align real numbers.

• Avoid leading zeros.

• Group digits with appropriate separators.

15

Coding Techniques Principles.

• Use attention-getting techniques appropriately and cautiously.

• Limit size coding to 5 sizes.

• Use 2-4 different character types.

• Use geometric shapes.

• Use borders to group items.

16

Color Principles

• Use color sparingly.• Use color to draw attention, organize, and

indicate status.• Use color to support search tasks.• Back up color coding with redundant cues.• Use color consistently• Limit color coding to 8 colors.• Avoid saturated blues for text.• Choose color combinations carefully.

17

Nielson’s General Usability Principles

• Match between system and real world

• Consistency and standards

• Visibility of system status

• User control and freedom

• Error prevention, recognition, and recovery

• Memory

• Flexibility and efficiency of use

• Simplicity and aesthetic integrity

18

Match between system and real world

• Speak the user’s language.

• Use familiar conceptual models/metaphors

• Follow real-world conventions

• Input cues map onto user’s goals

19

Consistency and standards

• Be consistent throughout the interface

• Use color coding uniformly

• Use uniform input syntax

• Show similar information on the same place on each screen

• Logically group functions

• Conform to platform (e.g., Windows) interface conventions

20

Visibility of system status

• Keep user informed about what’s going on

• Show that input has been received

• Change features as task is accomplished

• Provide feedback for all actions

• Indicate progress in task performance

• Make feedback timely and accurate

• Use direct manipulation

21

User control and freedom

• Be forgiving (undo, redo)

• Mark exits clearly

• Provide ability to reorder or cancel tasks

• Allow user to initiate/control actions

• Avoid modes

22

Error prevention, recognition, and recovery

• Prevent errors from occurring

• Help users recognize, diagnose, and recover from errors

• Use clear, explicit error messages

23

Memory

• Use see-and-point rather than remember-and-type

• Make set of available options visible

• Make everything needed available through the GUI

• Provide lists of choices

• Use direct manipulation

• Evoke goals in the user

24

Flexibility and efficiency of use

• Provide shortcuts, accelerators

• Provide customization to speed up actions

• Make system efficient

25

Simplicity and aesthetic integrity

• Make interface look good with simple graphic design

• Use simple, natural dialog

• Avoid clutter

• Put information in natural and logical order

26

Application of the Principles

• Microsoft Word

• Dreamweaver MX

• Mozilla Composer

• FAA Certification Job Aid document anotation form (MS Access)

27

28

29

30

31

Steps in Software Interface Design

• Phase 1: Scoping 1. Develop project plan: scope and schedule.

2. Develop user profile.

3. Define hardware, software platform, interface techniques.

• Phase 2: Functional Specification 4. Perform task analysis.

5. Set user interface goals, specify minimum performance levels.

6. Define training and documentation.

32

Steps in Software Interface Design (2)

• Phase 3: Design 7. Develop mockup: storyboard, rapid

prototyping, etc.

8. Develop style guide.

9. Perform detailed user interface design.

10. Develop interface prototype.

11. Write prototype user interface test plan.

12. Perform prototype user interface testing. Redesign.

33

Steps in Software Interface Design (3)

• Phase 4: Development13. Develop training and documentation.

14. Develop user interface test plan.

• Phase 5: Testing/Implementation15. Conduct user interface testing. Iterate.

16. Evaluate final user interface.

34

Software Usability Metrics

• Effectiveness• Percent tasks completed• Ratio of successes to failures• Number of features/commands used• Workload

• Efficiency• Time to complete task• Time to learn• Time spent on errors• Percent/number of errors• Frequency of help/documentation use• Number of repetition of failed commands

35

Software Usability Metrics (2)

• User Satisfaction• Usefulness rating• Satisfaction rating• Number of time dissatisfaction expressed• Rating of user vs computer control• Perception that software supports task