What is HCI and where does GUI design fit in?


What is HCI and where does GUI design fit in?
What is HCI and where does
GUI design fit in?
Lecture 1 CSE3030
Outcomes of the lecture
• Be able to describe the field of HCI
• Be able to argue whether or not specific
subjects should fall within the field
• Understand how the design of graphical
interfaces fit within the broader field of HCI
HCI defined
• Human-computer interaction is a discipline
concerned with the design, evaluation and
implementation of interactive computing
systems for human use and with the study
of major phenomena surrounding them
• This is a ‘working definition’
• From the ACM SIGCHI (Association of
Computing Machinery, Special Interest
Group for Human-Computer Interaction)
What is and isn’t HCI?
• On the H side?
• On the C side?
Three Mile Island
The Control Panel
Palm Beach Ballot
Beyond intuition
• Human-machine system designers cannot just
rely on intuition – too many complex factors are
• Instead, need to look to:
– High level theories/models/principles
– Middle level principles
– Specific & practical guidelines
HCI principles
• General design principles involve being aware of, and
catering to, human abilities, skills and differences
(human factors). These apply to design of any humanmachine system e.g. cars, playgrounds, lifts, phones,
• Designing human-computer interaction is a particular
area of human factors design with specific principles and
• Designing user interfaces is specific area of HCI and
concerns general principles & low level concerns.
HCI: Three basic principles
• People want ease of use – usually provided by
simplicity and transfer of existing experience.
• The user view is different to the system
engineers view. Often engineers design systems
to perform a set of functions rather than with the
user in mind.
• Computers and people are both better at some
tasks than others – however they are better at
different tasks.
Human factors
• Invention of machines (cars, airplanes,
electronic devices ...) taxed people’s
sensorimotor abilities to control them.
• Even after high degree of training, frequent
errors (often fatal) occurred.
• Result: human factors became critically
Human factors
• However, designers still often consider cost and
appearance over human factors design.
• People tend to blame themselves when errors
– “I was never very good with machines”
– “I knew I should have read the manual!”
– “Look at what I did! Do I feel stupid!”
• Bad design not always visible, but sometimes it
is very obvious!
Human factors
• How many of you can program or use all
aspects of your:
digital watch? Fax machines?
stereo system (especially car stereos)
unfamiliar water taps?
• “..no need to understand the underlying physics
..(or code) of everything …simply the
relationship between the controls and the
outcomes” - Donald Norman – “The design of
everyday things”
Related Fields
• Computer science
– application design and engineering of human
• Psychology
– the application of theories of cognitive processes and
the empirical analysis of user behavior
• Sociology and anthropology
– interactions between technology, work, and
• Industrial design
– interactive products
Design process
• Important to consider the What, Why and How of
design process for an application before you
even begin to think about the interface, coding,
• User needs and usability goals must be
addressed at the beginning of the design
process. Designers can make incorrect
assumptions about the requirements.
WAP mobile phone example
• People want to be kept informed of up-to-date news
wherever they are - reasonable
• People want to interact with information on the move reasonable
• People are happy using a very small display and using
an extremely restricted interface - unreasonable
• People will be happy doing things on a cell phone that
they normally do on their PCs (e.g. surf the web, read
email, shop, bet, play video games) - reasonable only for
a very select bunch of users
• See http://www.useit.com/alertbox/20001210.html
User needs & usability
• 63% of large software projects go over cost
• Managers gave four usability-related reasons
users requested changes
overlooked tasks
users did not understand their own requirements
insufficient user-developer communication
and understanding
(Greenberg, 2001)
Human factors
Norman – “Design of everyday things”
• Most failures of human-machine system are due
to poor designs that don’t recognize peoples’
capabilities and fallibility's
• This leads to apparent machine misuse and
“human error”
• Good design always accounts for human
Darn these hooves! I hit the wrong switch again!
Who designs these instrument panels, raccoons?
Human characteristics
Designer must take into account variations in
human senses and motor abilities:
• Vision – e.g. depth, contrast, colour blindness,
and motion sensitivity.
• Hearing - e.g. audio cues must be distinct.
• Touch: e.g. keyboard and touchscreen
• Motor control/ hand-eye coordination e.g use of
pointing devices.
• Physical strength, coordination.
Cognitive and perceptual
There are many aspects to human cognitive
abilities. For example:
• short-term memory
• long-term memory and learning
• problem solving, decision making
• attention and set (scope of concern)
• perception & recognition
• from Science magazine
– In 1988, the Soviet Union’s Phobos 1 satellite was lost on its way
to Mars, when it went into a tumble from which it never
“not long after the launch, a ground controller omitted
a single letter in a series of digital commands sent to
the spacecraft. And by malignant bad luck, that
omission caused the code to be mistranslated in such
a way as to trigger the [ROM] test sequence [that was
intended to be used only during checkout of the
spacecraft on the ground]”
Factors affecting cognitive,
perceptual & motor performance
Arousal, vigilance, fatigue
Cognitive (mental) load
Boredom, isolation, sensory deprivation
Anxiety and fear
Illness, ageing
Drugs and alcohol
Circadian rhythms, sleep deprivation
Personality factors
• There is no single taxonomy for identifying user
personality types.
• Designers must be aware that populations are
subdivided and that these subdivisions have
various responses to different stimuli.
Myers-Briggs Type Indicator (MBTI)
extroversion versus introversion
sensing versus intuition
perceptive versus judging
feeling versus thinking
Awareness of cultural and
international diversity
• Characters, numerals, special characters,
grammar, spelling
• L-to-r vs r-to-l vs vertical input & reading
• Date and time formats
• Numeric and currency formats
• Telephone numbers and addresses
• Names and titles (Mr., Ms., Mme.)
• Social-security, national id & passport numbers
• Etiquette, policies, tone, formality, metaphors
Which are universal and which
are culturally-specific?
Users with disabilities
• Need to plan early to accommodate users with
disabilities as costs may be very high later
• Some countries have laws which specify
requirements to comply with equal opportunity
Current Computing Systems
• Human factors and HCI design impact on
all of the large variety of current and
emerging computer systems.
• However, the impact of various human
factors and design decisions depends on
the nature of the system.
System types: Critical systems
Examples: air traffic control, nuclear reactors:
• High costs, reliability and effectiveness are
• Lengthy training periods are acceptable to
provide error-free performance.
• Subject satisfaction is less an issue due to well
motivated users. Retention via frequent use and
Systems types:
Examples: banking, production control, banking,
insurance, order entry, inventory management,
reservation, billing, and point-of-sales systems:
• Lower cost may sacrifice reliability.
• Training is expensive, learning must be easy.
• Speed and error rates are relative to cost,
however speed is the supreme concern. Subject
satisfaction is fairly important to limit operator
System types:
Examples: Word processing, electronic mail,
computer conferencing, and video games,
• Choosing functionality is difficult because the
population has a wide range of both novice and
expert users.
• Competition causes the need for low cost.
• Subject satisfaction is very important.
System types: ???
Examples: Artist toolkits, statistical
packages, and scientific modelling
• Benchmarks are hard to describe due to
the wide array of tasks
• With these applications, the computer
should "vanish" so that the user can be
absorbed in their task domain.
System engineering versus
interface design
System engineering evaluated by:
• Coverage of task functionality.
• Reliability, security, integrity of system and
• Standardization, consistency and
• Time and budget considerations.
User interface evaluation
Depends largely on human factors criteria:
1. Learning time
2. Performance speed
3. Error rates of users
4. Retention over time
5. Subjective satisfaction
HCI is concerned with…
• Humans and machines jointly performing tasks
• The structure of communication between human
and machine
• Human capabilities to use and learn to use
• Algorithms and programming of the interface
• Engineering concerns that arise in designing
and building interfaces
• The process of specifying, designing, and
implementing interfaces
• Design trade-offs
5 Areas of HCI
The nature of human-computer interaction
Use and context of computers
Human characteristics
Computer system and interface
• Development processes
Nature of Human-Computer
• Overviews of, and theoretical frameworks
for, topics in human-computer
N1 The Nature of HumanComputer Interaction
• Points of view
– HCI as communication
– agent paradigm, tool paradigm
– Human / system / tasks division
• Objectives or goals
– productivity, user empowerment
• History and intellectual roots
• HCI as an academic topic
– journals, literature
– relation to other fields
– science vs. engineering vs. design aspects
Use and Context of Computers
Applications of computers
Applications and appropriate interfaces
The general social, work, and business context
In addition to technical requirements, an
interface may have to
– satisfy quality-of-work-life goals of a labor union
– meet legal constraints on "look and feel“
– position the image of a company in a certain market
• General problems of fitting computers, uses, and
context of use together
U1 Social Organization and Work
• The human as an interacting social being
• The nature of work
• Human and technical systems mutually adapt to each
other and must be considered as a whole
• Models of human activity, groups, organizations
• Models of work, workflow, cooperative activity
• Organizations as adaptive open systems
• Impact of computer systems on work and vice versa
• Computer systems for group tasks, case studies
• Quality of work life and job satisfaction
U2 Application Areas
Characterization of application areas
Document-oriented interfaces
Communications-oriented interfaces
Design environments: programming environments,
On-line tutorial and help systems
Multimedia information kiosks
Continuous control systems: (process control systems,
simulators, cockpits, video games)
Embedded systems (Copier controls, elevator controls,
consumer electronics and home appliances)
U3 Human-Machine Fit and
• Design addresses ‘fit’ between the object and its use
• Adjustments can be made
– (1) at design time or at time of use
– (2) by changing the system or the user
– (3) by the users or by the system.
Adaptive systems
Theories of system adoption
Customizing and tailoring
Compatible users and systems
User adaptation: learning, training
User guidance: help, documentation, error-handling
Human Characteristics
• human information-processing
• how human action is structured
• the nature of human communication
• human physical and physiological
H1 Human Information Processing
• The human as a processor of information.
• Models of cognitive architecture
• Phenomena and theories of
motor skills
attention and vigilance
problem solving
learning and skill acquisition
• Users' conceptual models
• Models of human action
• Human diversity, including disabled populations
H2 Language, Communication and
Language as a communication and interface medium
Aspects of language: syntax, semantics, pragmatics
Formal models of language
Conversational interaction
– turn-taking, repair
• Special languages
– graphical interaction, query, command, production systems,
• Interaction reuse
– history lists
H3 Ergonomics
Human anthropometry and workspace design
Arrangement of displays and controls
Human cognitive and sensory limits
Sensory and perceptual effects of display technologies
Control design
Fatigue and health issues
Furniture and lighting design
Temperature and environmental noise issues
Design for stressful or hazardous environments
Design for the disabled
Computer System and Interface
• Machines have specialized components
for interacting with humans
• Transducers for moving information
physically between human and machine
• Have to do with the control structure and
representation of parts of the interaction
C1 Input and Output Devices
• Technical construction of devices
• Input devices
Mechanics and performance
Devices for the disabled
Handwriting and gestures, virtual keyboard
Speech input
Eye tracking, EEG, other biological signals
• Output devices
Mechanics and performance
Devices for the disabled
Sound and speech output
3D displays, motion (e.g., flight simulators)
• Device weight, portability, bandwidth, sensory mode
C2 Dialogue Techniques
• Techniques for interacting with humans
• Dialogue Interaction Techniques
Dialogue type and techniques
Navigation, orientation, error management
Agents and AI techniques
Multi-person dialogues
• Dialogue Issues
Real-time response
Manual control theory
Supervisory control, automatic systems, embedded systems
"Look and feel," intellectual property protection
C3 Dialogue Genre
• Conceptual uses for the technical means
• Concepts arise in any media discipline (film, graphic
• Interaction metaphors
• Content metaphors
• Persona, personality, point of view
• Workspace models
• Transition management
• Techniques from other media (film, theater, graphic
• Style and aesthetics
C4 Computer Graphics
• Concepts from computer graphics that are useful
for HCI
• Geometry in 2- and 3-D space, linear
• Graphics primitives and attributes
• Solid modeling, splines, surface modeling,
hidden surface removal, animation, rendering
algorithms, lighting models
• Colour representation, colour maps, colour
ranges of devices
C5 Dialogue Architecture
Software architectures and standards
Layers and windows
Screen imaging models (e.g. postscript)
Window manager models, analysis of major
window systems
• Models for specifying dialogues
• Multi-user interface architectures
• Standardization and interoperability
Development Process
• Both design and engineering
• The methodology and practice of interface
• The relationship of interface development
to the engineering of the rest of the system
D1 Design Approaches
• The process of design
• Alternative system development processes
• Choice of method under time/resource
• Task analysis techniques
• Design specification techniques
• Design analysis techniques
• Graphic design basics
• Industrial design basics
• Design case studies and analyses of design
D2 Implementation Techniques and
• Tactics and tools for implementation.
• Relationships among design, evaluation, and
• Independence and reusability, application
independence, device independence
• Prototyping techniques
• Dialogue toolkits
• Object-oriented methods
• Data representation and algorithms
D3 Evaluation Techniques
• Philosophy and methods for evaluations
• Productivity
• Measures
Design for guessing
Testing techniques, link testing to specifications
Formative and summative evaluation
Methods from psychology and sociology
D4 Example Systems and Case
• Classic designs that serve as examples of
• Command-oriented
• Graphics-oriented
• Frame-based
• User-defined
Where does GUI fit in?
U3 human-machine fit and adaptation
H1 human information processing
H2 language, communication and interaction
C1 input and output devices
C2 dialog techniques
C3 dialogue genre
C4 computer graphics
C5 dialogue architecture
D1 design approaches
D3 evaluation techniques
ACM Special Interest Group on Computer-Human Interaction (SIGCHI). ACM
SIGCHI is an international, interdisciplinary forum for the exchange of ideas
about the field of human-computer interaction. http://www.acm.org/sigchi/
Norman, D. A. (1998). The Design of Everyday Things. New York, New York,
USA: Basic Books.
Shneiderman, B., & Plaisant, C. (2005). Designing the User Interface:
Strategies for Effective Human-Computer Interaction (Fourth ed.). USA:
Pearson Education, Inc.
Stone, D., Jarrett, C., Woodroffe, M., & Minocha, S. (2005). User Interface
Design and Evaluation. San Francisco, California, USA: Elsevier.