human-centered design

Human factors within interactive

digital media design & software

Nick Clarke
Lecturer in CAD for Fashion and Textiles
University of Manchester
School of Materials
Faculty of Engineering and Physical Sciences
School of Materials
Department Fashion and Textiles
 lecture: overview

Focus on human commonalities - memory, perception and

attention

Introduce the Information Processing Model of cognition

Suggest some human-centered design strategies derived from

these understandings and the information processing
model
 guiding assumptions

Human systems – memory, attention, perception – provide some

unique constraints of which designers should be aware

Simple, commonsensical approaches to interface and information

design can make a difference in using with online and offline
multimedia environments

The more cognitive resources (attention, memory etc.) that you can
focus on the task (educational, navigational, instructional etc.), the
better the ‘user’ outcomes (ie. learning)

HUMAN-CENTERED DESIGN MATTERS

human factors: memory systems
 memory: sensory

Memory system that supports momentary storage of large

amounts of information gathered by our senses (echoic, iconic,
haptic etc.)

Data is stored in sensory registers for

a brief period of time (under 5 sec.).
This is enough time to either react or
attend to critical information.
Most data, however, is discarded.
 memory: working

Working memory provides a temporary workspace for

information drawn from the sensory registers and activated from
long term memory.

This is where thinking occurs.

Working memory has a limited

storage capacity for information.

Information decays quickly without

constant rehearsal.
 memory: long-term

The memory system that supports relatively permanent storage

of information is called long-term memory.

Long-term memory has unlimited

capacity.

Learning is about transferring

information from working memory
into long-term memory.

Learning theories provide strategies

for encoding information in such a
way that it can later be recalled and
applied in novel situations.
 sensory memory: processing

Sensory memory facilitates feature analysis and pattern

recognition which allows us to recognize friends and
friendly user interface elements

Recognition involves both bottom-up processing and top-

down processing

– Perception is based upon bottom-up processing and helps us to

distinguish between data elements.

– Top-down processing provides interpretations of data. These are

coloured by our understandings of specific contexts and
environments.
 processes of perception

The act of perception is a fast, but complex task

break down complex stimuli into simple
features

extract features from sensory data

construct patterns from this information

compare patterns with those in long-term

memory

finding a match = perception

 sensory memory: processing & interpretation

ex. jumping to conclusions

feature analysis: design implications

use contrast and size to bring

out salient features of letters
and objects
Ex. page background

clearly delineated edges help

feature analysis - line drawings
and line-based icons are more
quickly processed than tonal
images

leverage feature compatibility –

are icons and fonts compatible
with expectations?
Ex. typography

Icons and user interface

elements should match a given
interface context
 special issues: icons

Advantages:
– they are recognized as quickly as words
– they support dual encoding
as visual representations
and semantically

Disadvantages:
– difficult to develop universally recognised icons
– difficult to develop a series of clear, distinct icons to represent
different content and functionality
rules of thumb: icons

Use labels with icons.

Icons should be distinct

to aid memory.

Clear, simple icons are

often more easily
interpreted than
complex, 3-D tonal
icons.
 visual search & detection

Understanding how humans search and detect visual

information suggests strategies for interface and graphic
design
– Humans use ‘Parallel’ and ‘Serial’ recognition.
– Ex: Where's Wally?

– There is strong evidence that Humans tend to search through

elements on a screen in a serial fashion looking for a target.
– Ex. Woodman, G.F, & Luck S.J. (1999) Research

The time it takes to locate a target (the desired menu item, page
content etc.) depends upon a few variables:
– The number of items on a screen – serial search; Neisser: T=(NI)2.
– Element conspicuity – parallel; things that stand out are located
faster and elements noticed in parallel.
– logical content organization and expectancies.
visual search: design strategies
visual search: design strategies
working memory: model
 working memory: capacity & duration

hgniy
 working memory: capacity & duration

afbzegoyktvp

The Magic Number Seven – Plus

or Minus Two
- George Miller
 working memory: capacity & duration

batpigdogant
 working memory: considerations

The limits of working memory are an impediment to learning

– educational content
– navigational structures
– computer environments and interfaces

Instructional and interface designs, content organization and

site architecture should account for these limitations and
potentials
 focus on attention

Information processing relative to learning requires a great

degree of attention and cognitive resources

Like working memory, human attention is limited

Multitasking or splitting attention often causes a drop in

performance of all tasks involved

If the majority of participants’ attention is consumed by the

mechanics of your screen environment or wading through
poor design and information structures, there will be less
cognitive resources for the actual learning objectives
 variables impacting attention

Automaticity
– When a task becomes automatic it requires less in the way of conscious
cognitive resources

– Automaticity can increase our ability to multitask and attend to larger sets of
information

Multiple modalities
– It is easier to divide attention between two different modalities (one visual,
one aural) than between two distinct information sources presented in the
same modality

– Earliest Memories
 working memory: design strategies

Minimize the load on working memory for learning activities

design user interfaces, interactive modules and learning materials so that
participants are not required to hold large numbers of discreet chunks of
information in memory (remember the magic number 7 +/- 2).

Organize information into meaningful chunks for working memory

The limits of working memory can be extended when the chunks of
information are larger.
working memory: design strategies
working memory: design strategies
 long-term memory: conceptual structures

Information is organized into associative networks (schemas)

Schemas reflect central ideas or concepts

– Ex. What a web site is, a college campus etc.

Scripts are schemas describing sequences of actions

– Ex. filling out & submitting a form on the web, navigating through a
web site using hypertext links, driving a car to class, dining in a
restaurant etc.

Mental models are schemas of dynamic systems, objects &

equipment
– Ex. VCRs, interactive web environments etc.
 long-term memory: design strategies

Use conventions and popular standards

Pursue designs that leverage shared

schemas or conventions (ex. hyperlinks)
 long-term memory: design strategies

If information is to be remembered, make it meaningful

– organize into meaningful associations.

– present in multiple modes so that one can reinforce the other.

– design in a manner consistent with existing mental models or pre-existing

knowledge.

– design information to highlight important connections and relationships.

Embed knowledge in the world to support development of

accurate mental models; use natural mappings
 summary Human Factors implications

Human systems – memory, attention, perception – provide unique

design constraints of which designers should be aware

Simple, commonsensical approaches to interface and information

design
– avoiding clutter
– making things distinct and visible
– reducing cognitive load from extraneous information
– Designing interfaces to accommodate human expectations of the web
can make a difference in learning from web-based environments

The more cognitive resources (attention, memory etc.) that you can
focus on the educational task, the better the outcomes –

HUMAN-CENTERED DESIGN MATTERS

 human-centered principles & interface design

Interface

– Mediator between a user and the underlying system or environment.

– Can either facilitate or inhibit use depending upon how well they
incorporate human-centered principles.
 design heuristics Jakob Nielsen

10 Design Heuristics

– Visibility of system status

– Match between system and real world
– User control and freedom
– Consistency and standards
– Error prevention
– Recognition rather than recall
– Flexibility and efficiency of use
– Aesthetic and minimalist design
– Help users recognize, diagnose and recover from errors
– Help and documentation
design heuristics: visibility of system status
design heuristics: control & freedom
design heuristics: consistency & standards
design heuristics: error prevention
design heuristics: flexibility & efficiency of use
design heuristics: aesthetic & minimalist design
design heuristics: help & documentation

add help screens where needed

 session five: human factors

THE END
visual search & detection
Serial and Parallel Searching