1

Human-Computer Interaction
Introduction to HCI




Aida Azmila Azmi
JTMK

FROM THE ORIGINAL VERSION OF :

Alexiei Dingli
adingli@stmartins.edu

2
What is HCI?
The study of how people interact with
computers and to what extent computers
are or are not developed for successful
interaction with human beings.

3
What is HCI?

Human-computer interaction is a discipline
concerned with the design, evaluation and
implementation of interactive computing
systems for human use and with the study of
major phenomena surrounding them

(ACM SIGCHI definition of HCI).
4
Creating usable systems (1)

HCI investigates interaction between
Human (1 user, a group, sequence of users)
Computer (any computer big or small, process
control, embedded, etc)

used to perform various tasks

in particular environments.


5
Creating usable systems (2)
The human factors

different users
different conceptions or mental models about
their interactions
different ways of learning, keeping knowledge
and skills
cultural and national differences
user preferences change as they gradually
master new interfaces
6
Creating usable systems (3)
The computer factor

different devices
Smart phones, Touch Screen Kiosks,
different capabilities and limitations
Computing power, Input/output devices,
different operating systems
user interface technology is changing rapidly
it offers new interaction possibilities to which
previous research findings may not apply
Visual, Tactile, Gesture based,
7
Creating usable systems (4)
What about the interaction?

Communication between user and computer

Direct interaction
Dialogue with feedback
Control throughout performance of the task

Indirect interaction
Batch processing
Intelligent sensors controlling the environment
8
Creating usable systems (5)

It aims to achieve

1. Usability (Useful, Usable, Used)
2. Safe
3. Effective
4. Efficient
5. Enjoyable system


9
Creating usable systems (6)
User compatibility
Product compatibility
Task compatibility
Work flow
compatibility
Consistency
Familiarity
Simplicity
Control
WYSIWYG
Flexibility
Responsiveness
Invisible
Technology
Robustness
Protection
Ease of Learning
and Use

10
Creating usable systems (7)
HCI focuses on user needs by assessing
interface design & implementation
according to usability criteria.

Makes use of new, novel techniques &
technologies.

It applies usability design principles to
achieve more productive & usable systems
and more satisfied users.


11
Creating usable systems (8)
EC Directive 90/270/EEC

Requires employers to ensure the following
when designing, selecting, commissioning or
modifying software:

suitable for the task
easy to use
where appropriate, adaptable to users knowledge
& experiences
12
Creating usable systems (9)
provides feedback on performance
displays information in a format & at a pace that is
adapted to the user
It must conform to the principles of software
ergonomics
(Ergonomics is the science that deals with the interaction between
people/work/environment/psychology. It considers the functions of the human body in the
design of tools, equipment, etc.)
Designers & employers can no longer afford to
ignore the user!!
13
Question
Have you ever used a system that exhibit good
HCI with the users?
Give a few examples

What systems have you used that exhibit bad
HCI with the users?
Name a few and why do you think they were
bad?

14
Historical basis of HCI (1)
Second World War
Study of interaction between
humans & machines in order to
produce more effective weapons
(Bletchley Park, Enigma,
Colossus)

Ergonomic Research Society
formed (1949)

Research in Man-Machine
Interaction began to spread

15
Historical basis of HCI (2)
16
Historical basis of HCI (3)
17
Historical basis of HCI (4)
18
Basic Interaction (1)
Graphical Objects
1963 (MIT)
Graphical Objects manipulated by a pointing device (light
pen)
Objects could be selected, moved, resized, etc.
1966 (Imperial College, London)
Icons, Gesture Recognition, Dynamic Menus, etc.
1970 (XEROX PARC)
Object selection and manipulation
WYSIWYG


19
Basic Interaction (2)
Mouse
1965 (Stanford Research Lab [SRI])
Created to be a cheap replacement for light pens
1970
Adopted at Xerox PARC

First appeared commercially as part of
The Xerox Star (1981),
The Apple Lisa (1982),
The Apple Macintosh (1984).


20
Basic Interaction (3)
Windows
1968 (Stanford Research Lab [SRI])
1969 - 1974 (Xerox PARC)
Smalltalk System
1974 (MIT)
EMACS Text Editor
1981 (Xerox PARC)
The Cedar Window Manager
1981 Xerox Star
1982 Apple Lisa
1983 (Carnegie Mellon University funded by IBM))
Andrew window manager
1984 Apple Macintosh

The early versions of the Star and Microsoft
Windows were tiled, but eventually they supported
overlapping windows like the Lisa and Macintosh.

21
Applications (1)
Drawing programs
uses a mouse for graphics (1965)
uses a tablet (1971)
handling of lines and curves (1975)
Text Editing
first word processor with automatic word wrap, search &
replace, user-definable macros, scrolling text, & commands
to move, copy, and delete characters, words, or blocks of
text (1962)
screen editing & formatting of arbitrary-sized strings with a
lightpen (1967)
mouse-based editing (1968)
first WYSIWYG editor-formatter (1974)
22
Applications (2)
Spreadsheets
initial spreadsheet was VisiCalc (1977-8) for the Apple II
HyperText
the idea where documents are linked to related documents
(1945)
Ted Nelson coined the term "hypertext" (1965)
NLS system was one of the first on-line journals, and it
included full linking of articles (1970)
HyperCard from Apple (1988) significantly helped to bring
the idea to a wide audience
Tim Berners-Lee used the hypertext idea to create the
World Wide Web in 1990 at the government-funded
European Particle Physics Laboratory (CERN)
Mosaic, the first popular hypertext browser for the World-
Wide Web
23
Eg: Cosmic Book

24
Applications (3)
Computer Aided Design (CAD)
first CAD systems similar to drawing programs (1963)
pioneering work on interactive 3D CAD system (1963)
first CAD/CAM (manufacture) system in industry was
probably General Motor's DAC-1 (about 1963)

Video Games
first graphical video game was probably SpaceWar (1962)
the first computer joysticks (1962)
early computer adventure game was created (1966)
first popular commercial game was Pong (about 1976).
25
Up & Coming Areas (1)
Gesture Recognition
first pen-based input device used light-pen gestures (1963)
first trainable gesture recognizer (1964)
a gesture-based text editor using proof-reading symbols
(1969)
gesture recognition has been used in commercial CAD
systems since the 1970s
came to universal notice with the Apple Newton (1992)
Multi-Media
multiple windows with integrated text and graphics (1968)
Interactive Graphical Documents project was the first
hypermedia system which used raster graphics and text
(1979-1983)
Diamond project explored combining multimedia (text,
spreadsheets, graphics, speech) (1982)
26
Up & Coming Areas (2)
3-D
first system 3-D CAD system (1963)
first interactive 3-D system used for molecular modelling
(1966)
the late 60's and early 70's saw the flowering of 3D raster
graphics funded by the government
the military-industrial flight simulation work of the 60's - 70's
led the way to making 3-D real-time
Virtual Reality
original work on VR funded by Air Force (1965-1968)
study of force feedback, early research on head-mounted
displays and on the DataGlove (1971)
27
Up & Coming Areas (3)
Computer Supported Cooperative Work
remote participation of multiple people at various
sites (1968)
Electronic mail, still the most widespread multi-user
software, was enabled by the ARPAnet (1969)
and by the Ethernet from Xerox PARC (1973)
an early computer conferencing system (1975)
Natural language and speech
Speech synthesis
Speech recognition
28
HCI as a business necessity
Can the users be ignored? (Linux, Windows,)
NO
HCI + Usability engineering are a crucial business
necessity
Good Interface & Interaction Design should not
Be added after system is built
Supporting users is an integral part of the design.
To do this one must consider
International Standards in HCI and Ergonomics
User population is growing (size, diversity, etc.)
Expanding awareness amongst users of what can be
achieved


29
Safety-critical systems (1)
Poor designs
Very common in
Safety
Life-critical
Which all depend on computer-control
We need to understand why
Disasters
Accidents
Frustrations
happen?
Can you mention some examples?
30
Safety-critical systems (3)
Air-traffic control
Aircraft crash due to problems pilot had to interpret
information on cockpit display

Manned spacecraft
On June 4, 1996, the maiden flight of the European
Ariane 5 launcher crashed about 40 seconds after
takeoff. Media reports indicated that the amount lost
was half a billion dollars. The error came from a
piece of the software that was not needed during
the crash!!

31
Safety-critical systems (4)
Nuclear power plant (The Meltdown at Three
Mile Island 1979)
As alarms rang and warning lights flashed, the
operators did not realize that the plant was
experiencing a loss-of-coolant accident. They took
a series of actions that made conditions worse by
simply reducing the flow of coolant through the
core.
Medical Institutions
Break down in the scheduling system led to delays
in reaching seriously ill patients. (UK)
32
Disaster examples
1988
USS Vincennes shot down an Iran Air A300 Airbus
with 290 people aboard
Aegis weapon system had
Sophisticated software to identify potential threats
BUT
Was unable to provide up-to-date altitude information on
its large display (this could be read from other screens)
In the confusion, the Airbus which leveled off at
12,500 feet was taken to be an F-14 fighter
descending to attack!
33
User Hostile example
Poor HCI can lead to User Hostile systems rather
than User Friendly ones

John has a stereo system with a matched set of
components made by the same manufacturer: a receiver,
a CD player, and a cassette deck, stacked in that order.
They all have the on/off button on the left side. Every time
John goes to turn off all three components, he presses
the top left button on the receiver, which turns it off; then
he presses the top left button on the CD player, which
turns it off; then, naturally, he presses the top left button
on the cassette deck -- which pops open the cassette
door.
34
Its obvious
It seems "obvious" that the manufacturer could
have improved the interface
putting all three buttons in the same location

But it clearly wasn't obvious to the system's
designers!!

Most actions used to accomplish tasks with an
interface are quite obvious to people who know
them, including, of course, the software designer.
But the actions are often not obvious to the first-
time user.
35
Another example
Imagine a first-time user of a computer
1. he has been shown how to login to the system
2. has done some work
3. is now finished with the computer for the day

Experienced computer users will find it obvious that a logout
command is needed.

But it may not occur to first-time users that a special action is
required to end the session.
People don't "log out" of typewriters or televisions or video games, so
why should they log out of computers?

Learning to predict problems like these by taking the user's
point of view is a skill that requires practice.
36
Who studies HCI? (1)
Multi-discipline field

Psychology +
Cognitive Science
Knowledge of users
perceptual, cognitive &
problem-solving skills

Sociology Understand Interaction

Computer Science +
Engineering
Build the necessary
technology

Business Market the product
37
Who studies HCI? (2)
Ergonomics Users physical capabilities
Graphic Design Produce effective interaction
presentation

Technical Writing Produce the manuals and
documentations
38
Conclusion (1)
HCI studies

Interaction between users & computer systems

In order to build systems which are:
Usable
Safe
Efficient
Effective
Enjoyable
39
Conclusion (2)
Important points to keep in mind

1. You need a lot of common sense
2. You must be ready to accept criticism
3. Think user
4. Try it out (They know what they want!)
5. Involve the users
6. Iterate



40
Exercise
If we take a toaster ...
Describe:
the users the machine seems to be designed for;
the tasks and subtasks the machine was evidently
designed to support;
the "interface" part of the machine;
the part of the machine that is NOT the interface.

What about an electric drill ...