Chapter 8
Cognitive psychology:
Perception
By the end of this lecture
you should be able to ...
• Describe the different ways of human perception
• Explain the
– the direct approach
– the Gestalt approach
– the constructivist approach
to perception
• Discuss the implications to interactive design of the
different approaches
• Discuss how cultural and social factors impact the
design of interactive systems
Introduction
• Knowing how humans are able to perceive the world
is fundamental to good design & the creation of
usable and accessible systems
• Senses:
– Vision
– Hearing
– Other senses
• Question: How can we design systems that make the
most of users’ perceptual skills and preferences?
• Perception will help us understand heuristics like:
– “Ease the user’s memory load”
– “Recognition rather than recall”
8.2 Attention
• Word attention used in 3 senses:
1. How we make the choice between different
stimuli
2. Refers to our capacity to process
information
3. Attention often declines over time that we
spend on a task
8.2 Attention and its
practical implications for
design
1. Attention is selective
– We make a choice between different stimuli, some inputs are
accepted, other rejected
– Interface must be designed that user’s attention is drawn to the
important features
• Use spacing, colour, size, location, style to attract attention
(Discussions on each to follow)
2. Humans are limited with the amount of information that
we can deal with (capacity for attention limited)
– Don’t bombard people with too much information at once
3. Attention declines over time (limited ability to maintain
attention)
– Make applications so interesting and attractive as possible
Draw attention:
(i)Spacing
Designers often fail to consider properly the
users of their systems. As a result interactive
systems are often difficult to use effectively. In
this module you will learn about key cognitive
and physical human capabilities and see how
such knowledge can be used to build usable
and useful systems. The module will introduce
Putting
white
space
around
a range of user-centred tools, methods and
something
attention
to it
techniques
that candraws
be used
to complement
other software development approaches.
Draw attention:
(ii)Movement
Designers often fail to consider properly the
users of their systems. As a result
interactive systems are often difficult to use
effectively. In this module you will learn
about key cognitive and physical human
capabilities and see how such knowledge
can be used to build usable and useful
systems. The module will introduce Making
Making something move draws attention to it
something
move draws attention to it a
range of user-centred tools, methods and
techniques that can be used to complement
other software development approaches.
Draw attention:
(iii)Colour
Designers often fail to consider properly the users
of their systems. Putting something in a different
colour draws attention to it. As a result interactive
systems are often difficult to use effectively. In this
module you will learn about key cognitive and
physical human capabilities and see how such
knowledge can be used to build usable and useful
systems. The module will introduce a range of
user-centred tools, Particularly red. methods and
techniques that can be used to complement other
software development approaches.
Draw attention:
(iv)Warning
• If lots of attention mechanisms get used
then they lose their effect...
• They can be irritating, tiring & hurt the
eyes
– Particularly movement, flashing and
blinking
• Make the important things subtly
different to everything else
Draw attention:
(v)Clarity
• Allowing the user to clearly understand what
the designer wants...
– Are icons unambiguous?
Zoom? or Find/Replace?
– Short, concise sentences. Clear arguments
– Users particularly don’t want lots of waffle on
computer screens
8.3 Theories of human
perception
• Human perception is complex
• How and what do we see?
– How does the brain process the
information captured by the eye?
• Three theories
1. Direct or structuralist approach
2. Gestalt approach
3. Constructivist approach
8.3.1 Direct
(structuralist) approach
• Corresponds to our everyday common-sense
view of the world
• Bottom-up approach: The entire picture is made
up of its parts – the perceived object is made of
elementary features
• Our senses subject an object to increasingly
complex analysis of it features and this leads to
perception
– Visual event defined by location, movement,
wavelength, intensity, shape & size
Direct (structuralist)
approach (continued)
• Structuralism does not explain:
– Input to senses varies continually – we perceive unchanged
world
– We make use of incomplete information
– We are selective in the information to which we attend &
respond
– Visual illusions
• Why does grass always appear to be green, whether in shade or
in sunlight?
• Three types of explanations for visual illusions:
– Inference (You know grass is green)
– Other sensory events? (E.g. pupil dilation)
– Memory involved in perception? (You previously saw grass)
• Growing consensus that top-down cognitive processes
are also necessary
8.3.2 Gestalt
• Distinction between external world (objects and events)
and internal world (subjective phenomena)
• Distinction between sensations (sensory experience)
and perception (meaningful interpretation of sensory
experience)
• Production of perceived objects from sensory experience
is carried out automatically by the human nervous
system
– I.e. our minds creates “wholes” from a collection of
attributes
Phenomena of human
perception: Gestalt examples(1)
– Contextual information
• Read the following line
– A 13 C D E
Sure?
– 12 13 14 15 16
• Another line to read
– THE DOG AND THE CHT
• Context provides meaning!
• HCI: X can have 2 meanings depending
on the context:
• Check box
• Close
Phenomena of human
perception: Gestalt examples(2)
– World Knowledge
• Identify the object
Using prior knowledge to recognise partial shapes
• Edge & contour information vital; colour redundant
• HCI: If screen resolution is limited, you may show
object in silhouette or only those edges that most
clearly define the object
Phenomena of human
perception: Gestalt examples(3)
– Figure and Ground
• Figure & ground = the way we identify an object by
distinguishing it from its background
• Triangle with a circle on top?
or
Triangle with circular hole?
(Is circle part of the ‘figure’ or part of
the ‘ground’?)
• In marking boundaries it is
better to use a solid shape
than an outline
• HCI: Distinguishing between figure & ground is essential
if we are to produce pictures and icons that are
unambiguous
Gestalt: Affordance
• Perception is a direct process
– When we encounter stimuli the brain automatically turns
collections of features into perceptions
• Relationship between user and the system signifying
possibility for action
– “invitations to act” (giving an indication of what an object
can be used for)
• Perceived affordance (Donald Norman 1998):
– Icons, symbols, objects of interactive systems
– They are supported by custom & experience: Not intrinsic
– Design interface elements to indicate how they are to be
used
– Door handles, push buttons, ...
Gestalt: Affordance(2)
• Do interface objects afford their operations?
• Can users tell what can be done next with
objects?
or
• Push & pull
Gestalt: Grouping
1. Proximity (we organise the
objects we see on the basis
of what is near to what)
– Rows or columns?
• Proximity
– Make sense from random
arrangements, e.g. the stars
forming the Plough
Gestalt: Grouping (2)
2. Similarity
• we perceive objects
of similar shape or
colour to be grouped
together
3. Continuity
- we organise the objects we see by finding continuous sequences
– We see two
distinct lines of
dots in stead of
one shape
consisting of dots
Gestalt: Grouping (3)
4. Closure
– We see a circle and
hexagon rather than
three separate lines
5. Symmetry
– Areas surrounded by
symmetrical lines are
recognised as shapes
rather than separate lines
• Grouping in HCI: Provide designers with hints about how
to arrange interface objects so that they will be perceived to
belong together in some way
8.3.3 Constructivist
approaches
• Emphasis is on the active, constructive nature of
perception
• Top-down approach
– A human perceives the global image before he tries to
break it up into its parts
– Building up layers of meaning around a perceived object; a
process strongly influences by experience & LTM
• HCI:
– When designing icons or visual elements, the designer
needs a good understanding of users’ prior knowledge. A
poor design will mislead users in this process of
hypothesizing
• Visual illusions can be explained in terms of
hypothesis testing process that went wrong
Constructivist approach:
Examples of visual illusions
•
Ambiguous figures – several hypotheses
feasible: Young woman or old lady?
• Unstable figures: Are the black diamonds the
ends of lozenges pointing towards you or the
top faces of lozenges pointing downward?
• Illusory figures – we ‘see’ a figure that does not exist:
Is there a white square in the centre of the image?
Constructivist approach:
Examples of visual illusions (2)
• Impossible figures – where we ‘see’ a
figure that could not possible exist
• Apparent movement
• - where no real movement exist
• Illusory shapes
caused by afterimages
Practical
Implications for design
• Top-down processes (expectations, context, ideas, preferences, biases)
– System design should match the expectations and preferences of users
• Bottom-up processes
– Objects and events should be designed to attract, retain and boost the
attention of users
– Objects and events be clear that they can easily be understood.
• Allow for automatic processes (perceptual habits)
– Screen designs should be compatible with users’ habits and automatic
responses
• Enable users to identify key objects and events on screens
• Enable users to develop a stable perception of the system and develop
an adequate mental model of it
• Users are accustomed to fill gaps of incomplete information
automatically
– Ensure that your design allow users to fill in the gaps in the right way
• Ensure that users can select the right information immediately and
respond appropriately
8.4.1 Auditory perception
• Sound is an important and frequently used medium
• Sound plays a central role in:
1. Communicating with other through speech
2. Receiving information and entertainment
•
radio broadcasts, musical performances, etc.
3. Sound enables us to be aware of events outside our visual
field
•
Police sirens, ringing telephones, etc.
4. Sound give indication of status of environment (even if in
background)
•
E.g. motor car engine, factory noise
• Sound has very different set of properties to vision
–
User could get auditory stimuli from a computer without
being in direct contact with it
• Sound varies in pitch, timbre, intensity
–
Computers produce rich variety of sounds
• Human ear can only perceive limited range of
sounds/differences
–
20Hz-15KHz; differences of 1.5Hz
Properties of sound
and vision
Vision
Sound
User control
Consists of a number of distinct
information tokens. User can
decide where he wants to look or
decide not to look at all
Single information token. User
has to listen whether he wants or
not (cannot shut your ears)
Access time
Faster. E.g. user can absorb a
large amount of information
simultaneously (in parallel).
Slower. Audio can only be
presented sequentially.
Persistence
Persistent. Parts previously read
remain visible.
Non-persistent. If something has
been said it is gone for ever.
User has to remember.
Directionality
Directional. Visual sense easily
controllable to turning eyes into a
particular direction
Non-directional. Cannot decide
to listen in particular direction
Background effects
Affected by light. Cannot read a
menu in dark restaurant.
Affected by noise. Conversation
in restaurant with loud
background music is difficult.
Sound:
Practical implications for design
How can sound be used? What for? (See text book as well)
1. Immediate feedback of action, e.g. “beep” as audio alert
2. Presenting different kinds of information to that made available
using the visual channel
3. Augmenting interfaces with extra information e.g.?
4. Users with visual impairments
–
e.g. voice input (also telephone-based services)
5. Speech synthesis
–
–
Voice as alert; must be able to customise!
Voice as information
• Interfaces where visual information cannot be presented
• Offloading visual display
– Users whose visual senses are heavily used e.g. modern
aircraft flight decks. e.g. telling a pilot height above the
ground during landing so that he does not have to look at
altitude display while focusing on the runway ahead
Touch
• Haptic feedback – see next slide
• Combining input and output using pointing devices:
– Joystick, mouse
• Data glove
– Input/output device used with virtual reality
– Senses position, orientation, movement of user’s
hand
– Allowing gestures to be used as inputs and objects to
be grasped
– Some add force, pressure, vibration – user ‘feels’ the
virtual object they touch/grasp
Haptic feedback
• Haptic device is one that involves physical contact
between the computer and the user, usually through an
input/output device, such as a joystick or data gloves,
that senses the body's movements.
• By using haptic devices, the user can not only feed
information to the computer but can receive information
from the computer in the form of a felt sensation on
some part of the body. This is referred to as a haptic
interface.
– For example, in a virtual reality environment, a user can
pick up a virtual tennis ball using a data glove. The
computer senses the movement and moves the virtual ball
on the display.
Data glove Examples
Data glove Examples
Data glove Examples
Data glove Examples
Data glove Examples
Data glove Examples
Data glove Examples
Data glove Examples
Data glove Examples
Conclusion...
• Our perception of things are shaped by
the culture in which we grow up
• People generally have different ways of
perceiving things
• There are different ways for the
designer to get the user to perceive the
important things