Introduction to HMI HCI HTI

1
Introduction to HMI HCI - HTI

• The three eras
• Pre-PC // PC // Post-PC
• Facets of human-technology interaction
• Influences
• Design
• Evaluation
• Worth knowing about users
• Normal and accidental users
• Correct and incorrect usage
• User characteristics
• A little psychology
• Stereotypes and norms

2
Developments in computer use
Computer size
1970
Room size
1980
Stand alone equipment
1990
Embedded processor
Integrated in material
Domains with computers
10
100
1.000
10.000
100.000
3
The PC-era
Computer size
1970
Room size
1980
Stand alone equipment
1990
Embedded processor
Pre-PC era
Integrated in material
The PC era
Post-PC era
Domains with computers
10
100
1.000
10.000
100.000
4
Pre-PC era
Direct interaction with applications Measurements
indicators controls Direct visualisation Direc
t manipulation Classical human factors engineering
5
PC era
Mediated interaction with applications Data
processing as application Constraints on input
output (visual, auditive, tactile) Symbolic
visualisation and manipulation Human-computer
Interaction
6
Post-PC era
Computing embedded in applications Digital I/O as
universal medium Vanishing computers Constraints
on input output Constraints on human work
(automation) Cognitive ergonomics engineering
7
Where do we find computers?

• Household machines
• Transportation systems
• Cars, public transportation, travel by
  land-sea-air
• Entertainment
• Active-passive media, electronic and printed
  media
• Tools at work
• Coffee machines to copiers, hospitals, power
  plants, manufacturing
• Selling and buying
• Financial transactions, salary, e-trade,
  insurance
• Public services
• Administration, distribution, rescue services,
  education, health and social security, labour
  market, communication, ...

8
Changes in meaning of HTI

• Human-technology interaction (MMS)
• Broad industrial scope ergonomics, human
  factors engineering
• Mechanical, electromechanical
• Direct measurement and control (on sensor one
  indicator)
• Human-computer interaction (HCI)
• Narrowed scope human and computer in isolation
• Different applications - non-dynamic (user paced)
  
• Prominence of visual presentation problems.
• Human-technology interaction
• Applications through computer, not with computer
• Computing embedded in artefacts (computing
  everywhere)
• Complex technology, complex systems, complex
  interactions

9
Human-technology interaction

• Study of
• Design,
• Evaluation
• Implementation
• Concerns
• Use by humans or human involvement required
• For a purpose, to help users or to improve
  efficiency
• Within an organization or group
• Motivation
• User interface development uses between 25 and
  50 percent of development resources.
• A bad user-interface can be annoying
  embarrassing, and lead to accidents.
• A good user interface can save considerable time
  and money.

10
Influences from other fields

• Psychology, sociology and anthropology
• User behaviour and capabilities
• Group behaviour
• The user as part of a society
• Distributed cognition
• Art and Design
• Aesthetics, physical form, graphical form,
  affordance
• Ergonomics
• Requirements to knowledge and capabilities
• Risk and safety
• Self-pacing versus task-pacing
• Computer and Information Science
• Construction

11
Iterative development

• Criteria
• - Time to learn
• - Retention
• - Performance efficiency
• - Error rate
• User satisfaction
• Close enough

Re-analyse
Analyse
Goal achieved
Criteria - Delivery deadline - Funding / cost -
Existing design - Industry standard
Evaluate
Prototype
Design basis
12
Usability oriented system development

• Components
• User studies (users, producers, stakeholders)
• Usability goals (as part of system requirements)
• Design with multiple alternatives
• Prototyping
• Evaluation of the prototypes with respect to
  usability
• Iterative work to achieve the goals
• Task analysis
• Know the users and their tasks.
• Design and prototype
• Fit the system to users and their tasks.
• Evaluate and iterate
• Evaluate design and iterate until a good design
  is achieved.

13
Design support

• Design standards
• Generally stated requirements, imposed in some
  formal way
• Design principles
• High level' recommendations based on well
  established knowledge about human behaviour
• Design guidelines
• generally stated recommendations for user
  interface software, adopted by agreement among
  practitioners
• Design rules
• Explicit design specifications that do not
  require interpretation by design practitioners.
• Design algorithms
• Programs implementing design rules, which may
  control automatic generation of user interface
  software

14
Example screen organisation and layout
Multi Pages Grouping Windows Message
Areas Command Areas General Information
Areas Display elements Types of Display Coding
Pointing Cursors Place holder Cursors Text,
style, Character Labels Icons
Tables and Lists Data forms Mimics Flowcharts Pict
ures and diagrams Maps and Situation
Displays Instrument panels Scaling Curves and
Line Graphs Bar/Column Graphs and Histograms Pie
Charts Animation Video
Abbreviations and Acronyms Alphanumeric Font Enhan
cement/highlighting Underlining Brightness Colour
Flashing/Blinking Image Reversals Line Shape and
Symbol Size Spatial/Position/pattern/Location Text
ure
15
External Analysis

• Goal is to identify and understand
• Target user group (customers, stakeholders)
• Work environment (and organisational support)
• Required system functionality and performance
  criteria
• Methodologies
• Observation (participatory, detached)
• Interviews (structured, free, walk-through
  talk-through)
• Analysis of competing products (reverse
  engineering)
• Design Prototype
• Create a design using various forms of
  guidelines,
• Implement prototypes to
• Test the design, Choose between alternatives,
  Minimize the cost of experimentation

16
Hallmarks of good HMI

• Time
• Required transactions can be made quickly.
• Errors
• Transactions are error free.
• Satisfaction
• A good UI gives the user a feeling of
  satisfaction.
• Transparency
• The user can 'see through' the UI, and focus on
  the task at hand. (Doing rather than using).
• Workload
• A good UI gives the user limited mental
  workload.
• Training
• The application is fast to learn and
  self-instructing.

17
Learning to use vs. knowing
Performance
Normal design
Expert level
Level of efficient use
User-friendly design
Level of basic use
Time
18
Accidental user
little or no motivation
may misinterpret product functionality
may not have the knowledge / skills that
designers assume
may do things that are not expected (in terms of
input)
may respond inappropriately to product signals
(in terms of output)
19
Consequences of incorrect use
Wrong response
Too strong / Too weak Wrong type / Wrong time
Correct response
Robust Reliable
Incorrect use

No response
Safe (fail-safe) Graceful degradation
Damage to machine
Temporary damage Permanent damage
Damage to user
or third party
20
Possible causes of incorrect use

• Lack of knowledge or instructions
• Not knowing what the system can do
• Not knowing how to accomplish a function
• Lack of understanding
• Not recognising present state / mode
• Not understanding pre/post-conditions
• Incorrect / faulty reasoning
• Performance variation
• Forgetting, motor variability, perception, etc.
• External conditions
• Performance disruption, loss of control
• Noise, interference

21
The indefatigable user
Screen (display) design focuses on how
information is presented (contents, structure,
discriminability) and how the interaction is
mediated (devices, functions).
It is tacitly assumed that the user detects
changes (perfect attention), remembers what was
seen (perfect STM), and knows the structure of
the displays (LTM, mental model)
22
Design requires predictability
Cognitive functions vary considerably
Psychological functions vary
Variability
Physical functions are nearly constant
Time
23
Basic cyclical model
Unexpected events
Event / feedback
Provides / produces
Modifies
Next action
Current understanding
Directs / controls
24
Perceptual-motor system

• Sight
• Primary communication channel.
• Hearing
• mostly used for warning signals.
• Touch
• Keyboard and button feedback.
• Smell, Taste
• Not used by computers.
• Basic factors
• Thresholds, response time, latency
• Cognitive factors
• Expectation, habit, heuristics, parsimony, biases

25
Control-activation stereotypes

• Turn clockwise / press down stereotype
• To change state of something, turn clockwise or
  push down
• Turn clockwise-to-increase stereotype
• Proximity of movement stereotype
• The arc of the rotating element closest to the
  display moves in the same direction as the
  display
• Congruence
• Linear movements of control should be along the
  same axis
• Congruence of location
• When there are several controls and several
  displays, and a control cannot be placed adjacent
  to the display, then the configuration of
  controls should be congruent with the
  configuration of displays. Example kitchen stove.

26
Scale motion compatibility
Display of measurements and changes should
correspond to intuitive notions of scale and
direction
Moving pointer
Sliding scale
Sliding scale
300
500
200
200
400
300
100
300
400
0
200
500
Scale motion compatibility
Scale compatibility
Motion (direction) compatibility
How about the slider on a graphic pane?
27
Control movement stereotypes
Turn clockwise to increase
Congruence
Congruence conflict
Conflict of proximity principle
28
The Gestalt Principles

• Prägnanz
• Proximity
• Similarity
• Closure
• Good continuation
• Patterns are seen as simply as possible
• Nearby or similar items (form, colour) are
  grouped together
• Nearly closed contours tend to be closed
• Common fate
• Familiarity
• Elements moving in the same direction are seen
  together
• Elements are more likely to form groups if the
  groups are familiar or meaningful.

29
Supporting discrimination
A regular arrangement of items (controls,
indicators) makes it difficult to discriminate
between items.
A systematic use of spacing can be used to group
items, which facilitates discrimination and
enhances usability
30
Proximity and similarity
31
Attention

• Selective attention
• Guided by internal model, expectations
• Involuntary change of focus
• Divided attention
• Doing two things at once (driving, talking)
• Multiple resources perceive / respond auditory
  / visual spatial / verbal
• Mental workload
• Limited capacity, competing demands
• Logical and meaningful structures help focus
  attention
• Motion (blinking) strongly attracts users
  attention
• Speed-accuracy trade-off

32
Speed-accuracy trade-off
Accuracy
Slow and accurate
High
Slow yet not accurate
Neither slow nor accurate
Fast and sloppy
Low
Reaction time
Long
Short
33
From WYSIWYG to WYSIWYD
WYSIWYG What You See Is What You Get
WYEIWYS What You Expect Is What You See
Users dont see what designers assume. Users see
what they look for and expect to find.
WYSIWYD What You See Is What You Do
Users dont respond according to the systems
logic. Users do what they find obvious.