Human Computer Interfacing

CSE - 476

Introduction

1
Course Information
 BOOK
 Human-Computer Interaction, Third Edition, by Alan Dix, Janet
Finlay, Gregory Abowd, and Russell Beale. Prentice Hall.

2
Lecture Contents
 Introduction

 Human

 Input/Output Channels

 Human Memory

 Thinking

4/25/2019 Introduction 3
User Interface – Hall of Shame

4/25/2019 Introduction 4
User Interface – Hall of Shame
 Presents a number of templates
 Prints custom award certificates

 Good points about the Interface?

 Graphical – Mouse Driven

 No complicated commands to remember
 User gets a preview of the certificate

4/25/2019 Introduction 5
User Interface – Hall of Shame
 Why isn’t it usable?
 Long help message for a simple ‘selection’ task
 Because the interface is bizarre

 Moving the scroll bar changes the template

 How many templates?
 How are they sorted?
 How much to move the bar to select the next template?
 Frequent users: How to find a template already used

How would you redesign?

4/25/2019 Introduction 6
The Interface Redesigned

4/25/2019 Introduction 7
The Error Dialog
 We see it all the time
 What’s good about the design
of this error box?
 The user knows there is an error

 What’s poor about the design

of this error box?
 Not enough information
 The user does not know how to resolve the error (instructions
or contact info)

4/25/2019 Introduction 8
What is HCI
 Human–computer interaction (HCI) is the study of interaction
between people (users) and computers.

 HCI is a discipline concerned with the design, evaluation and

implementation of interactive computing systems for human use.

 Human and a computer system interact to perform a task?

 task - write document, calculate budget, solve equation, learn about
Bosnia, drive home, make a reservation, land a plane...

4/25/2019 Introduction 9
Interfaces in the Real World
 Not just computers!
 VCR
 ATM
 Phone
 Copier
 Car
 Plane cockpit
 ……..

4/25/2019 Introduction 10
Why HCI is important
 HCI is not just ‘how big should I make buttons’ or ‘how
to layout menu choices’

 It can affect:
 Effectiveness

 Productivity

 Morale

 Safety

 Example: A car with poor HCI

4/25/2019 Introduction 11
The Human
 User – Information Processing System

 Information

 Comes in (Input)

 Is stored (Memory)

 Is processed (Processing)

 Is passed out (Output)

4/25/2019 Introduction 12
The Human
 Information i/o …
 visual, auditory, haptic (touch), movement

 Information stored in memory

 sensory, short-term, long-term

 Information processed and applied

 reasoning, problem solving, skill, error

 Emotion influences human capabilities

 Each person is different

4/25/2019 Introduction 13
Lecture Contents
 Introduction

 Human

 Input/Output Channels

 Human Memory

 Thinking

4/25/2019 Introduction 14
Input/Output Channels
 Input – Output
 Person interacts with outside world through information being
received and sent

 User’s output = Computer’s Input (vice versa)

 Human
 Input : Senses

 Output: Effectors

4/25/2019 Introduction 15
Input/Output Channels
 Input – Five senses
 Sight/Vision
 Hearing
 Touch
 Taste
 Smell

 Output – Effectors
 limbs
 Fingers (primary role, typing or mouse control)
 Eyes
 Head & Body

4/25/2019 Introduction 16
Example
 Computer with keyboard and mouse
 Application: GUI, Menus & Icons
 Information Received
 Sight
 Ears?
 Touch?
 Information Sent
 Hands: Keyboard, mouse

4/25/2019 Introduction 17
Vision
 Vision is primary source of information for humans

 Visual Perception – Two Stages

 Physical reception of stimulus from outside world
 Processing & Interpretation of stimulus

4/25/2019 Introduction 18
The Eye

4/25/2019 Introduction 19
The Eye – Physical Reception
 Eye is a mechanism for receiving light and transforming
it into electrical energy

 Light is reflected from objects

 Images are focused upside-down on retina

 Retina contains photoreceptors

 Rods: Highly sensitive to light

 Cones: Color Vision

4/25/2019 Introduction 20
Interpreting the Signal

 Size and depth

 Visual angle indicates how much of view object
occupies
 Relates to size and distance from eye
4/25/2019 Introduction 21
Interpreting the Signal
 Visual Angle

4/25/2019 Introduction 22
Interpreting the Signal
 Size and depth
 Familiar objects perceived
as constant size
 Size constancy: an object
appears to maintain a constant
size even though its retinal
image size changes with

distance

 Cues like overlapping help

perception of depth

4/25/2019 Introduction 23
Interpreting the Signal
 Brightness
 Reaction to levels of light
 Affected by luminance of object
 Contrast: luminance of object & its background
 Colour
 Made up of hue, saturation, value
 Cones sensitive to colour wavelengths
 Red, Green, Blue
 8% males and 1% females colour blind
4/25/2019 Introduction 24
 Interpreting the Signal - Colour
 Hue
 Hue is what most people think of when we say color
 Hue is the name of a distinct color of the spectrum, It is the particular
wavelength frequency

 Saturation
 Saturation is the purity of a colour

 Value (Intensity, Brightness, Lightness)

 Refers to the intensity of light present. When light is at
its fullest intensity, colors will become bright
 Unlike saturation, there isn't necessarily less of the
color – it is just not as intense

4/25/2019 Introduction 25
Interpreting the Signal - Color
 HSV

4/25/2019 Introduction 26
Interpreting the Signal
 Ambiguity

B or 13 ???

 Context is used to resolve ambiguity

 Interpret & exploit the expectation

4/25/2019 Introduction 27
Interpreting the Signal
 Optical Illusions

the Ponzo illusion the Muller Lyer illusion

4/25/2019 Introduction 28
 Reading
 Several stages:
 Visual pattern of a word perceived
 Decoded using internal representation of language
 Interpreted using knowledge of syntax, semantics

 Reading involves saccades* and fixations

*Jerky movements of eye

4/25/2019 Introduction 29
Reading
 Perception occurs during fixations
 94% of the elapsed time

 Regression
 Forwards & Backward movements of eye over text

 Word shape is important to recognition

 Reading speed
 Legibility: font size, line length etc.

4/25/2019 Introduction 30
Hearing
 Provides information about environment:
 Distances, directions, objects etc.

 Physical apparatus:
 Outer ear
 Middle ear
 Inner ear

 Sound
 Pitch – Sound frequency
 Loudness – Amplitude
 Timbre – Type or quality

4/25/2019 Introduction 31
Hearing
 Humans can hear frequencies from 20Hz to 15kHz

 Auditory system filters sounds

 Can attend to sounds over

background noise

 For example, the cocktail party

phenomenon

4/25/2019 Introduction 32
Touch
 Provides important feedback about environment
 May be key sense for someone who is visually
impaired
 Stimulus received via receptors in the skin:
 Thermoreceptors – heat and cold
 Nociceptors – pain
 Mechanoreceptors – pressure

 Some areas more sensitive than others e.g. fingers

 Ecommerce (CDs & Books vs. Clothes)

4/25/2019 Introduction 33
Movement
 Fitt’s Law
 Describes the time taken to hit a screen target

Movement Time = a + b log2(D/S + 1)

Where
a and b are empirically determined constants
D is Distance from target centre
S is Size of target

Important: D & S are calculated along the axis of motion

4/25/2019 Introduction 34
Movement
 Fitt’s Law

Movement Time = a + b log2(D/S + 1)

Index of Difficulty

=> Targets as large as possible

=> Distances as small as possible

4/25/2019 Introduction 35
Movement
 Fitt’s Law

4/25/2019 Introduction 36
Movement
 Pie-chart shaped menus
 All options are equidistant (As opposed to lists)
 Increased used of screen estate

4/25/2019 Introduction 37
Today’s Interface Hall of Shame
 Where does it come from?

 Microsoft Word
 Problem?
 Four pairs of mutually exclusive options

 Check boxes?

4/25/2019 Introduction 38
Today’s Interface Hall of Shame
 Software Automate Pro

 Interface: Entering schedule time for an event

 How would you enter the time?

 Click on Set time

 Use the special clock control

4/25/2019 Introduction 39
Today’s Interface Hall of Fame
 Useful solution to a very common problem

 Indicating that the state of the Caps Lock key may

interfere with the processing of the password is a
good idea

4/25/2019 Introduction 40
Lecture Contents
 Introduction

 Human

 Input/Output Channels

 Human Memory

 Thinking

4/25/2019 Introduction 41
Human Memory
 There are three types of memory functions
 Sensory Memory
 Short-term or working memory
 Long-term memory

4/25/2019 Introduction 42
Human Memory

4/25/2019 Introduction 43
Sensory Memory
 Buffers for stimuli received through senses
 Iconic memory: visual stimuli
 Echoic memory: aural stimuli
 Haptic memory: tactile stimuli

 Continuously overwritten
 From Sensory to Working memory
 Attention: Concentration of mind on one out of a number of
competing stimuli or thoughts
 Example: Cocktail party phenomenon

4/25/2019 Introduction 44
Short Term Memory
 Temporary recall of information
 Reading a sentence, Performing an arithmetic operation etc.
 Rapid access
 Rapid decay
 Limited capacity: 7± 2 chunks
 Examples
212348278493202

00 44 112 245 8920

Chunking Information can increase short term memory

Pattern Abstraction
4/25/2019 Introduction 45
Short Term Memory
 Closure
 Desire to complete or close the task in short term memory

 ATM Cash Machine

 Closure
 Flush out STM
 Card/Cash ???

4/25/2019 Introduction 46
Short Term Memory

4/25/2019 Introduction 47
Long Term Memory
 Repository for all our knowledge

 Slow access ~ 1/10 second

 Slow decay, if any

 Huge or unlimited capacity

4/25/2019 Introduction 48
Long Term Memory

How to …..

Events and Experiences Facts

4/25/2019 Introduction 49
Reading Assignment

Long – term Memory structure

(HCI, Dix et al. Chapter 1)

4/25/2019 Introduction 50
Long Term Memory - Processes
 Storage

 Forgetting

 Retrieval

4/25/2019 Introduction 51
Long Term Memory - Storage
 Rehearsal
 Information moves from STM to LTM

 Total time hypothesis

 Amount retained proportional to rehearsal time

 Distribution of practice effect

 Optimized by spreading learning over time

 Structure, meaning and familiarity

 Information easier to remember

Past, Faith, Idea, Cold, Value, Courtesy, Logic, Quiet, Ambitious

Boat, Tree, Cat, Child, Gun, Plate, Home, Table, Computer, Spoon

4/25/2019 Introduction 52
Long Term Memory - Forgetting
 Decay
 Information is lost gradually but very slowly

 Interference
 New information replaces old: retroactive interference
 Recalling older telephone number

 Old may interfere with new: proactive inhibition

 Driving to old house

4/25/2019 Introduction 53
Long Term Memory - Retrieval
 Recall
 Act of reproducing a specific incident, fact or other item (from long term
memory)

 Recalling where you were last weekend, fill-in-the-blank on exams

 Recognition
 Information provided gives knowledge/cue that it has been seen before
 People are more likely to recognize a suspect in a police line-up than to provide
an accurate description from recall memory
 It is easier to answer multiple-choice questions than essay questions because
the correct answer may be recognized

People recognize more than they can recall.

4/25/2019 Introduction 54
Lecture Contents
 Introduction

 Human

 Input/Output Channels

 Human Memory

 Thinking

4/25/2019 Introduction 55
o Thinking
o Reasoning
o Problem Solving

4/25/2019 Introduction 56
Reasoning
Use the knowledge we have to draw conclusion or
infer something new about the domain of interest

 Deductive Reasoning
 Inductive Reasoning
 Abductive Reasoning

4/25/2019 Introduction 57
Deductive Reasoning
 Deduction:
 Derive logically necessary conclusion from given premises
e.g. If it is Friday then she will go to work
It is Friday
Therefore she will go to work.

 Logical conclusion not necessarily true:

e.g. If it is raining then the ground is dry
It is raining
Therefore the ground is dry

4/25/2019 Introduction 58
Deductive Reasoning
 When truth and logical validity clash …
e.g. Some people are babies

Some babies cry

Inference - Some people cry

 Correct?

4/25/2019 Introduction 59
Inductive Reasoning
 Induction
 Generalize from cases seen to cases unseen
e.g. All elephants we have seen have trunks
therefore all elephants have trunks
 Unreliable
 Can never prove it true

 … but useful!
 Humans not good at using negative evidence
 e.g. Wason's cards.

4/25/2019 Introduction 60
Inductive Reasoning
 Wason’s Cards

7 E 4 K
If a card has a vowel on one side it has an even number on the other

Is this true?

How many cards do you need to turn over to find out?

…. and which cards?

4/25/2019 Introduction 61
Inductive Reasoning
 Wason’s Cards
 Common Responses
 Select E & 4: Positive Evidence
 Check Negative Evidences
 Select E & 7

7 E 4 K
If a card has a vowel on one side it has an even number on the other

4/25/2019 Introduction 62
Abductive Reasoning

 Reasoning from event to cause

e.g. Sam drives fast when drunk.

If I see Sam driving fast, assume drunk.

 Unreliable
 May lead to false explanations

4/25/2019 Introduction 63
Problem Solving
 Reasoning: Inferring new information from what is known
 Problem Solving: Finding solution to unfamiliar task using
knowledge
 Several theories
 Gestalt theory, Problem space theory

 Analogy
 Mapping: Using knowledge of similar problems/domains

 Skill Acquisition
 Driver, Player, Surgeon

4/25/2019 Introduction 64
Errors and Mental Models
 Errors
 Mistakes
 Errors in choosing an objective or specifying a method of achieving it
 Causes: Incorrect understanding
 Humans create mental models to explain behaviour
 If the model is wrong (different from actual system) errors can occur

 Example: Lift button and light switch.

4/25/2019 Introduction 65
Emotion
 Implications for Interface Design
 Stress will increase the difficulty of problem

solving

 Relaxed users will be more forgiving of

shortcomings in design

 Aesthetically pleasing and rewarding

interfaces will increase positive affect

4/25/2019 Introduction 66
Emotion

4/25/2019 Introduction 67
Individual Differences
 Long term
 Gender, physical and intellectual abilities

 Short term
 Effect of stress or fatigue

 Changing
 Age

4/25/2019 Introduction 68
 Humans as information processors
 Input from environment (I/O)
 Store, manipulate and use information and reacting
 Information received through senses
 Stored in Memory (Short Term / Long Term)
 Use memory in reasoning and problem solving
 Recurrent familiar situations allow people to acquire skills in
particular domain
 Can be error when changed.

4/25/2019 Introduction 69
 References
 Human Computer Interaction by Dix et al.
 User Interface Design and
Implementation, Prof. Robert Miller - MIT
 User Interface Hall of Fame/Shame

4/25/2019 Introduction 70