CSM 357
Human-Computer Interaction
lecture 1
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
1
INTRODUCTION TO HCI
Human–computer interaction (HCI) is a cross-disciplinary area:
◦ (e.g., engineering, psychology, ergonomics, design)
◦ that deals with the theory, design, implementation, and evaluation of the ways
that humans use and interact with computing devices.
2
Definition of HCI
Human Computer Interactions (HCI) is concerned with designing, evaluating and deploying usable,
effective technologies in a range of contexts - be it home, office, school, cyberspace or other domain.
Human Computer Interaction is a discipline concerned with the design, evaluation and implementation of
interactive computer systems for human use and with the study of major phenomena surrounding them
HCI has become much more important in recent years as computers (and embedded devices) have become
commonplace in almost all facets of our lives.
3
Human-Computer Interaction : The Human
As its name implies, HCI consists of three parts:
1. the user,
2. the computer,
3. and the ways they work together.
4
Human-Computer Interaction : The Human
A user is an individual user or a group of users working together.
It is important to appreciate the way people's sensory systems (sight, hearing, touch) relay
information.
Also, different users form different conceptions or mental models about their interactions and have
different ways of learning and keeping knowledge.
In addition, cultural and national differences play an important part in individual differences.
5
Human-Computer Interaction : The Computer
Computers refer to any technology ranging from smart phones, embedded
systems, desktop computers, to large scale computer systems.
6
Human Computer Interaction : The Interaction
There are obvious differences between humans and machines.
In spite of these, HCI attempts to ensure that they both get on with each other and interact
successfully.
In order to achieve a usable system, you need to apply what you know about humans and
computers, and consult with likely users throughout the design process.
7
Goals of HCI
The goals of HCI are to produce usable and safe systems, as well as functional systems.
In order to fulfill that, developers must attempt to:
Understand how people use technology
Building suitable systems
Achieve efficient, effective, and safe interaction
8
Goals of HCI
At physical level, HCI concerns selecting the most appropriate input devices and output devices
for a particular interface or task
Determine the best type of interaction, such as direct manipulation, natural language, icons, menus
9
Goals of HCI
For systems that include computers, develop or improve
Safety
Utility
Effectiveness
Efficiency
Usability
Appeal
10
What is HCI? : Lamp Case study
Function/objective: to illuminate the environment
◦ Interface: power switch button
◦ Functional part: light bulb
◦ Interaction: press “On”, light on;
press “Off”, light off
◦ User tasks: turn on the lamp, turn off the lamp
11
What is HCI? : Word processor: case study
Objective: to edit a document
Interface: windows, icons, menus, etc.
Functional part: sub-routines for command execution, file handling, etc.
Interaction: use mouse to click the “save” icon,
use mouse to click “FILE” icon, …
User tasks: edit file, save file, etc.
12
Good and poor design choices
Wine glass: Is this a good or poor design choice?
13
Good and poor design choices
14
Good and poor design choices
WHICH OF THE TWO EGG SEPARATORS WILL YOU CHOOSE AND WHY?
15
Examples of bad design
16
Examples of bad design
17
Examples of bad design
18
Examples of bad design
19
Examples of bad design
20
Importance of HCI: real world examples
1. If the video does not record a TV program because we pressed the wrong button, we are
likely to feel angry.
2. a pilot shuts down the wrong engine and the plane crashes. This may lead of loss of
many lives
21
To avoid bad design choices
Take into account
–who the users are
–what activities are being carried out
–where the interaction is taking place
And then Optimise the interactions users have with products such that they match users’ activities and needs
22
Multidisciplinary nature of HCI
Human-Computer Interaction (HCI) is a multidisciplinary
field which combines the theories and practices from a
number of fields including:
computer science,
cognitive and behavioral psychology,
anthropology,
sociology,
q ergonomics,
industrial design, and more
23
History of HCI: Paper Discussion
Brad A. Myers. "A Brief History of Human Computer Interaction Technology." ACM
interactions. Vol. 5, no. 2, March, 1998. pp. 44-54.
Approximate time lines showing where work was performed on some major technologies 24
History of HCI: Paper Discussion (Excepts)
Brad A. Myers. "A Brief History of Human Computer Interaction Technology." ACM interactions. Vol. 5, no. 2, March, 1998. pp.
44-54.
Direct Manipulation of graphical objects:
The now ubiquitous direct manipulation interface, where visible objects on the screen are directly
manipulated with a pointing device, was first demonstrated by Ivan Sutherland in Sketchpad, which
was his 1963 MIT PhD thesis.
SketchPad supported the manipulation of objects using a light-pen, including grabbing objects,
moving them, changing size, and using constraints. The system was built at Lincoln Labs with
support from the Air Force and NSF
25
History of HCI: Paper Discussion (Excepts)
Brad A. Myers. "A Brief History of Human Computer Interaction Technology." ACM interactions. Vol. 5, no. 2, March,
1998. pp. 44-54.
Direct Manipulation of graphical objects:
David Canfield Smith coined the term "icons" in his 1975 Stanford PhD thesis on Pygmalion (funded
by ARPA and NIMH) and Smith later popularized icons as one of the chief designers of the Xerox Star
Many of the interaction techniques popular in direct manipulation interfaces, such as how objects and
text are selected, opened, and manipulated, were researched at Xerox PARC in the 1970's.
In particular, the idea of "WYSIWYG" (what you see is what you get) originated there with systems
such as the Bravo text editor and the Draw drawing program
26
History of HCI: Paper Discussion (Excepts) Brad A. Myers. "A Brief History of Human Computer
Interaction
Direct Manipulation of graphical objects:
The first commercial systems to make extensive use of Direct Manipulation were
the Xerox Star (1981) , the Apple Lisa (1982) and Macintosh (1984)
Image source:https://www.thocp.net/hardware/xerox_star.htm
27
History of HCI: Paper Discussion (Excepts) Brad A. Myers. "A Brief History of Human Computer Interaction
Xerox Star
The Xerox Star workstation, officially named Xerox
8010 Information System, was the first commercial
personal computer to incorporate technologies that have
since become standard in personal computers including:
◦ a bitmapped display,
◦ a window-based graphical user interface,
◦ icons,
◦ folders,
◦ mouse (two-button),
◦ Ethernet networking,
The Xerox Star workstation ◦ file servers,
◦ print servers, and
Image source:https://www.thocp.net/hardware/xerox_star.htm
◦ e-mail
28
History of HCI: Paper Discussion (Excepts) Brad A. Myers. "A Brief History of Human Computer Interaction
Apple Lisa (1982)
Lisa is a desktop computer developed by Apple,
released on January 19, 1983.
It is one of the first personal computers to present
a graphical user interface (GUI) in a machine
aimed at individual business users
Image source:https://www.macstories.net/mac/the-lisa/
29
History of HCI: Paper Discussion (Excepts) Brad A. Myers. "A Brief History of Human Computer Interaction
Macintosh (1984)
The Macintosh (mainly Mac since 1998) is a family of
personal computers designed, manufactured, and sold by
Apple Inc. since January 1984.
The original Macintosh is the first successful mass-
market personal computer to have featured a graphical
user interface, built-in screen, and mouse
Image source: https://appleinsider.com/articles/19/01/24/apple-
launched-macintosh-on-january-24-1984-and-changed-the-world----
eventually 30
History of HCI: Paper Discussion (Excepts) Brad A. Myers. "A Brief History of Human Computer Interaction
Windows
The Mouse Multiple tiled windows were demonstrated in Engelbart's NLS
in 1968.
The mouse was developed at Stanford Research
Laboratory to be a cheap replacement for light-
pens, which had been used at least since 1954 Early research at Stanford on systems like COPILOT (1974)
and at MIT with the EMACS text editor (1974) also
demonstrated tiled windows.
It first appeared commercially as part of the Xerox
Star (1981), the Three Rivers Computer Company's Alan Kay proposed the idea of overlapping windows in his
PERQ (1981), the Apple Lisa (1982), and Apple 1969 University of Utah PhD thesis
Macintosh (1984).
The main commercial systems popularizing windows were the
Xerox Star (1981), the Apple Lisa (1982), and most
importantly the Apple Macintosh (1984
Assignment: What are the differences between tiled windows and overlapping windows?
Highlight the advantages and disadvantages of each
31
History of HCI: Paper Discussion (Excepts) Brad A. Myers. "A Brief History of Human Computer Interaction
Application types
Drawing programs: Much of the current technology was demonstrated in Sutherland's 1963 Sketchpad
system. The use of a mouse for graphics was demonstrated in NLS (1965)
Word processors: In 1962 at the Stanford Research Lab, Engelbart proposed, and later implemented, a
word processor with automatic word wrap, search and replace, user-definable macros, scrolling text, and
commands to move, copy, and delete characters, words, or blocks of text
Spreadsheets: The initial spreadsheet was VisiCalc which was developed by Frankston and Bricklin
(1977-8) for the Apple II while they were students at MIT and the Harvard Business School.
HyperText: The idea for hypertext (where documents are linked to related documents) is credited to
Vannevar Bush's famous MEMEX idea from 1945. Ted Nelson coined the term "hypertext" in 1965. Tim
Berners-Lee used the hypertext idea to create the World Wide Web in 1990
32
Other Major technologies in HCI history
Computer Aided Design Virtual and Augmented Reality
Video games Natural language processing
Gesture recognition Wearable Affective Computing
Multimodal Interaction
Multi-media
Tangible Interaction
3-D
Human-Robot Interaction
Ubiquitous Computing
33
Human Factors in HCI
Source: Human factors in HCI design, Cham,Tat-Jen
34
Human Factors in HCI
Humans are limited in their capacity to process information. This has important implications for
design.
Information is received and responses given via a number of input and output channels:
– visual channel
– auditory channel
– haptic channel
– movement.
The human, the user, is, after all, the one whom computer systems are designed to assist.
The requirements of the user should therefore be of priority.
35
Human Factors in HCI
In order to design something for someone,
◦ we need to understand their capabilities and limitations.
◦ We need to know if there are things that they will find difficult or, even, impossible.
It will also help us to know what people find easy and how we can help them with things they find
difficult
This means that cognitive psychology has a bearing on the use of computer systems: how
humans perceive the world around them, how they store and process information and solve problems,
and how they physically manipulate objects.
36
Human factors in HCI
37
Human Factors in HCI
38
Importance of HCI
1. Can Prevent accidents
2. Health and safety concerns
3. Can reduce the cost of customer training and support
4. Direct correlation between HCI and sales
5. HCI can provide you a job.
39
References
Human Computer Interaction :Fundamentals and Practice, Gerard Jounghyun Kim
Myers, B. A. (1998). A brief history of human-computer interaction technology. interactions,
5(2), 44-54.
40
THANK YOU
01/05/2023
41