Lecture 6User Interface Design

SFDV2002 - Principles of Information Systems

2

Overview

What is the field of HCI?The limitations and capabilities of “Human”

and “Computer” that influence the designing of user interfaces

Examples of Interactions between humans and computers

User Interface Design Need to understanding users Guidelines for creating usable user interfaces

Approaches for evaluating user interfaces

3

“… involves the design, implementation and evaluation of interactive systems in the context of the user’s task and work”

Human Computer Interaction

Computer

Interaction

Human (Users)

4

What is Human Computer Interaction (HCI)? “… involves the design, implementation and evaluation of interactive systems in the context of the user’s task and work”

Who are the users (humans)?• performing tasks or processes • As far as HCI goes it is not necessarily a single user:

• individual user: not just a user with a desktop• group of users working together• sequence of users: performing parts of tasks or processes

Computers?• Computer/technology

• but can include non-computerized parts of a system.• desktop computer and other technology (e.g. mobile devices, etc.)

What is meant by interactions• Communication between the a user and computer

• Direct: involves dialog with feedback and control throughout the performance of tasks• Indirect: involves background or batch processing

5

HCI: Multi-Disciplinary SubjectPsychology

and cognitive science

Ergonomics

Sociology

Computer science

and engineerin

g

Business

Graphic design

Technical writing

Others …

•Psychology and cognitive science: provides knowledge of the user’s perceptual, cognitive and problem-solving skills• Ergonomics: for the user’s physical capabilities • Sociology: contributes to an understand of the wider context of the user’s interactions• Computer science and engineering: skills to build the necessary technology• Business: able to market it, etc.• Graphic design: to produce an effective interface presentation• Technical writing: production the manuals

6

Human: Capacities and Limitations

Perceptual system Senses: sight, hearing,

touch, taste, and smell e.g. visual processing system

Motor skills e.g. movement time,

reaction time, and speed and accuracy

Human memory e.g. short term memory Human

(Users)

7

Computer: Capacities and Limitations

Input devices e.g. keyboard, positioning and

pointing devices, handwriting recognition, speech recognition, others …

Output devices e.g. Computer screens, 3D

displays – Virtual Reality, Printing, Virtual Reality, etc.

Memory and Processing Computer

8

Interaction: Different Styles

Interaction

[Schneiderman, 2004]

Direct Manipulation

Menu Selection Command Language

Natural Language

Form Fill-In

9

1- Direct manipulation•When designers create a visual representation of the world of actions•Interaction with objects on the screen instead of typing”•Keyboard and mouse replaced with cursor-motion devices to select from a visible set of objects and actions•First application using this interaction style was VisiCalc (1978)•Desktop metaphor – notepad, calendar, calculator, folders containing documents

2- Menu selection•Selects from lists of items most appropriate for the task at hand•Designer need to be careful that all functions are supported.

3- Form fillin (also fill in the blanks)•When data entry is required, menu selection usually becomes cumbersome, and form fillin is appropriate.•Users see a display of related fields and associated labels that let the user know the permissible values

4- Command language •Good for frequent users as command languages provides a strong feeling of control and initiative•Users learn the syntax and can often express complex possibilities rapidly without having to read distracting prompts•Error rates are high, training is necessary, and retention may be poor.

5- Natural languages•Computers responding to natural language sentences or phrases engages – still being developed

10

Advantages Disadvantages

Visually presents task concept

May be hard to program

Allows easy learning May require graphics display and point devices

Allows easy retention

Allow errors to be avoided

Encourages exploration

Affords high subjective satisfactions

Direct Manipulation

Advantages Disadvantages

Shorten learning time Present danger of many menus - overwhelm the user

Reduces keystrokes May slow frequent users

Structures decision making - all choices are presented

Consumes screen space

Permits use of dialog-management tools

Requires rapid display rates

Allows easy support or errors handling

Menu Selection

Advantages Disadvantages

Simplifies data entry Consumes screen space

Requires modest training

Gives convenient assistance

Form Fill-In

Advantages Disadvantages

Is flexible Has poor error handling

Appeals to the “power” users Requires substantial training and memorization

Supports user initiative

Allows convenient creation user-defined macros

Command language

Advantages Disadvantages

Relives burden of learning syntax

Relieves burden of learning syntax

May require more keystrokes

Natural language

[Source: Schneiderman, 2004]

11

User Profiles: Human Diversity

Physical abilities and physical workplacesCognitive and perceptual abilitiesPersonality differencesCultural and international diversityUsers with disabilities Elderly users

[Source: Schneiderman, 2004]

12

User Profiles: Diversity of UsersNovice

(first-time users)

Knowledgeable Intermittent

Users

Expert frequent

Users

•assumed to know little of the task•Anxiety about using computers inhibit learning •Including things like instructions, dialog boxes, and online help

•Broad knowledge of interface concepts, but have difficultly retaining the structure of menus.•Protect against user partially forgetting sequences of actions

•“power” user: seek to get their work done quickly.•Demand for rapid response time.•Like to create macro or other abbreviated form to reduce the number of steps.•Shortcuts through menus and other accelerators are requirements

13

References

Shneuiderman and Plaisant, Designing the User Interface, 4th Edition, Addison Wesley, 2005

Dix, et al., Human-computer interaction, 2nd Edition, Prentice Hall, 1998

Satzinger, et al., Systems Analysis and Design in a changing world, Thomson, 2007

-------------------------------------------------------- NOTE: Time for Practical Test 1 (10%)