May 10, 2011 – Andrey Kruglyak

Human-Computer Interaction

D7023E Intelligent Systems and HCI

1

HCI

✤ Two questions:

✤ How do people interact with computer systems?

✤ How should we design User Interface?

2

Simple is hard!

3

Agenda

✤ Usability of Interactive Systems

✤ Guidelines, Principles, and Theories

✤ Evaluating Interface Designs

✤ Software Tools

4

Agenda

✤ Usability of Interactive Systems

✤ Guidelines, Principles, and Theories

✤ Evaluating Interface Designs

✤ Software Tools

5

Interaction

✤ Early computers: pure computations – input punch cards, wait, read the print-out on paper

✤ Today computers are used for all kinds of tasks by a lot of people, so their purpose is to assist us in everyday tasks

✤ pure computations are still important but represent a very small segment

✤ in many cases, there is no functionality without interaction

✤ Interaction today: screen & audio for output, mouse/keyboard/touch for input (still no good speech recognition)

6

Usability Requirements

✤ What makes a computer system usable, universal, and useful?

✤ Design must go beyond vague “user-friendliness”, it should be based on development processes (“build for usability”) and objective assessments

✤ Requirement analysis is the first step in system design, and it should focus on usability

7

Goals for Requirement Analysis

✤ Ascertain the users’ needs (tasks and subtasks)

✤ this is central since inadequate functionality frustrates users

✤ providing excessive functionality is also a danger

✤ Ensure proper reliability

✤ users’ trust of systems is fragile

✤ Promote appropriate standardization, integration, consistency, and portability

8

Standardization, integration, consistency, and portability

✤ Standardization: common UI features across multiple applications

✤ Integration across application packages and platform tools

✤ Consistency: common action sequences, terms, units, layouts, controls, typography, etc. within an application program

✤ Portability: potential to convert data and share user interfaces across multiple software and hardware environments

9

Usability Measures

✤ Time to learn

✤ Speed of performance

✤ Rate of errors by users

✤ Retention over time

✤ Subjective satisfaction

10

Universal Usability

✤ “Know your user” – human abilities, backgrounds, motivations, personalities, cultures, and work styles are remarkably diverse

✤ This presents a challenge to developing a good UI

11

Universal Usability

✤ Variations in physical abilities and physical workplaces

✤ Variations in cognitive and perceptual abilities

✤ Personality differences

✤ Cultural and international diversity

✤ Users with disabilities

✤ Age (older adults, children)

12

On schedule and within budget

✤ Proper attention to usability and rigorous testing often lead to reduced cost and rapid development

13

Agenda

✤ Usability of Interactive Systems

✤ Guidelines, Principles, and Theories

✤ Evaluating Interface Designs

✤ Software Tools

14

Examples of UI Guidelines

✤ Navigating the interface:

✤ standardize task sequences

✤ ensure that embedded links are descriptive

✤ use unique and descriptive headings

✤ use check boxes for binary choices (NB Apple uses binary sliders)

✤ develop pages that will print properly

✤ use thumbnail images to preview larger images

15

Examples of UI Guidelines

✤ Getting the user’s attention:

✤ Intensity (use two levels only)

✤ Marking (underline, box enclosure, point with an arrow, use an asterisk, bullet, dash, etc.)

✤ Size (use up to four sizes)

✤ Choice of fonts (up to three fonts)

✤ Color (use up to four colors)

16

Apple Guidelines

✤ Apple Human Interface Guidelines (Mac OS X)

✤ Application Design Fundamentals (The Design Process, Characteristics of Great Software, Human Interface Design, Prioritizing Design Decisions)

✤ The Macintosh Experience (The Mac OS X Environment, Using Mac OS X Technologies, Software Installation and Software Updates)

✤ The Aqua Interface (User Input, Drag and Drop, Text, Icons, Pointers, Menus, Windows, Controls, Layout Guidelines)

✤ iOS Human Interface Guidelines (iOS)

17

Principles of UI Design

✤ Determine users’ skill levels

✤ Novice or first-time users: instructions, dialog boxes, online help, video tutorials can be useful; restricting vocabulary and number of tasks also helps

✤ Knowledgeable intermittent users: consistent structure of menus, consistent sequences of actions, meaningful messages, guides to frequent patterns of usage, high interface apparency are of value

✤ Expert frequent users: require rapid response times, brief and non-distracting feedback, shortcuts, user-defined macros

18

Principles of UI Design

✤ Determine users’ skill levels

✤ Identify the tasks by frequency

✤ frequent actions (should be quick and simple to carry out, even at the expense of lengthening less frequent actions)

✤ less frequent actions

✤ infrequent actions

19

Principles of UI Design

✤ Determine users’ skill levels

✤ Identify the tasks

✤ Choose an interaction style (this is not a complete list)

✤ direct manipulation

✤ menu selection

✤ form fillin

✤ command language

20

Principles of UI Design

✤ Determine users’ skill levels

✤ Identify the tasks

✤ Choose an interaction style

✤ Use the eight golden rules of interface design

21

The Eight Golden Rules of Interface Design

✤ Strive for consistency

✤ Cater to universal usability

✤ Offer informative feedback

✤ Design dialogs to yield closure

✤ Prevent errors

✤ Permit easy reversal of actions

✤ Support internal locus of control

✤ Reduce short-term memory load

22

Principles of UI Design

✤ Determine users’ skill levels

✤ Identify the tasks

✤ Choose an interaction style

✤ Use the eight golden rules of interface design

✤ Prevent errors

23

Theories

✤ The goal is to model user interaction, understand human thinking, develop terminology, develop and validate testing techniques

24

Agenda

✤ Usability of Interactive Systems

✤ Guidelines, Principles, and Theories

✤ Evaluating Interface Designs

✤ Software Tools

25

Evaluating Interface Design

✤ Expert reviews

✤ ask colleagues or customers for their feedback

✤ Usability testing

✤ a participant and an observer, often with video recording

✤ Surveys

✤ Acceptance tests

✤ Evaluation during active use

26

Agenda

✤ Usability of Interactive Systems

✤ Guidelines, Principles, and Theories

✤ Evaluating Interface Designs

✤ Software Tools

27

Interface-Building Tools

✤ User-interface independence

✤ separate interface design from internals

✤ enable multiple user-interface strategies

✤ enable multiple-platform support

✤ enforce standards

✤ Notation

✤ Find ways to talk about design

28

Interface-Building Tools

✤ Rapid prototyping

✤ Try out ideas very early

✤ Test, revise, test, revise, ...

✤ Engage end users, managers, and customers

✤ Software support

✤ Increase productivity

✤ Offer constraint and consistency checks

29

Interface-Building Tools

✤ Interface mockup tools (Powerpoint, Keynote; Flash, Dreamweaver)

✤ Visual development tools (MS Visual Studio, Borland JBuilder)

✤ Software engineering tools

30