CSM 357

Human-Computer Interaction
lecture 3: Interaction models in Human-Computer Interaction

R O S E - M A RY O W U S U A A M E N S A H G Y E N I N G ( P H D )

1
 Human Computer Interaction

In this section, we will consider the communication

between user and system: the interaction.

We will look at some models of interaction that enable

us to identify and evaluate components of the interaction,
and at the physical, social and organizational issues

2
Models

the usefulness ofmodels to help

us to understand complex behavior and
complex systems.

3
What is interaction?

communication

user system
 Interaction
 Interaction involves at least two participants: the user and
the system.

 Both are complex, and are very different from each other
in the way that they communicate and view the domain and
the task.
 The interface must therefore effectively translate
between them to allow the interaction to be successful.
5
 Interaction
This translation can fail at a number of points and for a number of reasons.
The use of models of interaction can:

1. help us to understand exactly what is going on in the interaction and

identify the likely root of difficulties.

2. They also provide us with a framework to compare different interaction

styles and to consider interaction problems.
eg. of interaction styles: command line, menus, form filling, question and
answer

6
Some terms of interaction
o domain – an area of expertise and knowledge in some real-
world activity e.g. graphic design
o goal – what you want to achieve
e.g. create a solid red triangle
o task – how you go about doing it
ultimately in terms of operations or actions
e.g. … select fill tool, click over triangle
 Interaction models
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.
.
8
 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 human user and computer.

1. The user formulates a plan of action, which is then executed at the computer
interface.

2. When the plan, or part of the plan, has been executed, the user observes the
computer interface to evaluate the result of the executed plan, and to
determine further actions.

9
 The
Norman’s model of interaction:
execution–evaluation cycle
The Norman’s model 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:

10
 Stages in Norman’s model of interaction
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.

11
 Stages in Norman’s model of interaction (Simplified)

goal
execution evaluation
system

Each stage is an activity of the user.

First the user forms a goal. This is the user’s notion of what needs to be done
and is framed in terms of the domain, in the task language.

12
 Stages in Norman’s model of interaction (Simplified)

goal
execution evaluation
system

It is liable to be imprecise and therefore needs to be translated into the more

specific intention, and the actual actions that will reach the goal, before it can
be executed by the user.

13
Stages in Norman’s model of interaction (Simplified)
goal
execution evaluation
system

The user perceives the new state of the system, after execution of the action sequence,
and interprets it in terms of his expectations.

If the system state reflects the user’s goal then the computer has done what he
wanted and the interaction has been successful; otherwise the user must formulate a
new goal and repeat the cycle.
14
 Practical example: Norman’s model of interaction
Norman uses a simple example of switching on a light to illustrate this cycle.
1. Imagine you are sitting reading as evening falls. You decide you need more light;
that is you establish the goal to get more light.
2. From there you form an intention to switch on the desk lamp,
3. and you specify the actions required, to reach over and press the lamp switch. If
someone else is closer, the intention may be different. You may ask them to switch
on the light for you. Your goal is the same but the intention and actions are different.
4. When you have executed the action
5. you perceive the result, either the light is on or it isn’t

15
 Practical example: Norman’s model of interaction

example of switching on a light cont’d

6. you interpret the results, based on your knowledge of the world.

For example, if the light does not come on you may interpret this as indicating the
bulb has blown or the lamp is not plugged into the mains, and you will formulate
new goals to deal with this.
7. If the light does come on, you will evaluate the new state according to the
original goals. Is there now enough light?
If so, the cycle is complete. If not, you may formulate a new intention to switch on
the main ceiling light as well.
16
Why some interfaces cause problems to their users

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 user and the system do not use the same terms to describe the domain
and goals
◦ (we called the language of the system the core language and the
language of the user the task language.)

17
 Gulf of Execution
The gulf of execution is the difference For example, a person can look at a light
between the user’s formulation of the switch and easily tell what the current
actions to reach the goal and the actions state of the system is (i.e., whether the
allowed by the system. light is on or off) and how to operate the
switch.
If the actions allowed by the system
correspond to those intended by the user,
the interaction will be effective.
This means that the gulf of execution is
The interface should therefore aim to small. Norman states that, in order to
reduce this gulf. design the best interfaces, the gulf must be
kept as small as possible.

18
 Gulf of Evaluation
Gulf of evaluation is the degree of ease with which a user can perceive and
interpret whether or not the action they performed was successful.
This gulf is small when the system provides information about its state in a form that
is easy to receive, interpret, and matches the way the person thinks of the system.
An example of a large gulf of evaluation is when an application has a spinning
wheel to show a “loading” state after the user performs an action. The wheel alone is
not enough for the user to interpret the progress that the system is making in
response to their action. The gulf can be shortened by having a loading bar instead.

19
 Gulf of Evaluation
The gulf of evaluation is the distance between the physical presentation of
the system state and the expectation of the user.

If the user can readily evaluate the presentation in terms of his goal, the
gulf of evaluation is small.

The more effort that is required on the part of the user to interpret the
presentation, the less effective the interaction.

20
 Individual activity
1. Pick an activity from your regular life that you perform with a computing device.
For this activity, there should be some struggles with a large gulf of execution or
gulf of evaluation, especially due to a weakness of the interface (software or
hardware) involved in the activity.
First, describe what makes that gulf wide. What are the failures of the current
interface to bridge the gulf?
2. Then, select a similar activity from your regular life that does a better job
bridging its gulf of execution or gulf of evaluation.
Briefly describe that activity and what gives it a narrower gulf, then describe
what lessons could be borrowed from the second activity to resolve the wide
gulf in the first activity.
21
Individual activity
In selecting the activities, we recommend specifically selecting activities in
similar domains. For example, you might select two appliances in your
kitchen, or two mobile apps that do the same time

Adapted from http://omscs6750.gatech.edu/summer-2017/assignment-p1/

22
Human errors- Slips or Mistakes

23
 Human errors- Slips or Mistakes

Slip
• understand system and goal
• correct formulation of action
• incorrect action
Mistake
• may not even have right goal!
Fixing things?
slip – better interface design
mistake – better understanding of system

24
 Shortfalls of Norman’s model

Norman’s model is a useful means of understanding the interaction, in a way that is

clear and intuitive. It allows other, more detailed, empirical and analytic work to be
placed within a common framework.

However, it only considers the system as far as the interface. It concentrates wholly
on the user’s view of the interaction.
It does not attempt to deal with the system’s communication through the
interface.
An extension of Norman’s model, proposed by Abowd and Beale, addresses this
problem
25
 Abowd and Beale’s Interaction framework
The interaction framework attempts a more
realistic description of interaction by
including the system explicitly, and breaks
it into four main components, as shown in
Figure 2.

The nodes represent the four major

components in an interactive system: the
System, the User, the Input and the
Output.

Each component has its own language.

26
Figure 2
 Abowd and Beale’s Interaction framework
In addition to the User’s task language and the
System’s core language, which we have already
introduced, there are languages for both the Input
and Output components.
Input and Output together form the Interface.
As the interface sits between the User and the
System, there are four steps in the interactive cycle,
each corresponding to a translation from one
component to another, as shown by the labeled arcs
in the Figure on this slide

27
 Abowd and Beale’s Interaction framework
The User begins the interactive cycle with the
formulation of a goal and a task to achieve that
goal.

The only way the user can manipulate the

machine is through the Input, and so the task
must be articulated within the input language.

28
 Abowd and Beale’s Interaction framework
The input language is translated into the
core language as operations to be
performed by the System.

The System then transforms itself as

described by the operations; the execution
phase of the cycle is complete and the
evaluation phase now begins.
The System is in a new state, which must
now be communicated to the User.

29
 Abowd and Beale’s Interaction framework

The current values of system attributes are

rendered as concepts or features of the Output.

It is then up to the User to observe the

Output and assess the results of the
interaction relative to the original goal,
ending the evaluation phase and, hence, the
interactive cycle.

30
 Frameworks and HCI
As well as providing a means of discussing the details of a particular interaction,
frameworks provide a basis for discussing other issues that relate to the
interaction.
The ACM SIGCHI (The Association for Computing Machinery Special Interest
Group on Computer-Human Interaction) Curriculum Development Group
presents a framework similar to that presented on earlier slides, and uses it to
place different areas that relate to HCI

In Figure 3 on the next slide shows how different aspects relate to the
interaction framework

31
 A framework for human–computer interaction. Adapted from
ACM SIGCHI Curriculum Development Group
the field of ergonomics addresses issues on the
user side of the interface, covering both input
and output, as well as the user’s immediate
context.
dialog is most usually associated with the
computer and so is biased to that side of the
framework.
Presentation and screen design relates to the
output branch of the framework.
Each of these areas has important
implications for the design of interactive
systems and the performance of the user Figure 3

32
 ERGONOMICS
Ergonomics (or human factors) is traditionally the study of the physical
characteristics of the interaction: how the controls are designed, the physical
environment in which the interaction takes place, and the layout and physical
qualities of the screen.
Ergonomics is a large and established field, which is closely related to but distinct
from HCI, and full coverage would demand a course in its own right
However, let us consider some of the issues addressed by ergonomics relating to
HCI
We will look at the arrangement of controls and displays, the physical
environment, health issues and the use of color.

33
 Ergonomics: Arrangement of controls and displays
 Sets of controls and parts of the display should be grouped logically to allow rapid
access by the user
 This may not seem so important when we are considering a single user of a
spreadsheet on a PC, but it becomes vital when we turn to safety-critical
applications such as plant control, aviation and air traffic control.

 In each of these contexts, users are under pressure and are faced with a huge
range of displays and controls.

 Therefore, it is crucial that the physical layout of these are appropriate.

34
 Ergonomics: Arrangement of controls and displays

 Even for less critical PC application, inappropriate placement of controls and

displays can lead to inefficiency and frustration.
 For example, on a particular electronic newsreader, the command key to read
articles from a newsgroup (y) is directly beside the command key to unsubscribe
from a newsgroup (u) on the keyboard.
 This poor design frequently leads to inadvertent removal from newsgroups.
Although this is recoverable it wastes time and is annoying to the user.
 We can therefore see that appropriate layout is important in all applications.
 It is important to group controls together logically (and keeping opposing
controls separate).

35
 Ergonomics: Arrangement of controls and displays
The exact arrangement of controls will depend on the domain and the
application, but possible arrangements 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.

36
 Ergonomics: Arrangement of controls and displays
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.
Critical displays should be at eye level.

Lighting should be arranged to avoid glare and reflection, distorting displays.

Controls should be spaced to provide adequate room for the user to manoeuvre.

37
 Ergonomics: The physical environment of the interaction

As well as addressing physical issues in the layout and arrangement of the machine
interface, ergonomics is also 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 designs.
38
Ergonomics: The physical environment of the interaction

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.

39
Ergonomics: The physical environment of the interaction
bear in mind the possible consequences of our designs on the health and
safety of users.
obvious safety risks of poorly designed safety-critical systems(aircraft crashing,
nuclear plant leaks and worse),
there are a number of factors that may affect the use of more general computers.
◦ Physical position
◦ Temperature
◦ Lighting
◦ Noise
◦ Time
40
Ergonomics: The use of colour

the use of colour in displays is an ergonomics issue.

Colours 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.

41
Ergonomics: The use of colour

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.

42
 Ergonomics: The use of colour
However, colour conventions are culturally determined.

For example, red is associated with danger and warnings in most western
cultures, but in China it symbolizes happiness and good fortune.

The colour of mourning is black in some cultures and white in others.

Awareness of the cultural associations of colour is particularly important

in designing systems and websites for a global market.
43
 Interaction styles

Interaction can be seen as a dialog between the computer and the user.

The choice of interface style can affect the interaction in positive or negative
ways.

44
 Interaction styles

There are a number 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.

45
 Command Line Interface

The command line interface was the first interactive dialog style to be commonly
used and, in spite of the availability of menu-driven interfaces, it is still widely
used.

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

function keys, single characters, abbreviations or whole-word commands.
More commonly today, it is supplementary to menu-based interfaces,
providing accelerated access to the system’s functionality for experienced
users.

46
 Command Line Interface (Pros)
1. Command line interfaces are powerful in that they offer direct access to
system functionality (as opposed to the hierarchical nature of menus)

2. They are also flexible: the command often has a number of options or
parameters that will vary its behavior in some way, and it can be applied to
many objects at once, making it useful for repetitive tasks

Read more on the advantages of command line interface

47
 Command Line Interface (Cons)
1. Commands must be remembered, as no cue is provided in the command
line to indicate which command is needed.

2. They are therefore better for expert users than for novices.

3. commands are sometimes obscure and vary across systems, causing

confusion to the user and increasing the overhead of learning.

Read more on the disadvantages of command line interface

48
 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.
 naming of menu options cues for the user to find the required option.
 Such systems either can be purely text based, or may have a graphical
component
49
 Text-based vs graphics-based
menus
With text-based menus, with the menu With Graphics-based menus, menus
options are presented as numbered appears within a rectangular box and
choices 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 or mouse.

Example of text-based menu

50
 Natural Language
Perhaps the most attractive means of communicating with computers, at least at
first glance, is by natural language.

Users, unable to remember a command or lost in a hierarchy of menus, may

long for the computer that is able to understand instructions expressed in
everyday words!
Natural language understanding, both of speech and written input, is the subject of
much interest and research currently.
Unfortunately, however, the ambiguity of natural language makes it very difficult
for a machine to understand.

51
 The ambiguity of natural language
Eg. Consider the sentence: The boy hit the dog with the stick

we cannot be sure whether the boy is using the stick to hit the dog or
whether the dog is holding the stick when it is hit.

Even if a sentence’s structure is clear, we may find ambiguity in the

meaning of the words used.
For example, the word ‘pitch’ may refer to a sports field, a throw, a
waterproofing substance or even, colloquially, a territory.

52
 The ambiguity of natural language
 We often rely on the context and our general knowledge to sort out these
ambiguities. This information is difficult to provide to the machine.
 Given these problems, it seems unlikely that a general natural language interface
will be available for some time.
 However, systems can be built to understand restricted subsets of a language.
 For a known and constrained domain, the system can be provided with sufficient
information to disambiguate terms.
 It is important in interfaces which use natural language in this restricted form that
the user is aware of the limitations of the system and does not expect too much
understanding.
53
 Question/answer and query dialog
Question and answer dialog is a simple mechanism for providing input to an
application in a specific domain.
The user is asked a series of questions (mainly with yes/no responses, multiple
choice, or codes) and so is led through the interaction step by step.
An example of this would be web questionnaires.
These interfaces are easy to learn and use, but are limited in functionality and
power.
As such, they are appropriate for restricted domains (particularly information
systems) and for novice or casual users.

54
 Question/answer and query dialog

Query languages, on the other hand, are used to construct queries to retrieve
information from a database.
They use natural-language-style phrases, but in fact require specific syntax, as
well as knowledge of the database structure.
Queries usually require the user to specify an attribute or attributes for which to
search
the database, as well as the attributes of interest to be displayed.

This is straightforward where there is a single attribute, but becomes complex

when multiple attributes are involved
55
 Form-fills and spreadsheets
Form-filling interfaces are used primarily for data entry but can also be useful in
data retrieval applications.
The user is presented with a display resembling a paper form, with slots to fill in.
Often the form display is based upon an actual form with which the user is
familiar, which makes the interface easier to use.

The user works through the form, filling in appropriate values.

The data is then entered into the application in the correct place.

56
 Form-fills and spreadsheets

Spreadsheets are a sophisticated variation of form filling.

The spreadsheet comprises a grid of cells, each of which can contain a value or a
formula.

The formula can involve the values of other cells

57
 The WIMP interface
Currently many common environments for interactive computing are
examples of the WIMP interface style, often simply called windowing
systems.
WIMP stands for windows, icons, menus and pointers (sometimes
windows, icons, mice and pull-down menus), and is the default interface
style for the majority of interactive computer systems in use today,
especially in the PC and desktop workstation arena.

Examples of WIMP interfaces include Microsoft Windows, MacOS

and many other software interfaces

58
 Point-and-click interfaces
In most multimedia systems and in web browsers, virtually all actions take only a
single click of the mouse button.

◦ You may point at a city on a map and when you click a window opens, showing
you tourist information about the city.

◦ You may point at a word in some text and when you click you see a definition of
the word. You may point at a recognizable iconic button and when you click
some action is performed.
This point-and-click interface style is obviously closely related to the WIMP style.

59
 Point-and-click interfaces
It clearly overlaps in the use of buttons, but may also include other WIMP
elements.
However, the philosophy is simpler and more closely tied to ideas of
hypertext.
In addition, the point-and-click style is not tied to mouse-based interfaces, and is
also extensively used in touchscreen information systems.
The point-and-click style has been popularized by world wide web pages, which
incorporate all the above types of point-and-click navigation: highlighted words,
maps and iconic buttons.

60
 Three-dimensional interfaces
There is an increasing use of three-dimensional effects in user interfaces.

The most obvious example is virtual reality, but VR is only part of a range
of 3D techniques available to the interface designer.

The simplest technique is where ordinary WIMP elements, buttons, scroll

bars, etc., are given a 3D appearance using shading, giving the appearance
of being sculpted out of stone.

61
Summary
 Interaction models help us to understand what is going on in the interaction
between user and system. They address the translations between what the
user wants and what the system does.
 Ergonomics looks at the physical characteristics of the interaction and how
these influence its effectiveness.
 The dialog between user and system is influenced by the style of the
interface.
 The interaction takes place within a social and organizational context that
affects both user and
 system.
62
63
 THANK YOU

1/29/2025
64