SlideShare une entreprise Scribd logo
1  sur  89
Human Computer Interaction
Lecture Notes
HUMAN
COMPUTER
INTERACTION
Csc 306
Source: VU, Lora Aroyo
Adewale V.A.
Lecture 1
Course OUTLINE
• Introduction to HCI
• Design process/Good and
poor design
• Usability engineering
concept
• Usability engineering life
cycle
• Goal Oriented interaction
design
• Implementation support
tools
• Usability evaluation
• Ubiquitous computing
• Groupware
• Virtual and Augmented
Reality
• Collaborative work
• Hypertext and
multimedia
• Cognitive models
HOW PEOPLE INTERACT WITH
COMPUTERS?
yo, Web & Media Group
Human-Computer Interaction
Dashboards
Lora Aro 5
Human-Computer Interaction
Lora Aroyo, Web & Media Group 7
Human-Computer Interaction
Wearables
Lora Aroyo, Web & Media Group 8
Human-Computer Interaction
Sensing Affect
Blood Volume
Pressure (BVP)
earring
Interactive Pillow
as a TV remote
control
Galvanic Skin
Response
(GSR) rings
and bracelet
Lora Aroyo, Web & Media Group 9
“Avengers” (2012
Human-Computer Interaction
Speech, Mobile & Augmented Interaction
“Minority Report” (2002)
“Her” (2014)
“Star Trek: In to the Darkness” (2013)
)
“Star Trek: TOS” (1967)
Lora Aroyo, Web & Media Group
Lora Aroyo, Web & Media Group
Human-Computer Interaction
Virtual Reality
11
12
eb &
Human-Computer Interaction
Interactive Workspaces
Mimio
Stanford Interactive Workspaces Project
BendDesk
Lora Aroyo, Web & Media Group
Human-Computer Interaction
WHY HCI?
• How many interactive products are there in
everyday use? Think for a minute about what
you use in a typical day:
– cell phone, computer, personal organizer, remote control,
soft drink machine, coffee machine, ATM, ticket machine,
library information system, the web, photocopier, watch,
printer, stereo, calculator, video game.. . the list is endless.
• Now think for a minute about how usable they
are. How many are actually easy, effortless, and
enjoyable to use? All of them, several, or just
one or two? This list is probably considerably
shorter. Why is this so?
Human-Computer Interaction
y
s e
Human-Computer Interaction
Typical Frustrations
Can’t figure out how to
simple things
do
Many not frequent use
functions
http://www.youtube.com/watch?v=keMmM3P4BRM
Man hidden functions
Operation outcom not visible
Can’t remember combinations of digits * #
how do we know whether it worked
how can we remember that this option is ON
http://video.google.com/videoplay?docid=5184957822303751144
Lora Aroyo, Web & Media Group 14
Definition of HCI by ACM
15
“Human Computer Interaction is a discipline
concerned with the design, evaluation and
implementation of interactive computing systems
for human use as well as the major phenomena
surrounding the it.”
Human-Computer Interaction
Goals of HCI (1)
• The goals of HCI are to produce usable and safe systems, as well as functional
systems.
• In order to produce computer systems with good usability, developers must attempt
to:
– Understand the factors that determine how people
use technology
– Develop tools and techniques to enable building
suitable systems
– Achieve efficient, effective, and safe interaction
– Put people first 16
Human-Computer Interaction
Goals of HCI (2)
• Underlying the whole theme of HCI is the belief that people using a computer
system should come first.
• Their needs, capabilities and preferences for conducting various tasks should
direct developers in the way that they design systems.
• People should not have to change the way that they use a system in order to
fit in with it.
• Instead, the system should be designed to match their requirements.
17
Human-Computer Interaction
Goals of HCI (3)
To develop or improve the
• Safety
• Utility
• Effectiveness
• Efficiency
• Usability
• Appeal
. . . of systems that include computers
18
Human-Computer Interaction
User-Centered Development Methodology
• Traditional software engineering methods arose in 1960s and 1970s
– Systems were not highly interactive
– End-user were computer specialists
 Issues concerning end-user and usability
were not at all important
 user interface design not considered
explicitly
• Now:
– Most end-users are not computer specialists
– Usability vital for success
19
Human-Computer Interaction
System –Centred Design
• Traditional System-Centered design:
– Emphasis on the functionality,
– UI is added at the end
– Emphasis on correct software rather than on ease
of use
– User has to adapt himself to the system
20
Human-Computer Interaction
User-Centre design
• Things are changing: User-Centered design
– User Interface more important
– Emphasis on end-users’ tasks,
– Early end-user participation: in analysis
and design
– Evaluation by end-users
– Consequences:
• more work for User Interface designer and User Interface
programmer
21
Human-Computer Interaction
Factors in HCI (1)
• There are a large number of factors which should be
considered in the analysis and design of a system using HCI
principles.
• Many of these factors interact with each other, making the
analysis even more complex.
22
Human-Computer Interaction
Factors in HCI (2)
• Organisation Factors
Training, job design, politics, roles, work organisation
• Environmental Factors
Noise, heating, lighting, ventilation
Health and Safety Factors
• The User
Cognitive processes and capabilities
Motivation, enjoyment, satisfaction, personality, experience
23
Human-Computer Interaction
Factors in HCI (3)
• Comfort Factors
Seating, equipment, layout.
•
User Interface
Input devices, output devices, dialogue structures, use of colour, icons,
commands, navigation, graphics, natural language, user support, multimedia
•
Task Factors
Easy, complex, novel, task allocation, monitoring, skills
24
Human-Computer Interaction
Factors in HCI (4)
• Constraints
Cost, timescales, budgets, staff, equipment, buildings
• System Functionality
Hardware, software, application
• Productivity Factors
Increase output, increase quality, decrease costs, decrease
errors, increase innovation
25
Human-Computer Interaction
Fields that contribute to HCI (1)
• Computer Science
– Implementation of software
• Engineering
– Faster, cheaper equipment
• Ergonomics
– Design for human factors
26
Human-Computer Interaction
Fields that contribute to HCI (2)
• Graphic design
– Visual communication
• Technical writing
– Textual communication
• Linguistics, artificial intelligence
– Speech recognition, natural language processing
27
Human-Computer Interaction
Fields that contribute to HCI (3)
• Cognitive psychology
– Perception, memory, mental models
• Sociology
– How people interact in groups
• Anthropology
– Study of people in their work settings
28
Human-Computer Interaction
Human-Computer Interaction
Link to Software Engineering
• Separate but related concerns:
vs. user
Some overlap in techniques
– Use cases
– Iterative file cycle
systems
•
• Multi-disciplinary nature of HCI
Lora Aroyo, Web & Media Group 20
Human-Computer Interaction
Traditional Life Cycle
Lora Aroyo, Web & Media Group 21
Human-Computer Interaction
Evaluation-Centered
Equally
supportive of
– top-down &
bottom-up
inside-out &
outside-in
development
–
Lora Aroyo, Web & Media Group 22
Human-Computer Interaction
Iterative Model
Lora Aroyo, Web & Media Group 23
Design
Process/Good and
Poor Design
The Psychology of Usable Things
“ When simple things need
pictures, labels, or instructions,
the design has failed. ”
WHAT IS DESIGN?
• A simple definition of design is:
– achieving goals within constraints
• Goal: is the purpose of the design intended to be
produced with the users and user needs in mind.
• Constraints: include materials to be used, standards to
adopted, the cost, time needed for development as well
as the health and safety issues attached to the system.
Affordance
• An affordance is the possibility of an
action on an object or environment.
• Affordances are the range of
possible (physical) actions by a user
on an artefact:
36
Two types of Affordances
• Perceived Affordances: are the
actions a user perceives to be
possible.
• Real Affordances: are the actions
which are actually possible.
HCI LECTURE 2 37
Perceived Affordance
• Perceived affordance is the quality of an
object that suggests how it might be used.
• In screen-based communications, the
concept of perceived affordance is useful
when designing or evaluating a graphical
user interface (GUI).
•
HCI LECTURE 2 38
Example of Affordance
39
Jug and Tea Cups
• Real Affordance: Jugs are
used for serving tea, while
tea cups are used for
drinking tea
• Perceived Affordance:
Jugs can be used for
drinking tea and tea cups
for drinking wine
Other examples of Affordances
• For physical objects, there can be both real and
perceived affordances (and the two sets are not
necessarily the same).
• Appearance indicates how to use something:
– A chair affords (suggests) sitting.
– Knobs are for turning.
– Slots are for inserting things.
– A button affords pushing.
When perceived affordances are taken advantage of,
The user knows what to do just by looking.
HCI LECTURE 2 40
Ambiguous Affordances
• These two doors are examples of
ambiguous affordances in door design.
• The affordances for these door seem
reasonable within themselves.
• Context is everything.
HCI LECTURE 2 41
HCI LECTURE 2 42
Good Design
HCI LECTURE 2 43
Mappings
• Mappings are the relationships between controls and their
effects on a system.
• Types of Mapping
– Arbitrary Mapping (requires the use of label and memory)
– Paired Mapping (Confusion can still occur)
– Full Natural Mapping (No ambiguity, no need for learning
or remembering, and no need for labels)
• Question:
– How should one arrange the hot plate controls on a
cooker?
44
Constraints
• The difficulty of dealing with a novel situation is
directly related to the number of possibilities.
• Constraints are:
– Physical
– Semantic
– Cultural
– Logical
• These constraints limit on the number of
possibilities.
45
Examples of Constraints
– Physical constraints such as pegs and holes limit possible
operations.
– Semantic constraints rely upon our knowledge of the
situation and of the world.
– Cultural constraints rely upon accepted cultural
conventions.
– Logical constraints exploit logical relationships. For
example a natural mapping between the spatial layout of
components and their controls.
• Where affordances suggest the range of possibilities,
constraints limit the number of alternatives.
46
47
Motorbike toy with 12 parts.
Constraints make its construction simple,
even for adults!
–Physical: Front wheel only fits in one
place.
–Semantic: The rider sits on the seat
facing forward.
–Cultural: Red is a rear light, yellow a
front light.
–Logical: Two blue lights, two white
pieces, probably go together.
48
The Motor Bike
HCI LECTURE 2 49
Conventions
• Conventions are cultural constraints.
• They are initially arbitrary, but evolve and become
accepted over time.
• They can however vary enormously across different
cultures, for example:
– Light switches:
• America down is off
• Britain down is on
50
The Structure of Human Memory
• Short-Term Memory (STM)
• Short-term memory is the memory of the present, used as
working or temporary memory.
– Information is retained in STM automatically and is
retrieved without effort.
– However, the amount of information in STM is severely
limited.
– STM is extremely fragile – the slightest distraction and
its contents are gone.
• For example, STM can hold a seven digit phone number
from the time you look it up until the time you use it, as
long as no distractions occur.
51
The Structure of Human Memory ctd.
• Long Term Memory (LTM)
• Long-term memory is the memory of
the past.
–It takes time to put things into LTM
and time and effort to get things out.
–Capacity is estimated at about 100
million items.
52
Knowledge in the Head and in the World
• Not all of the knowledge required for
precise behaviour has to be in the head.
• It can be distributed:
–partly in the head
–partly in the world
–and partly in the constraints of the
world.
53
HCI Software
Process
HCI Software Process
• The Software Process in HCI involves
1. Software Development Life Cycle
• Find out the process of SDLC and the models used
2. Usability Engineering Life Cycle
The Usability Engineering Lifecycle
1. Know the User
2. Usability Benchmarking
3. Goal-Oriented Interaction Design
4. Iterative Design:
(a) Prototyping
(b) Formative Usability Evaluation (Inspection and/or
Testing)
5. Usability Evaluation
6. Follow-up Studies
56
HCI Lecture 3 Usability Engineering Concepts
Know the Users
• Identification of users can be classified
according to their:
–Experience
–Educational level
–Age
–Amount of prior training
HCI Lecture 3 Know the User 57
Usability Benchmarking
• This describes the standard of the new system
to be developed in comparison to the existing
standards.
• Raising the standard or maintaining the
existing standard is also put into consideration
in the interface design of the system.
• The return on investment (i.e. profit margin) of
the new system would be part of the
benchmarking.
HCI Lecture 3 Usability Benchmarking 58
Goal-Oriented
Interaction Design
• The software is designed based on an
understanding of human goals and associated
tasks.
• What is a goal?
• A goal is a final purpose or aim, an
objective.
• Tasks are particular ways of accomplishing
a goal.
• There may be multiple ways of achieving a goal.
Goal Oriented Interaction Design 59
Example of goal and tasks
• Goal: Get something to eat.
• Task: Go to the restaurant around the corner.
• Task: Call small chops service.
• Task: Go to the market, buy ingredients, and
cook for self.
• Too often, software designers focus on simplifying a
task, rather than accomplishing a goal.
• Tasks are means to an end, not an end in
themselves.
60
Six Attributes of Usability of a System
• (1) Effectiveness: completeness with which users achieve
their goal.
• (2) Learnability: ease of learning for novice users.
• (3) Efficiency: steady-state performance of expert users.
• (4) Memorability: ease of using system intermittently for
casual users.
• (5) Errors: error rate for minor and catastrophic errors.
• (6) Satisfaction: how satisfying a system is to use, from user’s
point
61
HCI Lecture 4 Usability Engineering Concepts
9
A model of factors contributing to usability
usability
enjoyability satisfaction
acceptability
ergonomics
primary functionality
efficiency of use
extensibility/customization
learnability
ease of use
familiarity
fit to task
fit to user
cognitive load
error handling
HCI Lecture 3 Usability Engineering Concepts
10
Usability Principles
1. Do not rely only just on usability guidelines –
always test with users.
– Usability guidelines have exceptions; you can only be confident that a
UI is good if you test it successfully with users.
2. Ensure that the sequences of actions to achieve a
task are as simple as possible.
– Reduce the amount of reading and manipulation the user has to do.
– Ensure the user does not have to navigate anywhere to do subsequent
steps of a task.
HCI Lecture 3 Usability Engineering Concepts
11
Usability Principles
3. Ensure that the user always knows what he or she can
and should do next
– Ensure that the user can figure out the affordance (what
commands are available and are not available).
– Make the most important commands stand out.
4. Provide good feedback including effective error
messages.
– Inform users of the progress of operations and of their location
as they navigate.
– When something goes wrong explain the situation in adequate
detail and help the user to resolve the problem.
HCI Lecture 3
Usability Engineering Concepts
12
Usability Principles
5. Ensure that the user can always get out, go back or undo
an action.
– Ensure that all operations can be undone.
– Ensure it is easy to navigate back to where the user came from.
6. Ensure that response time is adequate.
– Users are very sensitive to slow response time
• They compare your system to others.
– Keep response time less than a second for most operations.
– Warn users of longer delays and inform them of progress.
HCI Lecture 3 Usability Engineering Concepts
Implementation
Support -Tools
Technology Supporting User
Interface.
• Input Devices.
• Output Devices.
• High-speed Processing.
• Networking.
67
Technology Supporting User
Interface.
• Input Devices.
– Keyboard.
– Pointing devices.
– 3D Input.
– Recognized Input.
68
Technology Supporting User
Interface.
• Input Devices.
– Keyboards.
• QWERTY
• DVORAK
• Split
69
Technology Supporting User Interface.
• Input Devices.
– POINTING DEVICES
• Mouse
• Trackball
• Touch-screen
70
Technology Supporting User
Interface.
• Input Devices.
– 3D Input.
• Data Glove
• 3D-Mouse
71
Technology Supporting User
Interface.
• Input Devices.
– Recognized Input.
• OCR
• Eye-Gaze
• Barcode Scan
72
Technology Supporting User
Interface.
• Output Devices.
– CRT.
– LCD.
– Sound.
– Printers
– 3D display
73
Computers vs. Humans
• Computers do not work like humans.
• One part of software, the inside, must be
written in harmony with the demands of
hardware
• The other side of software, the outside, must
be written in harmony with the demands of
human nature.
74
Differences between computers
and humans
Computers Humans
Incredibly Fast Incredibly Slow
Error Free Error Prone
Deterministic Irrational
Apathetic Emotional
Literal Inferential
Sequential Random
Predictable Unpredictable
Amoral Ethical
Stupid Intelligent
75
Prototyping
• In increasing order of complexity:
• Verbal Prototypes: textual description of choices
and results.
• Paper Prototypes:
• Low-Fidelity: hand-drawn sketches.
• High-Fidelity: more elaborate printouts.
• Interactive Sketches: interactive composition of
hand-drawn sketches.
• Working Prototypes: interactive, skeleton
implementation.
76
Verbal Prototype
• Simple textual description of choices and
results.
• Write the user guide first, before anything is
implemented. Have it reviewed by someone
else.
HCI Lecture 8 Prototyping 77
Paper Prototypes
• Paper prototypes simulate screen and dialogue
elements on paper.
• First hand-drawn sketches (lo-fi), later perhaps more
elaborate printouts (hi-fi).
• Greeking (drawing squiggly lines) is used to represent
text which would otherwise be a distraction.
78
Interactive Sketches
• Scan in hand-drawn interface sketches.
• Assemble interactive prototype with clickable
elements.
• Retains throwaway, casual look to encourage
criticism and discussion, as shown in Figure 6.
79
Interaction Design versus
Interface Design
• Interface design suggests an interface
between code on one side and users on the
other side and passing messages between
them.
• Interaction design refers to function,
behaviour, and final presentation of a system
80
Usability
Evaluation
Usability Evaluation – Four Types
• Exploratory - how is it (or will it be) used?
• Predictive - estimating how good it will be.
• Formative - how can it be made better?
• Summative - how good is it?
82
Usability Evaluation Methods
• The methods of usability evaluation can also be classified
according to who performs them:
• Usability Inspection Methods
– Inspection of interface design by usability specialists
using heuristics and judgement (no test users).
• Usability Testing Methods
– Empirical testing of interface design with real users.
83
Usability Inspection Methods
• Inspection methods of interface design use heuristic
methods based on analysis and judgement rather than
experiment.
• Theses methods are:
• 1. Heuristic Evaluation: A small team of evaluators inspects
an interface using a small checklist of
• general principles and produces an aggregate list of
potential problems.
• 2. Guideline Checking: An evaluator checks an interface
against a detailed list of specific guidelines and produces a
list of deviations from the guidelines.
84
• 3. Cognitive Walkthrough: A small team walks
through a typical task in the mind set of a novice
user and produces a success or failure story at each
step along the correct path. [analyses learnability]
• 4. Guideline Scoring: An evaluator scores an
interface against a detailed list of specific
guidelines and produces a total score representing
the degree to which an interface follows the
guidelines.
85
• 5. Action Analysis: An evaluator produces an
estimate of the time an expert user will take
to complete a given task, by breaking the task
down into even smaller steps and then
summing up the atomic action times.
[analyses efficiency]
86
Usability Testing Methods
• “ Would you fly in an airplane that has not been
flight tested? Of course not.
• So you should not be using software that has not
been usability tested. ”
87
Why do Usability Testing?
• More often than not, intuitions are wrong!
• People believe they understand behaviour of others
based on their own experiences.
• This belief only lost through prediction if there is no
measurement (! usability tests).
• Designers of system find it very easy to use.
• Experience changes one’s perception of the world.
• It is almost impossible to “forget” an experience and put
oneself in position of someone not having had the same
experience.
88
Usability Testing Methods
• Empirical testing of interface design with representative users.
• (i) Thinking Aloud: Test users verbalise thoughts while
performing test tasks.
• (ii) Co-Discovery: Two test users explore an interface together.
Insight is gained from their conversation while performing test
tasks.
• (iii) Formal Experiment: Controlled experiment, face-to-face
with test users, measurements and statistical analysis.
• (iv) Query Techniques: Interviews and Questionnaires
• (v) Usage Studies: Usage data is collected from a small number
of users working on their own tasks in their natural
environment over a longer period.
89

Contenu connexe

Tendances

Human Computer Interaction Introduction
Human Computer Interaction IntroductionHuman Computer Interaction Introduction
Human Computer Interaction IntroductionN.Jagadish Kumar
 
Human computer interaction
Human computer interactionHuman computer interaction
Human computer interactionsai anjaneya
 
Introduction to HCI
Introduction to HCI Introduction to HCI
Introduction to HCI Deskala
 
HCI 3e - Ch 4: Paradigms
HCI 3e - Ch 4:  ParadigmsHCI 3e - Ch 4:  Paradigms
HCI 3e - Ch 4: ParadigmsAlan Dix
 
Hci in software process
Hci in software processHci in software process
Hci in software processrida mariam
 
HCI 3e - Ch 14: Communication and collaboration models
HCI 3e - Ch 14:  Communication and collaboration modelsHCI 3e - Ch 14:  Communication and collaboration models
HCI 3e - Ch 14: Communication and collaboration modelsAlan Dix
 
HCI 3e - Ch 1: The human
HCI 3e - Ch 1:  The humanHCI 3e - Ch 1:  The human
HCI 3e - Ch 1: The humanAlan Dix
 
HCI 3e - Ch 6: HCI in the software process
HCI 3e - Ch 6:  HCI in the software processHCI 3e - Ch 6:  HCI in the software process
HCI 3e - Ch 6: HCI in the software processAlan Dix
 
Human Computer Interaction - Interaction Design
Human Computer Interaction - Interaction DesignHuman Computer Interaction - Interaction Design
Human Computer Interaction - Interaction DesignVrushali Dhanokar
 
Hci user interface-design principals
Hci user interface-design principalsHci user interface-design principals
Hci user interface-design principalsAnwal Mirza
 
HCI - Chapter 2
HCI - Chapter 2HCI - Chapter 2
HCI - Chapter 2Alan Dix
 
Human Computer Interaction Chapter 2 Interaction and Interaction Design Basi...
Human Computer Interaction Chapter 2  Interaction and Interaction Design Basi...Human Computer Interaction Chapter 2  Interaction and Interaction Design Basi...
Human Computer Interaction Chapter 2 Interaction and Interaction Design Basi...VijiPriya Jeyamani
 
Human Computer Interaction Chapter 5 Universal Design and User Support - Dr....
Human Computer Interaction Chapter 5 Universal Design and User Support -  Dr....Human Computer Interaction Chapter 5 Universal Design and User Support -  Dr....
Human Computer Interaction Chapter 5 Universal Design and User Support - Dr....VijiPriya Jeyamani
 
HCI 3e - Ch 15: Task analysis
HCI 3e - Ch 15:  Task analysisHCI 3e - Ch 15:  Task analysis
HCI 3e - Ch 15: Task analysisAlan Dix
 

Tendances (20)

Chapter 7 design rules
Chapter 7 design rulesChapter 7 design rules
Chapter 7 design rules
 
Human Computer Interaction Introduction
Human Computer Interaction IntroductionHuman Computer Interaction Introduction
Human Computer Interaction Introduction
 
Human computer interaction
Human computer interactionHuman computer interaction
Human computer interaction
 
Introduction to HCI
Introduction to HCI Introduction to HCI
Introduction to HCI
 
HCI 3e - Ch 4: Paradigms
HCI 3e - Ch 4:  ParadigmsHCI 3e - Ch 4:  Paradigms
HCI 3e - Ch 4: Paradigms
 
User interface design
User interface designUser interface design
User interface design
 
Hci activity#1
Hci activity#1Hci activity#1
Hci activity#1
 
Human Computer Interaction Evaluation
Human Computer Interaction EvaluationHuman Computer Interaction Evaluation
Human Computer Interaction Evaluation
 
Hci in software process
Hci in software processHci in software process
Hci in software process
 
HCI 3e - Ch 14: Communication and collaboration models
HCI 3e - Ch 14:  Communication and collaboration modelsHCI 3e - Ch 14:  Communication and collaboration models
HCI 3e - Ch 14: Communication and collaboration models
 
HCI 3e - Ch 1: The human
HCI 3e - Ch 1:  The humanHCI 3e - Ch 1:  The human
HCI 3e - Ch 1: The human
 
interaction norman model in Human Computer Interaction(HCI)
interaction  norman model in Human Computer Interaction(HCI)interaction  norman model in Human Computer Interaction(HCI)
interaction norman model in Human Computer Interaction(HCI)
 
HCI 3e - Ch 6: HCI in the software process
HCI 3e - Ch 6:  HCI in the software processHCI 3e - Ch 6:  HCI in the software process
HCI 3e - Ch 6: HCI in the software process
 
Human Computer Interaction - Interaction Design
Human Computer Interaction - Interaction DesignHuman Computer Interaction - Interaction Design
Human Computer Interaction - Interaction Design
 
HCI
HCIHCI
HCI
 
Hci user interface-design principals
Hci user interface-design principalsHci user interface-design principals
Hci user interface-design principals
 
HCI - Chapter 2
HCI - Chapter 2HCI - Chapter 2
HCI - Chapter 2
 
Human Computer Interaction Chapter 2 Interaction and Interaction Design Basi...
Human Computer Interaction Chapter 2  Interaction and Interaction Design Basi...Human Computer Interaction Chapter 2  Interaction and Interaction Design Basi...
Human Computer Interaction Chapter 2 Interaction and Interaction Design Basi...
 
Human Computer Interaction Chapter 5 Universal Design and User Support - Dr....
Human Computer Interaction Chapter 5 Universal Design and User Support -  Dr....Human Computer Interaction Chapter 5 Universal Design and User Support -  Dr....
Human Computer Interaction Chapter 5 Universal Design and User Support - Dr....
 
HCI 3e - Ch 15: Task analysis
HCI 3e - Ch 15:  Task analysisHCI 3e - Ch 15:  Task analysis
HCI 3e - Ch 15: Task analysis
 

Similaire à hci lecture notes pt.pptx

chap-01 HCI.ppt
chap-01 HCI.pptchap-01 HCI.ppt
chap-01 HCI.pptLamaYig
 
Psychology Human Computer Interaction
Psychology Human Computer InteractionPsychology Human Computer Interaction
Psychology Human Computer InteractionSeta Wicaksana
 
Human computer interaction Semester 1
Human computer interaction Semester 1Human computer interaction Semester 1
Human computer interaction Semester 1HARISA MARDIANA
 
POLITEKNIK MALAYSIA
POLITEKNIK MALAYSIAPOLITEKNIK MALAYSIA
POLITEKNIK MALAYSIAAiman Hud
 
Introduction to HCI (UCC)
Introduction to HCI (UCC)Introduction to HCI (UCC)
Introduction to HCI (UCC)apppsych
 
hci in software development process
hci in software development processhci in software development process
hci in software development processKainat Ilyas
 
Introduction-of-human-interactionLEC1.pptx
Introduction-of-human-interactionLEC1.pptxIntroduction-of-human-interactionLEC1.pptx
Introduction-of-human-interactionLEC1.pptxmbat8915
 
Human Computer Interaction-Basics
Human Computer Interaction-BasicsHuman Computer Interaction-Basics
Human Computer Interaction-BasicsMuhammad Asif
 
Role of human interaction
Role of human interactionRole of human interaction
Role of human interactionDEEPIKA T
 
Human Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction DesignHuman Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction DesignSazzadHossain764310
 
Interaction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital productsInteraction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital productsDavid Little
 
HUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGN
HUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGNHUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGN
HUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGNAditya Bhushan
 
Socio Technical Systems
Socio Technical SystemsSocio Technical Systems
Socio Technical SystemsVikram Rao
 
Designing Useful and Usable Augmented Reality Experiences
Designing Useful and Usable Augmented Reality Experiences Designing Useful and Usable Augmented Reality Experiences
Designing Useful and Usable Augmented Reality Experiences Yan Xu
 

Similaire à hci lecture notes pt.pptx (20)

chap-01 HCI.ppt
chap-01 HCI.pptchap-01 HCI.ppt
chap-01 HCI.ppt
 
Psychology Human Computer Interaction
Psychology Human Computer InteractionPsychology Human Computer Interaction
Psychology Human Computer Interaction
 
Introduction to Human Computer Interaction
Introduction to Human Computer InteractionIntroduction to Human Computer Interaction
Introduction to Human Computer Interaction
 
HCI_01.ppt
HCI_01.pptHCI_01.ppt
HCI_01.ppt
 
Unit - 1 - HCI.pptx
Unit - 1 - HCI.pptxUnit - 1 - HCI.pptx
Unit - 1 - HCI.pptx
 
Unit - 1 - HCI.pptx
Unit - 1 - HCI.pptxUnit - 1 - HCI.pptx
Unit - 1 - HCI.pptx
 
Unit - 1 - HCI.pptx
Unit - 1 - HCI.pptxUnit - 1 - HCI.pptx
Unit - 1 - HCI.pptx
 
Human computer interaction Semester 1
Human computer interaction Semester 1Human computer interaction Semester 1
Human computer interaction Semester 1
 
POLITEKNIK MALAYSIA
POLITEKNIK MALAYSIAPOLITEKNIK MALAYSIA
POLITEKNIK MALAYSIA
 
Introduction to HCI (UCC)
Introduction to HCI (UCC)Introduction to HCI (UCC)
Introduction to HCI (UCC)
 
hci in software development process
hci in software development processhci in software development process
hci in software development process
 
Introduction-of-human-interactionLEC1.pptx
Introduction-of-human-interactionLEC1.pptxIntroduction-of-human-interactionLEC1.pptx
Introduction-of-human-interactionLEC1.pptx
 
Human Computer Interaction-Basics
Human Computer Interaction-BasicsHuman Computer Interaction-Basics
Human Computer Interaction-Basics
 
Role of human interaction
Role of human interactionRole of human interaction
Role of human interaction
 
HCI.pdf
HCI.pdfHCI.pdf
HCI.pdf
 
Human Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction DesignHuman Computer Interaction: Lecture 2: Interaction Design
Human Computer Interaction: Lecture 2: Interaction Design
 
Interaction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital productsInteraction design: desiging user interfaces for digital products
Interaction design: desiging user interfaces for digital products
 
HUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGN
HUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGNHUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGN
HUMAN COMPUTER INTERACTION AND THE FUTURE OF USER EXPERIENCE DESIGN
 
Socio Technical Systems
Socio Technical SystemsSocio Technical Systems
Socio Technical Systems
 
Designing Useful and Usable Augmented Reality Experiences
Designing Useful and Usable Augmented Reality Experiences Designing Useful and Usable Augmented Reality Experiences
Designing Useful and Usable Augmented Reality Experiences
 

Dernier

Chapter 19_DDA_TOD Policy_First Draft 2012.pdf
Chapter 19_DDA_TOD Policy_First Draft 2012.pdfChapter 19_DDA_TOD Policy_First Draft 2012.pdf
Chapter 19_DDA_TOD Policy_First Draft 2012.pdfParomita Roy
 
Peaches App development presentation deck
Peaches App development presentation deckPeaches App development presentation deck
Peaches App development presentation decktbatkhuu1
 
Pastel Portfolio _ by Slidesgo.pptx. Xxx
Pastel Portfolio _ by Slidesgo.pptx. XxxPastel Portfolio _ by Slidesgo.pptx. Xxx
Pastel Portfolio _ by Slidesgo.pptx. XxxSegundoManuelFaichin1
 
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...Call Girls in Nagpur High Profile
 
VVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts Service
VVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts ServiceVVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts Service
VVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts Servicearoranaina404
 
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Call Girls in Nagpur High Profile
 
call girls in Dakshinpuri (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️
call girls in Dakshinpuri  (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️call girls in Dakshinpuri  (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️
call girls in Dakshinpuri (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️9953056974 Low Rate Call Girls In Saket, Delhi NCR
 
Best VIP Call Girls Noida Sector 44 Call Me: 8448380779
Best VIP Call Girls Noida Sector 44 Call Me: 8448380779Best VIP Call Girls Noida Sector 44 Call Me: 8448380779
Best VIP Call Girls Noida Sector 44 Call Me: 8448380779Delhi Call girls
 
Case Study of Hotel Taj Vivanta, Pune
Case Study of Hotel Taj Vivanta, PuneCase Study of Hotel Taj Vivanta, Pune
Case Study of Hotel Taj Vivanta, PuneLukeKholes
 
Call Girls in Kalkaji Delhi 8264348440 call girls ❤️
Call Girls in Kalkaji Delhi 8264348440 call girls ❤️Call Girls in Kalkaji Delhi 8264348440 call girls ❤️
Call Girls in Kalkaji Delhi 8264348440 call girls ❤️soniya singh
 
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...SUHANI PANDEY
 
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...Pooja Nehwal
 
DragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptxDragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptxmirandajeremy200221
 
Tapestry Clothing Brands: Collapsing the Funnel
Tapestry Clothing Brands: Collapsing the FunnelTapestry Clothing Brands: Collapsing the Funnel
Tapestry Clothing Brands: Collapsing the Funneljen_giacalone
 
Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)amitlee9823
 
Best VIP Call Girls Noida Sector 47 Call Me: 8448380779
Best VIP Call Girls Noida Sector 47 Call Me: 8448380779Best VIP Call Girls Noida Sector 47 Call Me: 8448380779
Best VIP Call Girls Noida Sector 47 Call Me: 8448380779Delhi Call girls
 
Government polytechnic college-1.pptxabcd
Government polytechnic college-1.pptxabcdGovernment polytechnic college-1.pptxabcd
Government polytechnic college-1.pptxabcdshivubhavv
 

Dernier (20)

Chapter 19_DDA_TOD Policy_First Draft 2012.pdf
Chapter 19_DDA_TOD Policy_First Draft 2012.pdfChapter 19_DDA_TOD Policy_First Draft 2012.pdf
Chapter 19_DDA_TOD Policy_First Draft 2012.pdf
 
Peaches App development presentation deck
Peaches App development presentation deckPeaches App development presentation deck
Peaches App development presentation deck
 
Pastel Portfolio _ by Slidesgo.pptx. Xxx
Pastel Portfolio _ by Slidesgo.pptx. XxxPastel Portfolio _ by Slidesgo.pptx. Xxx
Pastel Portfolio _ by Slidesgo.pptx. Xxx
 
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...Top Rated  Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
Top Rated Pune Call Girls Koregaon Park ⟟ 6297143586 ⟟ Call Me For Genuine S...
 
VVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts Service
VVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts ServiceVVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts Service
VVIP CALL GIRLS Lucknow 💓 Lucknow < Renuka Sharma > 7877925207 Escorts Service
 
young call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Service
young call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Serviceyoung call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Service
young call girls in Pandav nagar 🔝 9953056974 🔝 Delhi escort Service
 
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...Top Rated  Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
Top Rated Pune Call Girls Saswad ⟟ 6297143586 ⟟ Call Me For Genuine Sex Serv...
 
call girls in Dakshinpuri (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️
call girls in Dakshinpuri  (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️call girls in Dakshinpuri  (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️
call girls in Dakshinpuri (DELHI) 🔝 >༒9953056974 🔝 genuine Escort Service 🔝✔️✔️
 
Best VIP Call Girls Noida Sector 44 Call Me: 8448380779
Best VIP Call Girls Noida Sector 44 Call Me: 8448380779Best VIP Call Girls Noida Sector 44 Call Me: 8448380779
Best VIP Call Girls Noida Sector 44 Call Me: 8448380779
 
Case Study of Hotel Taj Vivanta, Pune
Case Study of Hotel Taj Vivanta, PuneCase Study of Hotel Taj Vivanta, Pune
Case Study of Hotel Taj Vivanta, Pune
 
Call Girls in Kalkaji Delhi 8264348440 call girls ❤️
Call Girls in Kalkaji Delhi 8264348440 call girls ❤️Call Girls in Kalkaji Delhi 8264348440 call girls ❤️
Call Girls in Kalkaji Delhi 8264348440 call girls ❤️
 
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
VIP Model Call Girls Kalyani Nagar ( Pune ) Call ON 8005736733 Starting From ...
 
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...
Pooja 9892124323, Call girls Services and Mumbai Escort Service Near Hotel Gi...
 
B. Smith. (Architectural Portfolio.).pdf
B. Smith. (Architectural Portfolio.).pdfB. Smith. (Architectural Portfolio.).pdf
B. Smith. (Architectural Portfolio.).pdf
 
DragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptxDragonBall PowerPoint Template for demo.pptx
DragonBall PowerPoint Template for demo.pptx
 
Tapestry Clothing Brands: Collapsing the Funnel
Tapestry Clothing Brands: Collapsing the FunnelTapestry Clothing Brands: Collapsing the Funnel
Tapestry Clothing Brands: Collapsing the Funnel
 
Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)
Escorts Service Basapura ☎ 7737669865☎ Book Your One night Stand (Bangalore)
 
Best VIP Call Girls Noida Sector 47 Call Me: 8448380779
Best VIP Call Girls Noida Sector 47 Call Me: 8448380779Best VIP Call Girls Noida Sector 47 Call Me: 8448380779
Best VIP Call Girls Noida Sector 47 Call Me: 8448380779
 
Government polytechnic college-1.pptxabcd
Government polytechnic college-1.pptxabcdGovernment polytechnic college-1.pptxabcd
Government polytechnic college-1.pptxabcd
 
Call Girls Service Mukherjee Nagar @9999965857 Delhi 🫦 No Advance VVIP 🍎 SER...
Call Girls Service Mukherjee Nagar @9999965857 Delhi 🫦 No Advance  VVIP 🍎 SER...Call Girls Service Mukherjee Nagar @9999965857 Delhi 🫦 No Advance  VVIP 🍎 SER...
Call Girls Service Mukherjee Nagar @9999965857 Delhi 🫦 No Advance VVIP 🍎 SER...
 

hci lecture notes pt.pptx

  • 2. HUMAN COMPUTER INTERACTION Csc 306 Source: VU, Lora Aroyo Adewale V.A. Lecture 1
  • 3. Course OUTLINE • Introduction to HCI • Design process/Good and poor design • Usability engineering concept • Usability engineering life cycle • Goal Oriented interaction design • Implementation support tools • Usability evaluation • Ubiquitous computing • Groupware • Virtual and Augmented Reality • Collaborative work • Hypertext and multimedia • Cognitive models
  • 4. HOW PEOPLE INTERACT WITH COMPUTERS?
  • 5. yo, Web & Media Group Human-Computer Interaction Dashboards Lora Aro 5
  • 8. Human-Computer Interaction Sensing Affect Blood Volume Pressure (BVP) earring Interactive Pillow as a TV remote control Galvanic Skin Response (GSR) rings and bracelet Lora Aroyo, Web & Media Group 9
  • 9. “Avengers” (2012 Human-Computer Interaction Speech, Mobile & Augmented Interaction “Minority Report” (2002) “Her” (2014) “Star Trek: In to the Darkness” (2013) ) “Star Trek: TOS” (1967) Lora Aroyo, Web & Media Group
  • 10. Lora Aroyo, Web & Media Group Human-Computer Interaction Virtual Reality 11
  • 11. 12 eb & Human-Computer Interaction Interactive Workspaces Mimio Stanford Interactive Workspaces Project BendDesk Lora Aroyo, Web & Media Group
  • 13. • How many interactive products are there in everyday use? Think for a minute about what you use in a typical day: – cell phone, computer, personal organizer, remote control, soft drink machine, coffee machine, ATM, ticket machine, library information system, the web, photocopier, watch, printer, stereo, calculator, video game.. . the list is endless. • Now think for a minute about how usable they are. How many are actually easy, effortless, and enjoyable to use? All of them, several, or just one or two? This list is probably considerably shorter. Why is this so? Human-Computer Interaction
  • 14. y s e Human-Computer Interaction Typical Frustrations Can’t figure out how to simple things do Many not frequent use functions http://www.youtube.com/watch?v=keMmM3P4BRM Man hidden functions Operation outcom not visible Can’t remember combinations of digits * # how do we know whether it worked how can we remember that this option is ON http://video.google.com/videoplay?docid=5184957822303751144 Lora Aroyo, Web & Media Group 14
  • 15. Definition of HCI by ACM 15 “Human Computer Interaction is a discipline concerned with the design, evaluation and implementation of interactive computing systems for human use as well as the major phenomena surrounding the it.” Human-Computer Interaction
  • 16. Goals of HCI (1) • The goals of HCI are to produce usable and safe systems, as well as functional systems. • In order to produce computer systems with good usability, developers must attempt to: – Understand the factors that determine how people use technology – Develop tools and techniques to enable building suitable systems – Achieve efficient, effective, and safe interaction – Put people first 16 Human-Computer Interaction
  • 17. Goals of HCI (2) • Underlying the whole theme of HCI is the belief that people using a computer system should come first. • Their needs, capabilities and preferences for conducting various tasks should direct developers in the way that they design systems. • People should not have to change the way that they use a system in order to fit in with it. • Instead, the system should be designed to match their requirements. 17 Human-Computer Interaction
  • 18. Goals of HCI (3) To develop or improve the • Safety • Utility • Effectiveness • Efficiency • Usability • Appeal . . . of systems that include computers 18 Human-Computer Interaction
  • 19. User-Centered Development Methodology • Traditional software engineering methods arose in 1960s and 1970s – Systems were not highly interactive – End-user were computer specialists  Issues concerning end-user and usability were not at all important  user interface design not considered explicitly • Now: – Most end-users are not computer specialists – Usability vital for success 19 Human-Computer Interaction
  • 20. System –Centred Design • Traditional System-Centered design: – Emphasis on the functionality, – UI is added at the end – Emphasis on correct software rather than on ease of use – User has to adapt himself to the system 20 Human-Computer Interaction
  • 21. User-Centre design • Things are changing: User-Centered design – User Interface more important – Emphasis on end-users’ tasks, – Early end-user participation: in analysis and design – Evaluation by end-users – Consequences: • more work for User Interface designer and User Interface programmer 21 Human-Computer Interaction
  • 22. Factors in HCI (1) • There are a large number of factors which should be considered in the analysis and design of a system using HCI principles. • Many of these factors interact with each other, making the analysis even more complex. 22 Human-Computer Interaction
  • 23. Factors in HCI (2) • Organisation Factors Training, job design, politics, roles, work organisation • Environmental Factors Noise, heating, lighting, ventilation Health and Safety Factors • The User Cognitive processes and capabilities Motivation, enjoyment, satisfaction, personality, experience 23 Human-Computer Interaction
  • 24. Factors in HCI (3) • Comfort Factors Seating, equipment, layout. • User Interface Input devices, output devices, dialogue structures, use of colour, icons, commands, navigation, graphics, natural language, user support, multimedia • Task Factors Easy, complex, novel, task allocation, monitoring, skills 24 Human-Computer Interaction
  • 25. Factors in HCI (4) • Constraints Cost, timescales, budgets, staff, equipment, buildings • System Functionality Hardware, software, application • Productivity Factors Increase output, increase quality, decrease costs, decrease errors, increase innovation 25 Human-Computer Interaction
  • 26. Fields that contribute to HCI (1) • Computer Science – Implementation of software • Engineering – Faster, cheaper equipment • Ergonomics – Design for human factors 26 Human-Computer Interaction
  • 27. Fields that contribute to HCI (2) • Graphic design – Visual communication • Technical writing – Textual communication • Linguistics, artificial intelligence – Speech recognition, natural language processing 27 Human-Computer Interaction
  • 28. Fields that contribute to HCI (3) • Cognitive psychology – Perception, memory, mental models • Sociology – How people interact in groups • Anthropology – Study of people in their work settings 28 Human-Computer Interaction
  • 29. Human-Computer Interaction Link to Software Engineering • Separate but related concerns: vs. user Some overlap in techniques – Use cases – Iterative file cycle systems • • Multi-disciplinary nature of HCI Lora Aroyo, Web & Media Group 20
  • 30. Human-Computer Interaction Traditional Life Cycle Lora Aroyo, Web & Media Group 21
  • 31. Human-Computer Interaction Evaluation-Centered Equally supportive of – top-down & bottom-up inside-out & outside-in development – Lora Aroyo, Web & Media Group 22
  • 32. Human-Computer Interaction Iterative Model Lora Aroyo, Web & Media Group 23
  • 34. The Psychology of Usable Things “ When simple things need pictures, labels, or instructions, the design has failed. ”
  • 35. WHAT IS DESIGN? • A simple definition of design is: – achieving goals within constraints • Goal: is the purpose of the design intended to be produced with the users and user needs in mind. • Constraints: include materials to be used, standards to adopted, the cost, time needed for development as well as the health and safety issues attached to the system.
  • 36. Affordance • An affordance is the possibility of an action on an object or environment. • Affordances are the range of possible (physical) actions by a user on an artefact: 36
  • 37. Two types of Affordances • Perceived Affordances: are the actions a user perceives to be possible. • Real Affordances: are the actions which are actually possible. HCI LECTURE 2 37
  • 38. Perceived Affordance • Perceived affordance is the quality of an object that suggests how it might be used. • In screen-based communications, the concept of perceived affordance is useful when designing or evaluating a graphical user interface (GUI). • HCI LECTURE 2 38
  • 39. Example of Affordance 39 Jug and Tea Cups • Real Affordance: Jugs are used for serving tea, while tea cups are used for drinking tea • Perceived Affordance: Jugs can be used for drinking tea and tea cups for drinking wine
  • 40. Other examples of Affordances • For physical objects, there can be both real and perceived affordances (and the two sets are not necessarily the same). • Appearance indicates how to use something: – A chair affords (suggests) sitting. – Knobs are for turning. – Slots are for inserting things. – A button affords pushing. When perceived affordances are taken advantage of, The user knows what to do just by looking. HCI LECTURE 2 40
  • 41. Ambiguous Affordances • These two doors are examples of ambiguous affordances in door design. • The affordances for these door seem reasonable within themselves. • Context is everything. HCI LECTURE 2 41
  • 44. Mappings • Mappings are the relationships between controls and their effects on a system. • Types of Mapping – Arbitrary Mapping (requires the use of label and memory) – Paired Mapping (Confusion can still occur) – Full Natural Mapping (No ambiguity, no need for learning or remembering, and no need for labels) • Question: – How should one arrange the hot plate controls on a cooker? 44
  • 45. Constraints • The difficulty of dealing with a novel situation is directly related to the number of possibilities. • Constraints are: – Physical – Semantic – Cultural – Logical • These constraints limit on the number of possibilities. 45
  • 46. Examples of Constraints – Physical constraints such as pegs and holes limit possible operations. – Semantic constraints rely upon our knowledge of the situation and of the world. – Cultural constraints rely upon accepted cultural conventions. – Logical constraints exploit logical relationships. For example a natural mapping between the spatial layout of components and their controls. • Where affordances suggest the range of possibilities, constraints limit the number of alternatives. 46
  • 48. Constraints make its construction simple, even for adults! –Physical: Front wheel only fits in one place. –Semantic: The rider sits on the seat facing forward. –Cultural: Red is a rear light, yellow a front light. –Logical: Two blue lights, two white pieces, probably go together. 48
  • 49. The Motor Bike HCI LECTURE 2 49
  • 50. Conventions • Conventions are cultural constraints. • They are initially arbitrary, but evolve and become accepted over time. • They can however vary enormously across different cultures, for example: – Light switches: • America down is off • Britain down is on 50
  • 51. The Structure of Human Memory • Short-Term Memory (STM) • Short-term memory is the memory of the present, used as working or temporary memory. – Information is retained in STM automatically and is retrieved without effort. – However, the amount of information in STM is severely limited. – STM is extremely fragile – the slightest distraction and its contents are gone. • For example, STM can hold a seven digit phone number from the time you look it up until the time you use it, as long as no distractions occur. 51
  • 52. The Structure of Human Memory ctd. • Long Term Memory (LTM) • Long-term memory is the memory of the past. –It takes time to put things into LTM and time and effort to get things out. –Capacity is estimated at about 100 million items. 52
  • 53. Knowledge in the Head and in the World • Not all of the knowledge required for precise behaviour has to be in the head. • It can be distributed: –partly in the head –partly in the world –and partly in the constraints of the world. 53
  • 55. HCI Software Process • The Software Process in HCI involves 1. Software Development Life Cycle • Find out the process of SDLC and the models used 2. Usability Engineering Life Cycle
  • 56. The Usability Engineering Lifecycle 1. Know the User 2. Usability Benchmarking 3. Goal-Oriented Interaction Design 4. Iterative Design: (a) Prototyping (b) Formative Usability Evaluation (Inspection and/or Testing) 5. Usability Evaluation 6. Follow-up Studies 56 HCI Lecture 3 Usability Engineering Concepts
  • 57. Know the Users • Identification of users can be classified according to their: –Experience –Educational level –Age –Amount of prior training HCI Lecture 3 Know the User 57
  • 58. Usability Benchmarking • This describes the standard of the new system to be developed in comparison to the existing standards. • Raising the standard or maintaining the existing standard is also put into consideration in the interface design of the system. • The return on investment (i.e. profit margin) of the new system would be part of the benchmarking. HCI Lecture 3 Usability Benchmarking 58
  • 59. Goal-Oriented Interaction Design • The software is designed based on an understanding of human goals and associated tasks. • What is a goal? • A goal is a final purpose or aim, an objective. • Tasks are particular ways of accomplishing a goal. • There may be multiple ways of achieving a goal. Goal Oriented Interaction Design 59
  • 60. Example of goal and tasks • Goal: Get something to eat. • Task: Go to the restaurant around the corner. • Task: Call small chops service. • Task: Go to the market, buy ingredients, and cook for self. • Too often, software designers focus on simplifying a task, rather than accomplishing a goal. • Tasks are means to an end, not an end in themselves. 60
  • 61. Six Attributes of Usability of a System • (1) Effectiveness: completeness with which users achieve their goal. • (2) Learnability: ease of learning for novice users. • (3) Efficiency: steady-state performance of expert users. • (4) Memorability: ease of using system intermittently for casual users. • (5) Errors: error rate for minor and catastrophic errors. • (6) Satisfaction: how satisfying a system is to use, from user’s point 61 HCI Lecture 4 Usability Engineering Concepts
  • 62. 9 A model of factors contributing to usability usability enjoyability satisfaction acceptability ergonomics primary functionality efficiency of use extensibility/customization learnability ease of use familiarity fit to task fit to user cognitive load error handling HCI Lecture 3 Usability Engineering Concepts
  • 63. 10 Usability Principles 1. Do not rely only just on usability guidelines – always test with users. – Usability guidelines have exceptions; you can only be confident that a UI is good if you test it successfully with users. 2. Ensure that the sequences of actions to achieve a task are as simple as possible. – Reduce the amount of reading and manipulation the user has to do. – Ensure the user does not have to navigate anywhere to do subsequent steps of a task. HCI Lecture 3 Usability Engineering Concepts
  • 64. 11 Usability Principles 3. Ensure that the user always knows what he or she can and should do next – Ensure that the user can figure out the affordance (what commands are available and are not available). – Make the most important commands stand out. 4. Provide good feedback including effective error messages. – Inform users of the progress of operations and of their location as they navigate. – When something goes wrong explain the situation in adequate detail and help the user to resolve the problem. HCI Lecture 3 Usability Engineering Concepts
  • 65. 12 Usability Principles 5. Ensure that the user can always get out, go back or undo an action. – Ensure that all operations can be undone. – Ensure it is easy to navigate back to where the user came from. 6. Ensure that response time is adequate. – Users are very sensitive to slow response time • They compare your system to others. – Keep response time less than a second for most operations. – Warn users of longer delays and inform them of progress. HCI Lecture 3 Usability Engineering Concepts
  • 67. Technology Supporting User Interface. • Input Devices. • Output Devices. • High-speed Processing. • Networking. 67
  • 68. Technology Supporting User Interface. • Input Devices. – Keyboard. – Pointing devices. – 3D Input. – Recognized Input. 68
  • 69. Technology Supporting User Interface. • Input Devices. – Keyboards. • QWERTY • DVORAK • Split 69
  • 70. Technology Supporting User Interface. • Input Devices. – POINTING DEVICES • Mouse • Trackball • Touch-screen 70
  • 71. Technology Supporting User Interface. • Input Devices. – 3D Input. • Data Glove • 3D-Mouse 71
  • 72. Technology Supporting User Interface. • Input Devices. – Recognized Input. • OCR • Eye-Gaze • Barcode Scan 72
  • 73. Technology Supporting User Interface. • Output Devices. – CRT. – LCD. – Sound. – Printers – 3D display 73
  • 74. Computers vs. Humans • Computers do not work like humans. • One part of software, the inside, must be written in harmony with the demands of hardware • The other side of software, the outside, must be written in harmony with the demands of human nature. 74
  • 75. Differences between computers and humans Computers Humans Incredibly Fast Incredibly Slow Error Free Error Prone Deterministic Irrational Apathetic Emotional Literal Inferential Sequential Random Predictable Unpredictable Amoral Ethical Stupid Intelligent 75
  • 76. Prototyping • In increasing order of complexity: • Verbal Prototypes: textual description of choices and results. • Paper Prototypes: • Low-Fidelity: hand-drawn sketches. • High-Fidelity: more elaborate printouts. • Interactive Sketches: interactive composition of hand-drawn sketches. • Working Prototypes: interactive, skeleton implementation. 76
  • 77. Verbal Prototype • Simple textual description of choices and results. • Write the user guide first, before anything is implemented. Have it reviewed by someone else. HCI Lecture 8 Prototyping 77
  • 78. Paper Prototypes • Paper prototypes simulate screen and dialogue elements on paper. • First hand-drawn sketches (lo-fi), later perhaps more elaborate printouts (hi-fi). • Greeking (drawing squiggly lines) is used to represent text which would otherwise be a distraction. 78
  • 79. Interactive Sketches • Scan in hand-drawn interface sketches. • Assemble interactive prototype with clickable elements. • Retains throwaway, casual look to encourage criticism and discussion, as shown in Figure 6. 79
  • 80. Interaction Design versus Interface Design • Interface design suggests an interface between code on one side and users on the other side and passing messages between them. • Interaction design refers to function, behaviour, and final presentation of a system 80
  • 82. Usability Evaluation – Four Types • Exploratory - how is it (or will it be) used? • Predictive - estimating how good it will be. • Formative - how can it be made better? • Summative - how good is it? 82
  • 83. Usability Evaluation Methods • The methods of usability evaluation can also be classified according to who performs them: • Usability Inspection Methods – Inspection of interface design by usability specialists using heuristics and judgement (no test users). • Usability Testing Methods – Empirical testing of interface design with real users. 83
  • 84. Usability Inspection Methods • Inspection methods of interface design use heuristic methods based on analysis and judgement rather than experiment. • Theses methods are: • 1. Heuristic Evaluation: A small team of evaluators inspects an interface using a small checklist of • general principles and produces an aggregate list of potential problems. • 2. Guideline Checking: An evaluator checks an interface against a detailed list of specific guidelines and produces a list of deviations from the guidelines. 84
  • 85. • 3. Cognitive Walkthrough: A small team walks through a typical task in the mind set of a novice user and produces a success or failure story at each step along the correct path. [analyses learnability] • 4. Guideline Scoring: An evaluator scores an interface against a detailed list of specific guidelines and produces a total score representing the degree to which an interface follows the guidelines. 85
  • 86. • 5. Action Analysis: An evaluator produces an estimate of the time an expert user will take to complete a given task, by breaking the task down into even smaller steps and then summing up the atomic action times. [analyses efficiency] 86
  • 87. Usability Testing Methods • “ Would you fly in an airplane that has not been flight tested? Of course not. • So you should not be using software that has not been usability tested. ” 87
  • 88. Why do Usability Testing? • More often than not, intuitions are wrong! • People believe they understand behaviour of others based on their own experiences. • This belief only lost through prediction if there is no measurement (! usability tests). • Designers of system find it very easy to use. • Experience changes one’s perception of the world. • It is almost impossible to “forget” an experience and put oneself in position of someone not having had the same experience. 88
  • 89. Usability Testing Methods • Empirical testing of interface design with representative users. • (i) Thinking Aloud: Test users verbalise thoughts while performing test tasks. • (ii) Co-Discovery: Two test users explore an interface together. Insight is gained from their conversation while performing test tasks. • (iii) Formal Experiment: Controlled experiment, face-to-face with test users, measurements and statistical analysis. • (iv) Query Techniques: Interviews and Questionnaires • (v) Usage Studies: Usage data is collected from a small number of users working on their own tasks in their natural environment over a longer period. 89