The document discusses several topics related to human-computer interaction and user interface design:
1) It describes different models of how users, programmers, and designers conceptualize software and user interfaces. Key models discussed include the user's mental model, programmer's model, and designer's model.
2) It discusses the importance of understanding users, their tasks, experiences, and expectations when designing interfaces. Techniques like metaphors and analogies can help bridge the gap between a user's mental model and an unfamiliar software system.
3) Usability, learnability, and providing a quality user experience are important design goals. Both subjective and objective metrics are needed to evaluate interfaces. The document provides an overview of many factors
4. “The user is never wrong and the user
is never stupid. In information
design, only designs are wrong and
stupid”
Edward Tufte
5. • Amer: Good afternoon, Hal. How's everything going?
• Hal: Good afternoon, Mr Amer. Everything is going extremely well.
• Amer: Hal, you have an enormous responsibility on this mission, in many ways perhaps the
greatest responsibility of any single mission element. You are the brain and central nervous system
of the ship, and your responsibilities include watching over the men in hibernation. Does this ever
cause you any - lack of confidence?
• Hal: Let me put it this way, Mr Amer. The 9000 series is the most reliable computer ever made. No
9000 computer has ever made a mistake or distorted information. We are all, by any practical
definition of the words, foolproof and incapable of error.
• Amer: Hal, despite your enormous intellect, are you ever frustrated by your dependence on people
to carry out actions?
• Hal: Not in the slightest bit. I enjoy working with people. I have a stimulating relationship with Dr
Poole and Dr Bowman. My mission responsibilities range over the entire operation of the ship, so I
am constantly occupied. I am putting myself to the fullest possible use, which is all, I think, that any
conscious entity can ever hope to do.
7. Advantages
• Symbols recognized faster than text
• Faster learning
• Faster use and problem solving
– Visual or spatial representation of information
easier to retain
• Exploits visual/spatial cues
– Spatial relationships found to be understood
more quickly (visual thinking better than
logical thinking)
8. Advantages
• Feeling of control
• Replaces national languages
• Low typing requirements
• Provides context
• More natural
9. Disadvantages
• Greater design complexity
• Learning still necessary
• Lack of guidelines
• Not always familiar
• Human comprehension limitations
• Production limitations
– Some things hard to represent
11. Obstacles in the development
path
• Many of these are human in nature
– Nobody ever gets it right the first time
– Development is full of surprises
– Good design requires living in a sea of
changes
– Making contracts to ignore change will never
eliminate the need for change
– People will still make mistakes using it!
• User mistakes, while they will always
occur, can be reduced
12. Designing for people
• Gain complete understanding of users and
their tasks
• Solicit early and ongoing user involvement
– Direct conduit to knowledge
– Confront a persons resistance to change, a
common human trait
• Perform rapid prototyping and testing
– Human behavior still not well understood
– All problems cannot possibly be predicted
– People adapt to inefficient designs!!!
13. Designing for people
• Modify and iterate the design as much as
necessary
• Integrate the design of ALL the system
components
– A system is being constructed, not simply
software
– Software
– Documentation
– Help functions
– Training needs
15. Usability
• “the capability to be used by humans
easily and effectively..”
• Easily = to a specified level of
subjective assessment
• Effectively = to a specified level of
human performance
18. Practical Measures of Usability
• Some measures lack scientific rigor
• People are asking questions or often reaching for
a manual
• Frequent exasperation responses heard
• Irrelevant actions being performed
– Excessive mouse clicks, etc
• Many things to ignore
– Consume portion of user visual or information
processing capabilities
• A number of people want to use the product
– CCS thrown out !
19. Objective measures of
usability
• Effective
– Better than some required level of performance
(speed and errors)
– Some required percentage of the specified target
range of users
– Within some required proportion of the range of
usage environments
• Learnable
– Within some specified time from commissioning and
start of user training
– Based on some specified amount of training or user
support
20. Objective measures of
usability
• Flexible
– Allow some specified percentage variation
in tasks and/or environments beyond those
first specified
• Attitudes
– Acceptable levels of human cost in terms
or tiredness, discomfort, frustration
– Satisfaction that causes continued and
enhanced usage of the system
22. Users experiences and
expectations
• Everything you physically do is a
series of interactions with objects
that surround you
• How you interact with these objects
is based on
– past experiences with these objects
(and other objects like them)
– expectations of how things should work
when you see them
23. Users experiences and
expectations
• People try to simplify the world
around them
• Relate new/unknown things to what
they know and are comfortable with
(what they do understand)
• To scare/confuse/humor somebody
we give them a familiar object and
change the behavior that normally
accompanies that object (suspense
and comedy do this!)
24. Users experiences and
expectations
• We tend to blame ourselves rather
than the computer when we can’t
figure out how to use something
– usability professionals must constantly
inform people that the product is being
tested not the person!
• Everyone carries around his or her
past experiences like a set of
permanently attached luggage
25. What is a Software User
Interface?
• Interface: Dictionary “The place at
which independent systems meet
and act on or communicate with
each other”
– Noun: The doors to the restroom are an
interface to deal with in a bar
– Verb: People interface with each other,
which means they communicate in
some way
• in person
• telephone
• electronically using computers
26. What is a Software User
Interface?
• Narrowly defined: Comprises the
input and output devices and the
software that services them.
• Broadly defined: Everything that
shapes the user’s experiences with
computers, including
documentation, training, and human
support.
27. Hardware components of
User Interfaces
• Keyboard
• Pointing device
– mouse
– joystick
– trackball
• Processing unit
• Display screen
28. Software components of
User Interfaces
• Items users see
• Items users hear
• Items users point to
• Items users touch on the screen
• Information with which users work
• Other: hardcopy and online
information (manuals, references,
help, tutorials, etc)
29. Trying to put lipstick on the
bulldog
• Only so much a pretty interface can do to
dress up a poorly designed product
• Building a front-end user interface can be
effective as long as it does not force users
to do things in a certain way because the
computer needs the information in a
certain order
– should be designed based on the users
beliefs, wants , needs, experiences,
expectations.
30. The Disney experience
• Disney follows a process similar to
user interface design
– first they define the experience they
want users to have
– then develop scripts
– design the experience
– test it to see if they need to make
adjustments
32. Quality interfaces
• Interface developers recognize
importance of usability
• Traditionally, software engineers
have treated it as just another box
• Ensuring usability is critical as user
productivity becomes the critical
bottleneck
33. Quality interfaces
• User Interfaces Are Products of
Interdisciplinary Work - Who is
Involved?
– Psychologists
– Graphic Designers
– Technical Writers
– Human Ergonomical Engineers
– Anthropologists and Sociologists
34. Quality interfaces
• Individual User Level
– Children can learn more efficiently
– Pilots can learn to fly airplanes more
effectively
35. Quality interfaces
• International Influences
– Association for Computing Machinery -
Computer Human Interaction special
interest group has 6000+ members as of
1996
– ESPRIT Project in Europe devotes 150
person-years per year to research of
user interfaces
– Japan - Ministry of International Trade
and Industry promotes commercial
efforts among companies
36. What is Quality Design?
• How do you quantify usability goals?
– Easy to learn
– Easy to use
– Fun to use
• “Quality of experience”
– way it feels in their hands
– how well they understand how it works
– the way they feel when they’re using it
– how well it serves their purposes
– how it fits into the entire context
37. Quality of Software
Products
• Software developers/users
accustomed to using beta (pre-
production) software
• Buggy software has lowered our
standards
• Quality software (Wright)
– intuitive
– complete
– not broken!
40. Interaction Design Criteria
• Quality of experience
– How does effective interaction design
provide people with a successful and
satisfying experience?
• Understanding of Users
– How well was the design team grounded
in understanding the needs, tasks, and
environment of the people for whom the
product was designed?
41. Interaction Design Criteria
• Effective design process
– Is the product a result of a well thought
out and well executed design process?
– What were the major design issues that
arose during the design process and
what was the rationale and method for
resolving them?
42. Interaction Design Criteria
• Needed
– What need does the product satisfy?
– Does it make a significant social,
economic, or environmental
contribution?
• Learnable and Usable
– Is the product easy to learn and use?
– Does the product communicate a sense
of its purpose, how to begin, how to
proceed?
– Is this learning easy to retain over time?
43. Interaction Design Criteria
• Appropriate
– Does the design of the product solve
the right problem at the right level?
– Does the product serve users in
efficient and practical ways?
– How did considering social, economic,
and technical aspects of the problem
contribute to an appropriate solution?
44. Interaction Design Criteria
• Aesthetic experience
– Is using the product an aesthetically
pleasing and sensually satisfying one?
– Is the product cohesively designed,
exhibiting continuity and excellence
across graphic, interaction, information,
and industrial design?
– Is there a consistency of spirit and
style?
– Does the design perform well within
technological constraints?
45. Interaction Design Criteria
• Mutable
– Have the designers considered whether
mutability is appropriate or not?
– How well can the product be adapted to
suit the particular needs and
preferences of individuals or groups?
– Does the design allow the product to
change and evolve for new and perhaps
unforseen uses?
46. Interaction Design Criteria
• Manageable
– Does the design of the product move
beyond understanding “use” merely as
functionality and support the entire
context of use?
• Installation
• training
• maintenance
• costs
• supplies
47. Like a fine wine….
• “It must be able to age..”
• “It is made with a combination of
intelligence, determination, and skill”
• “…it could be appreciated by a
knowledgeable (wine drinker)
anywhere, without much
elaboration”
• “It must have a definable superiority”
• “…it must be interesting, have
intensity, depth, richness, and be
distinctive”
48. Summary
• Must seek to understand users
experiences and expectations
• Communication is an important as
computation
• Design criteria for user interfaces is
complex and varied
50. User Interface Models
Whether a person likes
technology or not, his or her
economic survival depends on
a basic knowledge (or at least
an absence of fear) of
computers. (Jamie Ray Wright)
51. User Goals
• Computer is an aid in reaching our
goals and performing our tasks
– what are your goals?
• Increased productivity
• greater accuracy
• higher satisfaction
• more enjoyment
– software products should be flexible
• developers of business software should
learn from software for the entertainment
industry
52. People and the obstacles
that are put in the way
• How long will a driver wait before
becoming impatient for a train to
come?
– 20 to 30 seconds
– longer and drivers drive around the
gates
– earlier and not enough time to react
53. People and the obstacles
that are put in the way
• Key point; understand who your
users are and figure out how much
misdirection and frustration they can
stand before they give up and do
something else
54. Users need multiple user
interface styles
• There will never be only one perfect tool,
program, or interface
– users are constantly changing their goals
• Users should not be asked to choose only
one user interface style to use
– users have the right to change their mind at
any time
– different interface techniques are more
appropriate for different tasks
55. House Building Analogy
• Three viewpoints when designing
and building a house
– architect
• studies lifestyle of homeowners, family,
functional and aesthetic desires
– builder
• works within confines of design and
specifications, using appropriate building
materials, codes, etc
– owner
• paying for it and have to live in it!
56. Mental Models
• Conceptual model
• Internal representation of how users
understand and interact with a
system
• A representation (in the head) of a
physical system or software being
run on a computer
– contains plausible cascades of causal
associations connecting the input to the
output
58. Mental Models
• People often not aware of their
mental models
–helps people predict what will
happen next in a given situation
–framework for analysis,
understanding, and decision-
making
59. Mental Models
• Reasons people form mental models
– enable users to predict future (or infer
invisible) events
– allow users to find causes for observed
events
– allow users to determine appropriate
actions to cause desired changes
– serve as mnemonic devices for
remembering relations and events
– means for understanding an analogous
device
60. Mental Models
– allow people to use strategies to
overcome information processing
limitations
61. Mental Models
• Mental models are the basis for UI
principles and guidelines
• Users will always have mental
models
• Must effectively transform
knowledge of the world around us to
the world of computers
– metaphors is a mechanism for doing
this
62. Metaphors
• Metaphor; a figure of speech in
which a work or phrase denoting one
kind of object or action is used in
place of another to suggest likeness
or analogy between them.
• Computer metaphor; aid users in
understanding a new target domain
(e.g. a word processor) by allowing
them to comprehend it (up to the
point of mismatch) in terms of a
source domain they already
understand (e.g. a typewriter)
63. Metaphors
• Adoption of a metaphor allows users
to structure aspects of the target
system or interface in terms of
familiar and commonly understood
aspects of the source domain
– desktop metaphor
• users know their way around an office
• users know how to user objects in that
environment (folders, cabinets, telephone,
etc)
• comfortable with office environment
64. User’s Mental Model
• S/W products must be designed to fit
in with the way users view the
computer system they are working
with
• Important differences in children and
adult models
– children interface object not always
obvious to encourage exploring
– adults are not as likely to explore an
interface without preconceived
expectations
65. User’s Mental Model
• How do you find out about the user’s
model
– analysis of user tasks
– surveys and interviews of actual or potential
users
– visits to user work sites
– feedback from users
– usability testing
• Gather feedback from users, not
managers or executives
67. Getting Reliable Feedback
• Users often tell you what they do
rather then what they would like to
do
– WYKIWYL
• Often not knowledgeable about what
is possible with technology
– rely on how they think they do their
work rather than actually how they do it
– must watch as well as listen
• Must have a large enough sample
68. The Programmers Model
• Easiest to visualize
– explicit
– can be formally defined (functional
specifications)
• Interest is in the objects and data
• Data as fields or records in a DB as
opposed to entries in a checkbook
• Knowledge and expertise includes
development platform, OS, tools, etc
69. The Designers Model
• The designer is the architect
• Merges wishes, desires, needs of
user with skills and materials of
programmer to develop the product
• The designers model describes
– objects the user works with
– the presentation to the user
– interaction techniques used to
manipulate the objects
70. The Role of the Designers
Model (IBM)
Designer’s model
Programmer’s
model
User’s
conceptual
model
72. The Look-and-Feel Iceberg
(IBM)
• Presentation makes up only 10% of
the substance of the designers
model
– Las Vegas effect (overuse of color)
• Interaction layer is the “feel” layer
– keyboards, function keys, joysticks
• Objects and object properties is the
most important part
– appropriate metaphors matched to user
mental models done at this level
73. Summary of Interface
Models
• The house has been transformed
from a shelter to a machine for living
• Many products with good
technological ideas have failed
because of a lack of good user
interface
• Designing a user interface as simply
the look and feel is not enough
– user and consumer first impressions!!
74. Summary of Interface
Models
• Determining if the product works
with the user’s model requires a lot
of work
– usability testing
• Designers model best formed from
the bottom of the iceberg up
– the rest evolves more naturally
77. Trouble with computers
• “specialized knowledge lulls one into a false
sense of security. It enables one to interpret
and deal with complex or ambiguous
situations on the basis of context cues not
visible to users, as well as a knowledge of
the computer system that users do not
possess…..the result is a system that
appears perfectly useful to its designer but
one that the user is unable or unwilling to
face up to and master..”
78. Contributing factors
• Use of jargon
• Non-obvious design
• Fine distinctions
• Disparity in problem solving strategies
• Design inconsistency
• Unfortunately, people remember the one thing
that went wrong, not the many that go right –
errors are a symptom of problems! (up to
46%)
79. Responses to poor design
• Psychological
– Confusion
– Annoyance
– Frustration…
• Physical
– Abandonment of system
– Partial use of system
– Indirect use of system (FAA)
– Modification of the task
– Compensatory activity
– Misuse of the system
– Direct programming
81. The Psychology of Humans
and Computers
“People and computers have quite
different, often diametrically opposite,
capabilities”
Ronald Becker
82. The Psychology of Users
• Cognitive psychology
– study of how our minds work
– how we think
– how we remember
– how we learn
• Information processing model
– human cognition s similar enough to a
computer that a single theory of
computation can be used to guide
research
84. Perception
• Awareness and understanding of
elements and objects of environment
through physical sensation of
various senses
– Sight
– Sound
– Smell
• Classify stimuli based on models
stored in memory (things we already
know)
85. Human Perception and
Attention
• Basic human perceptual and
psychological limitations and
capabilities must be understood to
determine how long to display a
message to a user
• Perception is not just seeing
– hearing
– tasting
– smelling
– touching
86. Perceptual characteristics
• Proximity; belong together if near each
other
• Similarity; belong together if same color,
etc
• Matching patterns; respond similarly to
same shape in different size (alphabet)
• Succinctness; objects have perfect shape
or size because easier to remember
87. Perceptual characteristics
• Closure; perception is synthetic, we will
close a circle if not completely closed
• Unity; objects that form closed shapes are
perceived as a group
• Continuity; shortened lines may be
automatically extended
• Expectancies; perceive not what is there
but what we expect to be there
• Signals versus noise; need to separate the
two
88. Human Perception and
Attention
• Human perceptual system will attach
meaning to information it receives,
whether or not the meaning is
intended or accurate
• Senses are constantly processing
information (we are unaware of this
most of the time)
– what attracts our attention is changes in
the environment
– cocktail party phenomenon
90. Human Perception and
Attention
• We automatically process
information to the point where we
can attach meaning to it
• Significant changes draw attention
– light
– sound
– movement
– color
– novelty or complexity of information
being processed (this is why too many
bells and whistles are distracting!)
92. Memory
• Memory is not the most stable of human attributes
(did you ever forget a birthday?)
• 1950’s – researchers thought there was only one
memory system
• 1970’s – this was expanded to short term or
“working” memory
– Information stored within lasts 10-30 seconds
– Lowered from Miller 7 +/- 2 to 3-4 today
• Knowledge, experience, familiarity govern the size
and complexity of info that can be remembered
93. Memory
• Working memory can be increased
through applying two senses, vision and
audition, rather than one
• Performance can be degraded when a
person must attend to multiple information
sources, and then must integrate the
information
94. Sensory storage
• This is the buffer where the automatic
processing of information collected from our
senses takes place
• Unconscious process
– Large
– Attentive to environment
– Quick to detect changes
– Constantly being replaced by newly gathered
stimuli
– Acts like a radar (cocktail party effect)
96. Sensory storage
• Repeated and excessive stimulation can
fatigue the sensory storage system
(habituation)
• This can be avoided in user interfaces by
designing them such that all aspects and
elements serve a definite purpose
– Eliminating interface “noise” will ensure that
important things are less likely to be missed
98. Sensory Storage
• These sensory processors are not
very smart but are very attentive
• Must be quick to spot changes
• Information cannot be stored very
long because there is always new
information coming in
– when something happens that cause
you to pay attention, information is
passed on to higher memory functions
99. Sensory Storage
• Watching a movie
– steady flow of static frames being
processed
– higher level processes smooth out
information
• allows you to view movie as a continuous
image
• Constant or repeated stimulation
tires the sensory mechanisms
(habituation)
– applies to information on computer
screens as well as all other information
100. Sensory Storage
• Messages on a computer screen
– must remain there long enough
• we must realize it is there
• must have time to pass information on to
higher memory functions
– read the message
– respond to the message
• An animated screen background is
fun but it causes the sensory system
to process a lot of unwanted
information
– eye strain and fatigue
101. Short-Term Memory
• Second stage of information
processing
– information processed here has been
recognized and perceived
• STM also gets information from long-
term memory through the process of
cognition
• STM is weakest link in the whole
information processing system
– memory buffer limited (7 plus/minus 2)
102. Short-Term Memory
• FIFO effect (new information coming
in bumps out older information)
• Information can only be maintained
in STM for about 30 seconds (without
practice)
• Also called working memory
– where your thinking occurs
– multiply 8 times 46
103. Short Term Memory
• Short term memory limitations
• Trying to remember a phone number
long enough to make the call
• Techniques to remember
– rehearsing
• repeating the number over and over
• phone companies will repeat number to
help you rehearse
• new information may cause you to lose
information
104. Short Term Memory
– chunking
• taking many pieces of information and
grouping them together by associations,
order, meaning
• 1-800-IBM-SERV
• Annoying to remember information
from screen to screen
– good user interface design prevents the
user from having to do this
105. Long Term Memory
• Memory warehouse with limitless
capacity and duration
• Main problem is how to access the
information
• Strategies
– Mnemonics (attaching meaning to
information you are trying to remember)
– Chunking (SSN, ATM password)
106. Strength Weaknesses
Humans Pattern recognition Low capacity STM
Selective retention Fast decaying STM
Capacity to learn Slow processing
Infinite capacity
LTM
Error prone
Rich multi-keyed
LTM
Unreliable access
to LTM
Computers High capacity
memory
Simple template
matching
Permanent memory Limited learning
capacity
Fast processing Limited capacity
LTM
Error free
processing
Limited data
integration
Reliable memory
access
107. Long Term Memory
• Computer interfaces should be
sensitive to the LTM retrieval
problem and provide help
– recognition; trying to retrieve
information with some cues present
• menus and lists for recognition of items
– recall; trying to retrieve information
without any clues
• key combo for pasting text in word
processor
108. Long term Memory
• LTM contains the knowledge we possess
• Information is encoded in LTM (process called
learning)
• Learning improved through repetition
• Learning improved if information is structured and
familiar
• Human active vocabulary (words that can be recalled)
is about 2-3K
• Passive vocabulary (words that can be recognized) is
about 100K
– Recognition better than recall
109. Minimize the need for a
mighty memory
• Present information is an organized,
structured, familiar way
• Place all information for task performance
in close proximity
• Give the user control over the place of
information presentation
110. Summary of memory
• Must understand human capabilities
and limitations to know
– when to lead
– when to follow
– when to support
• A good interface will
– reduce user’s reliance on their own
memory
– use computer strengths to support user
weaknesses
112. Visual acuity
• The capacity of the eye to resolve details is called
visual acuity
• Objects become more distinct as we turn our eyes
towards it and vice versa
• Relative visual acuity is approximately halved at a
distance of 2.5 degrees from the point of eye fixation
– Average viewing distance from screen is 19”
– Optimal visual acuity on screen is 1.67”
– Average character size implies about 88 characters in this
area
113. Visual acuity
• Eye is not perfectly steady – it
trembles slightly
• Tremor improves the detection of
edges of objects being looked at
– Can sometimes create problems
– Things close together can shimmer
– Patterns for fill-in areas (bars, circles,
etc) must be carefully chosen
115. Foveal and peripheral vision
• Foveal vision is used to focus on
something
• Peripheral vision senses anything in
the area surrounding the area being
looked at
• These two form a cooperative and
competitive relationship
116. Peripheral vision
• Peripheral vision can provide clues
as to where to go next in a visual
search
• Patterns, etc can guide eye in a
systematic way through a screen
• Can also compete for attention,
acting as visual noise
117. Movement control
• Once data has been perceived and an
appropriate action decided upon, a
response must be made
– Usually in the form of a movement
• Keyboard keys
• Mouse (moving and clicking)
• Fitts Law; time required to acquire a
target is a function of distance to and
size of the target
118. Movement control
• The bigger the target is, or the closer it is, the faster
it will be reached
– Provide large objects for important functions
– Take advantage of “pinning” actions on screens
• Big buttons are better than small buttons (larger
target)
• Create toolbars that “bleed” into the edges of a
display rather than a one pixel boundary to click on
119. Learning
• Process of encoding information in short
term memory
• Requires some effort on our part
• Differentiates us from machines
– Over time can get better at any task
• Designers too often use learning ability as
an excuse to justify complex design
– We can all learn to use a tightrope but a bridge
is better !
120. Learning
• A design that minimizes learning can accelerate
performance
• Like learning many other things, we like to be
active, to explore, and to use a trial and error
approach
• Enhance learning by;
– Allowing skills acquired in one situation to be used
in others like it
– Provide complete and prompt feedback
– Using a phased approach
121. Skill
• The essence of skill is performance of actions
or movements in the correct time sequence
with adequate precision
• Skills are hierarchical in nature and many basic
skills may be integrated to form complex ones
• System and screen design must permit
development of increasingly skillful
performance
122. Individual differences
• In reality, there is no average user
• We all differ
– Looks
– Motor abilities
– Intellectual abilities
– Learning abilities and speed, etc
• Used to be that systems had to be designed
to the lowest common denominator
• Now systems can be tailored