Chapter 4

Interaction
Outlines
Introduction
Models of interaction
Ergonomics
Interaction styles
The context of the interactions
 Introduction

Interaction starts with getting to know the users and their context:
– finding out who they are and what they are like . . .
– talking to them, watching them.
So, interaction design is not just about the artifact that is produced, whether a
physical device or a computer program, but about understanding and choosing how
that is going to affect the way people work.
Furthermore, the artifacts we give to people are not just the devices and programs,
but also manuals, tutorials, online help systems.
 WHAT IS DESIGN?

Its achieving goals within constraints .

This does not capture everything about design, but helps to focus us on
certain things:
Goals:-
 What is the purpose of the design we are intending to produce?
 Who is it for?
Why do they want it?
For example, if we are designing a wireless personal movie player, we may
think about young affluent users wanting to watch the latest movies whilst on
the move and download free copies, and perhaps wanting to share the
experience with a few friends.
Constraints
What materials must we use?

What standards must we adopt?

How much can it cost?

How much time do we have to develop it?

 Are there health and safety issues?

 Cont…
Trade-off Choosing which goals or constraints can be relaxed so that
others can be met.

The more common skill needed in design is to accept the conflict and
choose the most appropriate trade-off.

Best designs are where the designer understands the trade-offs and the
factors affecting them.
 The Golden rule of Design

The designs we produce may be different, but often the raw materials
are the same. This leads us to the golden rule of design:
Understand your materials
Know your users
 Good Interface Design 1

Users should be able to use an interface:

SAFELY Tasks can be completed without risk – e.g. flying an

aeroplane.
Being able to do the right task and do it well – e.g. videoing a
EFFECTIVELY
TV programme

EFFICIENTLY To carry out tasks quickly and correctly – e.g.

at a cash point
Users should be able to enjoy what they are doing, not be
ENJOYABLY frustrated by the interface – e.g. educational programs
 Good Interface Design 2

There are four considerations for an interface designer:

WHO Who is going to use the system, what are their ages,
etc.?
WHAT What tasks are they likely to want to perform? Repetitive,
complex, simple, etc.

ENVIRONMENT Where is the computer to be used? In a hazardous or noisy

environment?
What is technologically available? Designers should not
FEASIBILITY
add elements to the interface that cannot actually be
used out easily.
 Models of Interaction
We begin by considering the most influential model of interaction,
Norman’s execution–evaluation cycle; then we look at another model
which extends the ideas of Norman’s cycle.
Both of these models describe the interaction in terms of the goals and
actions of the user.
Traditionally, the purpose of an interactive system is to aid a user in
accomplishing goals from some application domain.
 The execution–evaluation cycle

Norman’s model of interaction is perhaps the most influential in

Human–Computer Interaction, possibly because of its closeness to our
intuitive understanding of the interaction between user and computer.
The interactive cycle can be divided into two major phases: execution
and evaluation.
These can then be subdivided into further stages, seven in all.
The stages in Norman’s model of interaction are as follows:

1. Establishing the goal.

2. Forming the intention.

3. Specifying the action sequence.

4. Executing the action.

5. Perceiving the system state.

6. Interpreting the system state.

7. Evaluating the system state with respect to the goals and intentions.
 Cont…

Norman uses this model of interaction to demonstrate why some

interfaces cause problems to their users. He describes these in terms of the
gulfs of execution and the gulfs of evaluation.
The gulf of execution is the difference between the user’s formulation of
the actions to reach the goal and the actions allowed by the system.
 Cont…

If the actions allowed by the system correspond to those intended by

the user, the interaction will be effective.
The interface should therefore aim to reduce this gulf.

The gulf of evaluation is the distance between the physical presentation

of the system state and the expectation of the user.
 Arrangement of controls and displays
The exact organization that this will suggest will depend on the domain
and the application, but possible organizations include the following:
Functional Controls and displays are organized so that those that are
functionally related are placed together;
Sequential Controls and displays are organized to reflect the order of their use
in a typical interaction (this may be especially appropriate in domains where a
particular task sequence is enforced, such as aviation).
Frequency controls and displays are organized according to how frequently
they are used, with the most commonly used controls being the most easily
accessible.
 Cont…

In addition to the organization of the controls and displays in relation to each other, the entire
system interface must be arranged appropriately in relation to the user’s position.
So, for example, the user should be able to reach all controls necessary and view all displays
without excessive body movement.
 The physical environment of the interaction

Ergonomics is concerned with the design of the work environment

itself.
Where will the system be used?
By whom will it be used?
Will users be sitting, standing or moving about?
 Again, this will depend largely on the domain and will be more critical
in specific control and operational settings than in general computer use.
However, the physical environment in which the system is used may
influence how well it is accepted and even the health and safety of its
users. It should therefore be considered in all design.
 Cont…

The first consideration here is the size of the users. Obviously this is
going to vary considerably. However, in any system the smallest user
should be able to reach all the controls (this may include a user in a
wheelchair), and the largest user should not be cramped in the
environment.
In particular, all users should be comfortably able to see critical
displays. For long periods of use, the user should be seated for comfort
and stability.
Seating should provide back support.
If required to stand, the user should have room to move around in order
to reach all the controls.
 Health Issues

Perhaps we do not immediately think of computer use as a hazardous activity

but we should bear in mind possible consequences of our designs on the health
and safety of users.
Leaving aside the obvious safety risks of poorly designed safety-critical
systems, there are a number of factors that may affect the use of more general
computers.
Again these are factors in the physical environment that directly affect the
quality of the interaction and the user’s performance:
Health issues
Physical position
Temperature
Lighting
Noise
Time
The use of color

Colors used in the display should be as distinct as possible and the

distinction should not be affected by changes in contrast. Blue should not be
used to display critical information. If color is used as an indicator it should
not be the only cue: additional coding information should be included.
The colors used should also correspond to common conventions and user
expectations.
Red, green and yellow are colors frequently associated with stop, go and
standby respectively.
Therefore, red may be used to indicate emergency and alarms; green,
normal activity; and yellow, standby and auxiliary function. These
conventions should not be violated without very good cause.
 Cont…

However, we should remember that color conventions are culturally

determined.
For example, red is associated with danger and warnings in most
western cultures,
in China it symbolizes happiness and good fortune.
red represents life (India)
The color of mourning is black in some cultures and white in others.
Awareness of the cultural associations of color is particularly important
in designing systems and websites for a global market.
 Interaction Styles

There are a number of common interface styles including

 Command line interface
Menus
 Natural language
 Question/answer and query dialog
Form-fills and spreadsheets
 WIMP
 Point and click
 Three-dimensional interfaces
 Command Line Interface

It provides a means of expressing instructions to the computer directly,

using function keys, single characters, abbreviations or whole-word commands.
 In some systems the command line is the only way of communicating with
the system, especially for remote access using telnet.
More commonly today it is supplementary to menu-based interfaces,
providing accelerated access to the system’s functionality for experienced users.
 Command Driven Interfaces

• Had to type in a command.

• The syntax had to be correct.
• Difficult for inexperienced users.
• Example above: Microsoft DOS, and UNIX.
• Advantages: Powerful, Quick, and Flexible.
• Disadvantages: Difficult, need experience, Syntax difficult to remember,
typing mistakes!
 Command Line Interfaces 1
Advantages
• Very flexible with the use of “switches” (options)

• Good for “expert”

users - can quickly
access commands

• Uses the fewest

system resources
 Command Line Interfaces 2
Disadvantages
• Requires the user to learn “complex” commands or language

• “Hidden” features i.e. if you don’t know the commands you

wont know the features are there!

• Not very good for novice users

 Menus

In a menu-driven interface, the set of options available to the user is displayed
on the screen, and selected using the mouse, or numeric or alphabetic keys.
Since the options are visible they are less demanding of the user, relying on
recognition rather than recall.
However, menu options still need to be meaningful and logically grouped to
aid recognition. Often menus are hierarchically ordered and the option required
is not available at the top layer of the hierarchy.
 Cont…

Grouping and naming of menu options then provides the only cue for
the user to find the required option. Such systems either can be purely
text based, with the menu options being presented as numbered choices
or may have a graphical component in which the menu appears within a
rectangular box and choices are made, perhaps by typing the initial letter
of the desired selection, or by entering the associated number, or by
moving around the menu with the arrow keys.
 Menu Driven Interfaces 1

Advantages
• No need to learn complex commands/language

• Easier for a novice

to learn/use

• Ideal when there are

a limited number of
options (efficient)
 Menu Driven Interfaces 2

Menu Driven Applications

• ATM
• Mobile Phone
• MP3 Player
• Video recorder
• Household Devices
• Digital/Cable TV
 Natural Language

• Normal speech recognised by a computer is Natural Language Interface. Talk to a computer

and it recognises what we want.
• Natural means human-like, and the technology is leaning towards getting computers to
behave
in a more natural way.
 Natural Language Interfaces 1

Advantages
• No training required – you just tell the computer what you
want to do!

• Can be quicker than keyboard entry

• Hands-free – could be invaluable in some environments

• Can be used by the disabled

 Natural Language Interfaces 2
Disadvantages

• Emerging technology – still contains “bugs”(inadequate future )

• Difficulty dealing with homonyms

• Difficult to recognise all the different ways of saying things (and
regional dialects)
• Artificial languages are often more precise
 The WIMP interface

The UNIX windowing environments are interesting as the contents of

many of the windows are often themselves simply command line or
character-based programs In fact, this mixing of interface styles in the
same system is quite common, especially where older legacy systems are
used at the same time as more modern applications.
However, HyperCard stack buttons look very like Macintosh folders. If
you double click on them, as you would to open a folder, your two mouse
clicks are treated as separate actions. The first click opens the stack (as you
wanted), but the second is then interpreted in the context of the newly
opened stack, behaving in an apparently arbitrary fashion!
 Icons
• Small picture or image
• Represents some object in the interface
– often a window or action
• Windows can be closed down
– small representation many accessible windows
• Icons can be many and various
– highly stylized
– realistic representations.
 Pointers
• important component
– WIMP style relies on pointing and selecting things
• uses mouse, track pad, joystick, trackball, cursor keys or keyboard
shortcuts
• wide variety of graphical images
 Menus

The last main feature of windowing systems is the menu, an interaction

technique that is common across many non-windowing systems as well. A
menu presents a choice of operations or services that can be performed by
the system at a given time.
We pointed out that our ability to recall information is inferior to our
ability to recognize it from some visual cue. Menus provide information
cues in the form of an ordered list of operations that can be scanned.
 Kinds of Menus
• Menu Bar at top of screen (normally), menu drags down
– pull-down menu - mouse hold and drag down menu
– drop-down menu - mouse click reveals menu
– fall-down menus - mouse just moves over bar!
• Contextual menu appears where you are
– pop-up menus - actions for selected object
– pie menus - arranged in a circle
• easier to select item (larger target area)
• quicker (same distance to any option) … but not widely used!
Menus (Pop Up)
Pull-down Menu
Drop-Down Menu
Fall-Down Menus
 The Context of the Interaction

We have been considering the interaction between a user and a system,
and how this is affected by interface design.
social and organizational factors may have on the user’s interaction with
the system.
In order to perform well, users must be motivated by.

• allegiance, ambition and self-satisfaction.

• quality of the work done, which leads to job satisfaction

 Cont…

The user may also lose motivation if a system is introduced that does not match the
actual requirements of the job to be done.
Often systems are chosen and introduced by managers rather than the users
themselves.
 In some cases the manager’s perception of the job may be based upon observation
of results and not on actual activity.
The system introduced may therefore impose a way of working that is unsatisfactory
to the users.
If this happens there may be three results:
• the system will be rejected,
• the users will be resentful and unmotivated, or
• the user will adapt the intended interaction to his own requirements
 Cont…

On the other hand, the introduction of new technology may prove to be
a motivation to users, particularly if it is well designed, integrated with the
user’s current work, and challenging.
Providing adequate feedback is an important source of motivation for
users.
• End!!!