Professional Documents
Culture Documents
Hci Lecture 1
Hci Lecture 1
LECTURE 1
Course Profile
Credit Hours: 03
Evaluation Criteria
Assignments 05%
Presentation 05%
Quiz 10%
Mid term 30%
Final exam 50%
3
Recommended Resources
Text book
Human Computer Interaction, A. Dix et al., 3rd edition, Pearson
Education,
Other
Designing Interactive Systems: A comprehensive guide to HCI,
UX and interaction design, D. Benyon, 3rd edition, Pearson
Education, 2013.
Designing the User Interface: Strategies for Effective Human-
Computer Interaction, B. Shneiderman et al., 5th edition, Pearson
Education, 2009.
The essence of human computer interaction, C. Faulkner, 1 st Ed.
The design of everyday things, D. Norman, 2 nd Ed.
http://hcibib.org/
4
Outline
Introduction to HCI
Alarm Clock Example
Dos time versus software application
Don Norman’s Door Example
The human
Information i/o …
visual,
auditory,
haptic,
movement
5
Goals of HCI
Useful
Accomplish what is required
Play music, cook dinner, format a document
Usable
Do it easily and naturally
Without danger of error
Used
Make people want to use it
Be attractive, engaging, fun
6
What is HCI?
• Interaction
OR
• Relationship between user and
computer
Computer
Interaction
8
What is HCI?
Human-computer interaction (HCI) is the field of study that focuses
on improving how users and computers interact by designing
interactive computer interfaces that satisfy users’ needs.
9
What is HCI?
Broader than just the design of the interface
Concerned with all those aspects that relate to the
interaction between users & computers
10
What is HCI?
The emergence of HCI dates back to the 1980s, when
personal computing was on the rise.
It was when desktop computers started appearing in
households and corporate offices.
HCI’s journey began with video games, word processors,
and numerical units.
11
Human Computer Interaction
HCI Terms interchangeably used:
HCI (Human Computer Interaction)
CHI (Computer Human Interaction)
MMI (Man Machine Interaction)
HMI (Human Machine Interaction)
Interaction and Interface words:
Interchangeably used
12
User Interface
Part of a software program that allows
- User to interact with the computer
- User to carry out their task
13
User Interface
User interface is the medium through
which user interacts with the software
14
User Interface
User interface is the medium through
which user interacts with the software
15
Example of DOS (Disk Operating
System) User Interface
DOS interface
A disk operating system doesn't have a graphical user interface (GUI).
Its interface is character-based
Users must type commands in the command line to indicate what actions
they want to perform by system
16
Graphical User Interface
• The GUI, graphical user interface, is a form of user interface that allows
users to interact with electronic devices through
• Graphical Icons
17
Human Computer Interaction
People use computers because they want
to
write papers
communicate with people
design bridges
maintain their balances …
18
Human Computer Interaction
For Computer (based systems) to be
widely accepted and used effectively
They need to be well designed ?
Should be designed for the needs &
capabilities of the people for whom they
are intended
19
Interaction Design
“Designing interactive products to support people
in their everyday and working lives”
People Use Computers to do work (task)
- Usefulness
whether the system can be used to achieve some desired
goal
- Utility
functionality of the system in principle can do what is
needed
- Usability
How well users can use that functionality
20
Alarm Clock
21
DOS TIME
22
Why Study HCI – Software Perspective
23
Smart Phone Clock
24
Don Norman’s Door Example
A classic book. Read it!
I will share its pdf soon
Main Point: no one
reads manuals, so
things should be
designed so that
manuals are not
needed
BTW what is wrong
with the kettle on the
book cover?
25
Don Norman’s Door Example
27
Vision
Two stages in vision
28
The Eye - physical reception
mechanism for receiving light and
transforming it into electrical energy
light reflects from objects
images are focused upside-down on retina
retina contains rods for low light vision and
cones for colour vision
ganglion cells (brain!) detect pattern and
movement
29
Interpreting the signal
Size and depth
visual angle indicates how much of view
object occupies
(relates to size and distance from eye)
30
Interpreting the signal (cont)
Brightness
subjective reaction to levels of light
affected by luminance of object
measured by just noticeable difference
visual acuity increases with luminance as does flicker
Colour
made up of hue, intensity, saturation
cones sensitive to colour wavelengths
blue acuity is lowest
8% males and 1% females colour blind
31
Interpreting the signal (cont)
The visual system compensates for:
movement
changes in luminance.
32
Optical Illusions
33
Reading
Several stages:
visual pattern perceived
decoded using internal representation of language
interpreted using knowledge of syntax, semantics, pragmatics
34
Hearing
Provides information about environment:
distances, directions, objects etc.
Physical apparatus:
outer ear – protects inner and amplifies sound
middle ear – transmits sound waves as
vibrations to inner ear
inner ear – chemical transmitters are released
and cause impulses in auditory nerve
Sound
pitch – sound frequency
loudness – amplitude
timbre – type or quality
35
Hearing (cont)
Humans can hear frequencies from 20Hz to 15kHz
less accurate distinguishing high frequencies than low.
36
Touch/Haptic
Provides important feedback about environment.
May be key sense for someone who is visually impaired.
Stimulus received via receptors in the skin:
Thermo-receptors – heat and cold
nociceptors – pain
mechanoreceptors – pressure
(some instant, some continuous)
Some areas more sensitive than others e.g. fingers.
Kinesthesis - awareness of body position
affects comfort and performance.
37
Movement
Time taken to respond to stimulus:
reaction time + movement time
Movement time dependent on age, fitness etc.
Reaction time - dependent on stimulus type:
visual ~ 200ms
auditory ~ 150 ms
pain ~ 700ms
Increasing reaction time decreases accuracy in the
unskilled operator but not in the skilled operator.
38
Movement (cont)
Fitts' Law describes the time taken to hit a screen target:
Mt = a + b log2(D/S + 1)
where: a and b are empirically determined constants
Mt is movement time
D is Distance
S is Size of target
39
Fitts law
Fitts law is useful for web designers when
deciding where to place the next button
Call to Action Buttons , links and other buttons can
be strategically placed on websites/apps to
increase the chance of clicking. Not only do you
want to direct traffic to the right places, but users
need to a have a simple and easy experience.
Notice how the windows start button almost
doubled in size?
40
Summary
Today we learnt about,
Basics of Human Computer Interaction
Alarm Clock Example
Dos time versus software application
The human
Information i/o …
visual,
auditory,
haptic,
movement
41