Human Factors and User Interface Design

1
Human Factors and User Interface Design

• Southern Methodist University
• CSE 8316
• Spring 2004

2
What is a User Interface?
3
(No Transcript)
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?

6
Advantages and disadvantages of graphical systems
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

10
Obstacles in the development path
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

14
Usability
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

16
Is this a usable system?
17
Is this a usable error message?
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

21
Users experiences and expectations
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 cant 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
  users 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

31
Designing Quality Software User Interfaces

• Communication is as important as computation.

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 theyre 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!

38
Interaction design criteria
39
Interaction Design Criteria
Understanding of users
Learnable Usable
Manageable
Needed
Quality of experience
Aesthetic experience
Mutable
Appropriate
Effective design process
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
• ..evolves over time

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

49
User interface models
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

57
User Interface Model (IBM)
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
Users 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
Users Mental Model

• How do you find out about the users 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

66
Users Mental Model in the Playroom (Broderbund)
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)
Designers model
Users conceptual model
Programmers model
71
The Look-and-Feel Iceberg (IBM)
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 users
  model requires a lot of work
• usability testing
• Designers model best formed from the bottom of
  the iceberg up
• the rest evolves more naturally

75
Know your user or client
76
Why people have trouble with computers
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

80
Important human characteristics in design
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

83
Information Processing Model

• Learning is a developmental process
• prior experience
• knowledge
• expectations

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

89
Human Perception Example (Mayhew 1992)
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!)

91
Human Information Processing

• Components of the human information processing
  and memory system
• sensory storage
• short-term memory
• long-term memory

92
Memory

• Memory is not the most stable of human attributes
  (did you ever forget a birthday?)
• 1950s researchers thought there was only one
  memory system
• 1970s 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)

95
Human Information Processing and Memory System
Motor Processor
Cognitive Processor
Perceptual Processor
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

97
An example of noise
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 users reliance on their own memory
• use computer strengths to support user weaknesses

111
Other human factors
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

114
Visual acuity
50/50 chance of getting these right
3213123 54321212345 6543211123456 765432101234567
6543211123456 54321212345 3213123
Its the physical size, not the number
of characters
This will have implications when we start talking
about screen grouping guidelines
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

123
End of lecture