Human Computer Interaction

Please help in the project for HCI, refer to attachment

Human Computer Interaction
Module 8: Data Gathering
1
Content
1. Five key issues
2. Interviews
3. Questionnaires
4. Observations
2
Weekly Learning Outcome
1. Explain an interview planning and execution
2. Summarize the design of a simple questionnaire
3. Demonstrate observation planning and execution
3
Five Key Issues
4
Key Issues in data
gathering
1. Setting goals
Set the purpose of the
data gathering process
before you start
understanding how
technology fits into family
life
2. Identifying
participants
Decide who is your
participants
how many participants
are needed for a study?
5
Key Issues in data
gathering
3. Relationship with
participants
Ø Clear and professional
Ø Informed consent when
appropriate
4. Triangulation
ØLook at the data from different
perspective
ØCollect more than one type of
data.
6
Key Issues in
data gathering
7
5. Pilot study
Key Issues in data
gathering
A pilot study is a small trial run
of the main study. The aim is to
make sure that the proposed
method is viable before
embarking on the real study
8
Data Recording
• Notes, audio, video, and photographs can
be used individually or in combination:
• Notes plus photographs
• Audio plus photographs
• Video
• What are the advantages and
disadvantages of the three approaches
(note-taking, audio recording with
photographs, and video) for data recording
in this environment?
9
Interviews
10
Interviews
Unstructured: open-ended interview. Not directed by a script.
Structured: Tightly scripted, often like a questionnaire (closed
questions).
Semi-structured: Guided by a script, but interesting issues can
be explored in more depth.
Focus groups: A group interview
11
Comparison
• Unstructured time consuming but give rich data
• Structured: Structured interviews are useful only when the goals
are clearly understood, and specific questions can be identified
• Semi-structured: provide a good balance between richness and
replicability. Combine both structure and unstructured types
• Focus groups allows diverse or sensitive issues to be raised that
might otherwise be missed
12
Conduct and plan an Interview
DEVELOP THE
QUESTIONS
RUN THE INTERVIEW
13
Develop questions
interview Questions’
type
‘Closed questions’ have a fixed answer format, for example, ‘yes’ or
‘no’
Easier to analyze
‘Open questions’ do not have a fixed format
14
To avoid when
creating interview
questions
Long questions
Compound
sentences
Questions that make
assumptions
Difficult language
Unconscious biases
15
Run the Interview
• Introduction: Introduce yourself, explain the goals of the
interview, mention the ethical issues, ask to record, and consent
form must be presented
• Warm-up: first question must be easy and make the
interviewee comfortable
• Main body: Present questions in a logical order
• A cool-off period: Include a few easy questions to defuse
tension at the end
• Closure: Thank interviewee, signal the end, for example,
switch recorder off.
16
Other forms of Interviews
Digital interviews: Skype, ZOOM, Teams, Phone calls
Advantages for the interviewee:
• Participants will feel more relax in their own place
• No travel expenses needed
• No dress code required
• Can remain anonymous
• They can cut off the connection any time
Advantages for the interviewer:
• Wider number of participants
• Might lose the judgment of body language in some cases
17
Enriching the
Interview Process
• Props: Devices for prompting
interviewee, for example, use a
prototype, scenario
• Help to ground the data in a real
setting.
• Easier for the participants to get
involved
18
Questionnaire
19
Questionnaires
• Different questions type can be used à closed or open
• Closed questions are easier to analyze, and may be
distributed and analyzed by computer
• Similar to interview questions
• They can be directed to large sample of populations in
different locations
• Can be distributed by paper, email and the web
20
Designing
Questionnaires
• Questions must have a logical order àThe impact of a
question can be influenced by question order
• Think if you need different versions of the questionnaire
•Clear instructions on how to complete the questionnaire
must be included àfor example, whether answers can be
saved and completed later.
•Check typographical mistakes
•Think about the length of the questionnaire, don’t include
unnecessary questions
21
Questions and
Response Format
‘Yes’ and ‘No’ checkboxes
Checkboxes that offer many options
Likert scales
Rating scales
Semantic scales
3, 5, 7 or more points
Open-ended responses
22
How to get Good
Responses
40 % response rate is good, 20% is often acceptable
THE PURPOSE
OF STUDY
MUST BE
CLEAR
PROMISE
ANONYMITY
QUESTIONN
AIRE MUST
BE WELL
DESIGNED
OFFER A
SHORT
VERSION OF
THE
QUESTIONN
AIRE
IF MAILED,
INCLUDE A
STAMPED,
ADDRESSED
ENVELOPE
FOLLOW-UP
WITH
EMAILS,
PHONE
CALLS, OR
LETTERS
23
PROVIDE AN
INCENTIVE
Advantages of the
Online
Questionnaires
•It is easy and quick to distribute
•Quick responses
•Free of charge (unlike paper ones)
•Data can be collected in database for analysis
•Reduced time for analyzing the data
•Errors correction can be done easily
24
Creating Online
Questionnaires
questionpro.com
surveymonkey.com
25
Online
Questionnaire
Example
Questionnaire shows
check boxes, radio boxes,
and pull-down menus
26
Disadvantages of the
Online
Questionnaire
• when population size is unknown, sampling is
problematic
• Preventing individuals from responding more than
once can be an issue
• Individuals have also been known to change
questions in email questionnaires
27
Creating Online
Questionnaire
1
2
Plan the
timeline
Design
offline
3
4
5
6
Complete
online
template
Run a test
to check
user’s side
Run a
group test
Recruit
participant
s
28
Observation
29
Observation’s Types
1. Direct observation
Observing users in a controlled environment may occur within a purposely built usability
lab, but portable labs that can be set up in any room are quite common. Portable laboratories
can mean that more participants take part because they don’t have to travel away from their
normal environment.
1. Indirect observation: tracking users’ activities
Sometimes direct observation is not possible because it is too intrusive or observers cannot
be present over the duration of the study, and so activities are tracked indirectly. Diaries and
interaction logs are two techniques for doing this.
30
Direct Observation’s
Types
Direct observation in the field
• Structuring frameworks
• Degree of participation
(insider or outsider)
• Ethnography
Direct observation in controlled
environments
• Think aloud technique
• The same basic data
recording techniques are
used for direct observation in
the laboratory and field
studies (capturing
photographs, taking notes,
collecting video, etc.)
31
Structuring Frameworks for
Observation in the Fields
Simple framework
• The person: Who?
• The place: Where?
• The thing: What?
Detailed framework
Space: What is the physical space like?
Actors: What are the names and relevant details of the people involved?
Activities: What are the actors doing, and why?
Objects: What physical objects are present, such as furniture?
Acts: What are specific individual actions?
Events: Is what you observe part of a special event?
Time: What is the sequence of events?
Goals: What are the actors trying to accomplish?
Feelings: What is the mood of the group and of individuals?
32
Planning and conducting an
observation field
1. Decide on the level of involvement: from passive
observer to active participant
2. How to gain acceptance
3. How to handle sensitive topics, for example,
culture, private spaces, and so on
4. How to collect the data:
•
•
What data to collect
What equipment to use
•
When to stop observing
33
Ethnography
•
•
•
•
•
•
•
•
•
•
A method of observing human interactions in social settings and activities
It is a direct observation
A researcher’s degree of participation can vary
Collections of comments, incidents, and artifacts are made
Co-operation of people being observed is required
Useful informants
Continuous data analysis
Interpretivist technique
Questions get refined as understanding grows
Examples usually mentioned in reports
34
List of materials that might be collected
during an ethnographic study
Activity or job
descriptions
Rules and
procedures that
govern particular
activities
Descriptions of
activities observed
Recordings of the
talk taking place
between parties
Informal interviews
with participants
explaining the detail
of observed
activities
Diagrams of the
physical layout,
including the
position of artifacts
35
Online Ethnography
Face to face
Richer data collected in person à through gesture, facial expression,
tone of voice, and so on
Online
It is called: Virtual, Online, Netnography
Anonymity is easier to reach
For observational studies in large social spaces, such as digital libraries
or Facebook, there are different ethical issues to consider
36
Direct observation in Controlled
Environment
• The arrangement of equipment with respect to the participant is important
• One of the problems with observation is that the observer doesn’t know
what users are thinking
• Think aloud technique à The technique requires people to say out loud
everything that they are thinking and trying to do so that their thought
processes are externalized
• The occur of silence is a challenge
37
Indirect Observation
Tracking users’ activities
• Diaries à Participants are asked to write a diary of their
activities on a regular basis
• Interaction logging à Interaction logging uses software
to record users’ activity in a log that can be examined
later
• Web analytics à Examining the trail of activity that
people leave behind when they are active on websites,
Twitter, or Facebook is also a form of indirect
observation
Video and photographs collected remotely by drones or
other equipment
38
Choosing and Combining
Techniques
It depend on:
What the study is
focusing on (goal)
Participants
involvements’ level
Nature of the
technique(s)
The availability of the
resources
Time available
39
Choosing Technique
40
Summary
Data gathering must have a clear goal with a provided consent form
The Five key issues of data gathering
The recording of the data can be done using handwritten notes, audio or video recording
Types of Interviews are structured, semi-structured, or unstructured
Focus groups
Questionnaires may be on paper, online, or telephone
Observation may be direct or indirect, in the field, or in controlled settings
Techniques can be combined depending on the study focus, participants, nature of technique, and
available resources and time
41
Human Computer Interaction
Module 9: DATA ANALYSIS, INTERPRETATION,
AND PRESENTATION
42
Contents
1. Quantitative and Qualitative
2. Basic Qualitative and Quantitative analysis
3. Which kind of analytic framework to use?
4. Tools to support data analysis
5. Interpreting and presenting the findings
43
Weekly Learning Outcomes
1. Describe the difference between qualitative and
quantitative data and analysis
2. Analyze data gathered from questionnaires, interviews,
and observations
3. Identify common pitfalls in data analysis, interpretation,
and presentation
44
Qualitative and Quantitative
Data
45
Quantitative data:
Expressed as numbers
Qualitative data: Difficult
to measure as numbers,
quality data
46
47
Qualitative and
Quantitative analysis
Quantitative analysis: Numerical methods to
ascertain size, magnitude, and amount
Qualitative analysis: Expresses the nature of
elements and is represented as themes, patterns,
or stories
Be careful how you manipulate data and numbers!
48
First step of Analysing data
49
Basic Quantitative Data
• Averages:
1. Mean: the total of values added /divide
by number of data points
2. Median: Middle value of data when
ranked
3. Mode: Figure that appears most often in
the data
• Percentages %
• Graphical representations give overview of
data
50
Quantitative data
analysis
• The data in the following table
represents the time taken for a group of
users to select and buy an item from an
online shopping website. Using a
spreadsheet application à graph to give
overall view of the data.
• From these two diagrams, there are an
areas for further investigation. The
values for user N (24) and user S (26) are
higher than the others and could be
looked at in more detail
51
Question design
affect data analysis
• Open question: Each answer analyzed
separately
• Closed question: Analyzed
quantitatively
Fixed alternative answers restrict what
can be said in findings
52
Qualitative Data
Analysis of qualitative data
analysis may be inductive
(extracted from the data),
or deductive (pre-existing
concepts)
53
Qualitative and Quantitative
Analysis
54
Basic Qualitative
Analysis
Looking for critical incidents
Identifying themes
Categorizing data
Helps to focus in on key events
Then analysis can proceed using specific techniques
Developing from data, dependent on observation
framework if used
Inductive analysis
Categorization scheme pre-specified
Deductive analysis
In practice, combination of inductive and deductive
55
Looking for critical
incident
• It helps identifying significant subsets of the data
for more detailed analysis à identify specific
incidents and then to focus and analyze them in
detail
• Incident may be positive or negative
56
Identifying Themes
It is a widely used
analytical technique that
aims to identify, analyze,
and report patterns in
the data
A theme represents an
important pattern of
some kind, such as
specific topic or feature
found in the data set
Themes can be related
to different aspects
such as: behavior, a
user group, events,
places or situations
Each of these kinds of
themes may be
relevant to the study
goals
57
Identifying Themes
To identify a theme:
• Start with exploring data
• Identify the theme
• Look for overall narrative
• Then use of affinity diagrams
The approach seeks to organize
individual ideas and insights into a
hierarchy showing common structures
and themes.
• Notes are grouped together when
they are similar in some fashion.
58
Categorizing Data
Inductive analysis is appropriate when
the study is exploratory
59
Analytic Frameworks
60
Which analytic
Framework to use
61
Conversation
analysis
• Focus on how a conversation is conducted
• Used in sociological studies
• Compare conversations, for instance, faceto-face conversations Vs social media
conversation
62
Conversation
Analysis
An extract of the conversation between
a family and Alexa
63
Discourse Analysis
FOCUSES ON
DIALOGUE; THAT IS,
THE MEANING OF
WHAT IS SAID AND
HOW WORDS
CONVEY MEANING
ASSUMPTION THAT
THERE IS NO
OBJECTIVE
SCIENTIFIC
“TRUTH”
LANGUAGE IS
VIEWED AS A
CONSTRUCTIVE
TOOL
DISCOURSE
ANALYSIS IS USEFUL
WHEN TRYING TO
IDENTIFY SUBTLE
MEANING
64
Discourse Analysis Example
• Discourse analysis is what you do when you are saying that you
are doing discourse analysis
• According to Coyle, discourse analysis is what you do when you
are saying that you are doing discourse analysis
• By adding just three words, “According to Coyle,” the sense of
authority changes, depending on what the reader knows about
Coyle’s work and reputation
65
Content Analysis
• Involves categorizing data into themes and study the
frequencies of them
• Can be used for any “text” such as: video, newspapers,
advertisements, images, and sounds
• It is often used as a combination with other techniques
66
Content Analysis
Example
• Online content can be analyzed using this technique , such as: text of tweets, links,
animated gifs, videos, and images.
• For example, Mark Blythe and Paul Cairns (2009) analyzed 100 videos from a
YouTube search by relevance for “iPhone 3G” using content analysis.
• They categorized the videos into seven categories:
1.
2.
3.
4.
5.
6.
7.
Review
Reportage
Unboxing
Demonstration
Satire
Advertisement
Vlog commentaries (such as, complaints about queues).
67
Interaction Analysis
A WAY TO
UNDERSTAND
INTERACTIONS
BETWEEN
PEOPLE AND
BETWEEN
PEOPLE AND
ARTEFACTS
BASED ON
EMPIRICAL
OBSERVATION
S SUCH AS
VIDEOS
INDUCTIVE
PROCESS IN
TEAMS,
COLLABORATIV
ELY
CONTENTS OF
THE MATERIAL
IS LOGGED
MATERIALS
ARE
EXTRACTED,
CLASSIFIED, OR
REMOVED
INSTANCES OF
A SALIENT
EVENT ARE
PLAYED ONE
AFTER THE
OTHER
68
THE TEAM OF
RESEARCHERS
STUDIES THE
ASSEMBLAGE
TOGETHER
Interaction Analysis
Example
• An example Brigitte Jordon and Austin Henderson (1995) use to
illustrate this process is their study of people around a pregnant
woman who was having her first contraction
• They noticed that, at the point of the first contraction, the medical
staff and family all shifted their attention away from the woman to
the monitoring equipment.
• They were able to find many more examples of this phenomenon,
providing strong evidence that the presence of high-tech equipment
changes the practice of caregiving, specifically that caregiving is
mediated by the real-time data presented through the equipment.
69
Grounded Theory
Seeks to develop theory from systematic analysis of empirical data
Three levels of ‘coding’
Open: Identify categories
Axial: Flesh out and link to subcategories
Selective: Form theoretical scheme
Researchers are encouraged to draw on own theoretical backgrounds to inform analysis
Analytic tools to help stimulate
70
Grounded Theory
Example
• The grounded theory
approach allowed the
development of a
taxonomy that reflects the
style and purpose of the
genre
71
System based
Frameworks
Helps the researcher investigating how new technologies
should be introduced
Two frameworks:
Socio-technical Systems
Theory.
Distributed Cognition of
Teamwork.
72
Socio-Technical
Systems Theory (STS)
The theory states that the technology and the people in a
work system are interdependent
STS theory aspects:
• Task interdependencies.
• Socio-technical systems are “open systems”.
• Heterogeneity of system components.
• Practical contributions.
• Fragmentation of design process.
73
Distributed cognition
of teamwork
Distributed cognition and Distributed Cognition of Teamwork were
introduced as an approach to studying the nature of cognitive phenomena
across individuals, artifacts, and internal and external representations.
Investigating how information is propagated through different media is a
key goal of this approach, and while distributed cognition provides a good
theoretical framework for analyzing systems, it can be difficult to apply in
practice. The framework was developed as a method to support the
application of distributed cognition. It provides a framework of models that
can be constructed from a set of collected data, for example ethnographic,
interview transcripts, artifacts, photographs, and so on.
74
Tools to Support Data Analysis
75
Tools to support data
analysis
You can do it manually
• Spreadsheet — easy to use, basic graphs
• Statistical packages, for example, SAS and SPSS
• Qualitative data analysis tools
• Categorization and theme-based analysis
• Quantitative analysis of text-based data
• Nvivo and Dedoose support qualitative data analysis
• Computer Assisted Qualitative Data Analysis (CAQDAS)
Networking Project, based at the University of Surrey
76
Interpreting and presenting the
findings
77
Interpreting presenting
the findings
• Choosing an appropriate way to present
the findings of a study is as important as
choosing the right analytical approach
All other apps
Snapchat
1%
Email
(native)
Internet
1%
1%
reddit
1%
Twitter
1%
Word
Streak
1%
Chrome
5%
Textra
4%
dscout
3%
YouTube
1%
• The choice depends on:
1. Data gathering
2. Analytical techniques used
3. Audience
4. The study goals
Hangouts
2%
Messages
11%
Facebook
15%
Gmail
3%
Google app
3%
Instagram
3%
Gallery
(photo)
1%
Home screen
9%
WhatsApp
3%
(a)
Phone sessions: Average vs. heavy user
78
Messenger
(FB)
3%
Presenting the findings
Structured notations
Using stories
Summarizing the findings
79
Structed Notation
Clear syntax and
semantics, which
have been
developed to
capture
viewpoints
Examples: Work
models, UML
diagram and
activity diagrams
Its good to use
because: The
meaning of
different symbols
is well-defined
It provides clear
guidance on
what to look for
in the data and
what to highlight
80
However,
sometimes it is
difficult to
understand so it
can be used with
stories
Using Stories
STORYTELLING
AN EASY APPROACH TO
COMMUNICATE IDEAS
81
Summarise Findings
Represented as graphs or diagrams .
Over-generalizing results without good evidence is a common pitfall, especially with qualitative
analyses.
for example, think carefully before using words such as most, all, majority, and none, and be sure
that the justifications reflect the data.
Results can be understood in a misleading way.
For example, if 8 out of 10 users preferred design A over design B, this does not mean that design A
is 80 percent more attractive than design B.
If you found 800 out of 1,000 users preferred design A, then you have more evidence to suggest that
design A is better, but there are still other factors to consider.
82
Summary
The data analysis that can be done depends on the data gathering
Qualitative and quantitative data may be gathered using any of the three main data gathering
approaches
Percentages and averages are commonly used in Interaction Design
Mean, median, and mode are different kinds of ‘average’ and can have very different answers for
the same set of data à used in quantitative data
Analysis of qualitative data analysis may be inductive (extracted from the data), or deductive (preexisting concepts)
Several analytical frameworks exist that focus on different levels of granularity with different
purposes.
83
Human Computer Interaction
Module 10: Discovering Requirements
84
Contents
1. What, How and Why?
2. What are Requirements?
3. Data gathering for requirements
4. Brining requirements into life
85
Weekly Learning Outcomes
1. Describe different kinds of requirements
2. Illustrate use cases to capture interaction
86
What, How and Why?
87
What ,how and
why?
What is the purpose
of the requirements
activity
Two phases
1. exploring the problem
space to gain insights
about the problem.
2. Establishing a
description of what
will be developed
88
What ,how and
why?
How to capture
requirements once
discovered
Can be captured in
different forms:
For products à monitor
App, prototype or
operational product.
For process control
software à structured or
rigorous notations
89
What ,how and
why?
Why Bother?
• To avoid
miscommunication
• To produce usable
products for users
90
What are Requirements?
91
What are
Requirements?
• A statement about a specific product which include what
it is expected to do or how it will perform
• The goals of the requirements activity is to identify,
clarify, and capture the requirements
• There is different forms of requirements at different levels
of abstraction
• User stories is an alternative way to capture what a
product is intended to do
92
Volere Shell
Example requirement
expressed using an
atomic requirements
shell from Volere
93
Different Type of Requirements
“Traditional”
Functional requirements: what the product will do
Non-functional requirements: describe
characteristics
94
Different types of
Requirements
Six of the most common types:
1. Functional requirements
2. Data requirements
3. Environment requirements
4. User requirements
5. Usability requirements
6. User experience requirements
95
Data Requirements
DATA REQUIREMENTS à
CAPTURE THE TYPE, SIZE,
AMOUNT OF THE DATA
“WHAT KIND OF DATA NEED
TO BE STORED”
96
Environmental
Requirements
Environmental requirements à refers to the circumstances in which the interactive
product will operate
Four aspects of the environment lead to different types of requirements
1- Physical environment à how much lighting, noise and movements.
2- Social environment à collaboration “will data need to be shared?”
3- Organizational environmentà how good is user support
4- Technical environment à what technologies will the product run
97
Data Gathering for Requirements
98
Data gathering for
Requirements
ØData gathering techniques: Interviews, observation, and
questionnaires
ØStudying documentation:
1. Manuals, standards, or activity logs, are a good source of data
2. Procedures and rules are often written down in manuals
3. Good source of data about the steps involved in an activity and any
regulations governing a task
4. Good for understanding legislation and getting background
information
5. Researching other products can also help identify requirements.
99
Data Gathering for
Requirements
1. Using Probes to Engage with Users
2. Contextual Inquiry
3. Brainstorming for Innovation
100
Using Probes to engage
with users
There is different forms of Probes
It is an imaginative approach to data gathering.
Probes depend on some form of logging to gather the data:
• automatically in the case of technology probes, or
• manually in the case of diaries or design probes.
Cultural probe:
• Is a developed technique to avoid traditional approaches.
• Wallet containing postcards, maps, camera, photo album, and diary
• Participants asked to answer questions using wallet contents
101
Probes Types
Design probes
• objects whose form relates specifically to a particular question and context. They are
intended to gently encourage users to engage with and answer the question in their
own context. “ ex: Top Trumps probe”
Technology probe:
• Toolkits, cell phone apps, sensor-based monitoring, for example, M-Kulinda to alert
participants about unexpected movement at home.
Provocative probe:
• Technology probe designed to challenge norms and attitudes in order to provoke
discussion , for example, the Box to challenge domestic laundry practices
102
Contextual inquiry
Part of Contextual Design,
but also used on its own to
gather requirements
undertaken by every
member of the design team
Adapted over time to suit
different technologies and
the different ways in which
technology fits into daily
life.
Focus on daily life at home
or work relevant to the
project
One-on-one field interviews
(contextual interviews)
Use a model of
master/apprentice to
structure data gathering,
based on the idea that the
interviewer (apprentice)
103
Contextual inquiry
Four main principles:
1- Context: Going to the user, wherever they
are, and seeing what they do as they do it
2- Partnership: User and interviewer explore
user’s life together
3- Interpretation: Observations interpreted by
user and interviewer together
4- Focus: Project focus to understand to what
should be paid attention
104
Contextual inquiry
1st group: Joy of life
concepts:
Contextual Interview
guided by “cool
concepts” divided
into two groups
How products make
our lives richer and
more fulfilling
Accomplish,
connection, identity,
and sensation.
Describe impact of
using the product.
2nd group: Joy of use
concepts:
Direct in action, the
hassle factor, and
the learning delta
105
four parts for contextual
inquiry
1. Overview
2. Transition
3. Main interview
4. Wrap-up
106
Brainstorming for
innovation
This technique is used to generate, refine, and
develop ideas.
To have a successful brainstorming
• Include participants with a wide-ranging experience
• Accept wild ideas
• Use catalysts for further inspiration à building up ideas
• Keep records. Capture every idea, without censoring
• Sharpen the focus à Start the brainstorm with a problem.
• Use warm-up exercises and make the session fun
107
Bringing Requirements into life
108
Bringing Requirements
into life
• Personas
Rich descriptions of typical users of the
product under development
• Scenarios
An “informal narrative description”
109
Personas
Personas’ goals:
Include a description of the
user’s behavior, attitudes,
activities, and environment.
• To help the designer make
design decisions
• To remind the team that
real people will be using the
product
Relevant to product under
development.
Bring to life with name,
characteristics, goals, and
personal background.
Develop a small set of
personas with one primary.
110
Persona’s example
111
Persona’s example
112
Scenarios
It contain a story
that describe human
activities that allows
discussion of
contexts, needs, and
requirements.
Maybe constructed
textual descriptions,
animations, audio or
video.
113
Scenarios Vs Personas
114
Use Cases
Interaction can be captured using use cases
It focus on functional requirements
Focus on the interaction between the user and the product
Use cases are step by step description of interaction
115
Use Cases Styles
Essential Use Case à division of tasks, no implementation detail.
Alternative courses Use Cases à more detailed, and it captures
the user’s goal when interacting with the product.
116
Example essential use
case for travel organizer
RetrieveVisa
USER INTENTION
SYSTEM RESPONSIBILITY
Find visa requirements
Request destination and nationality
Supply required information Obtain appropriate visa info
Obtain copy of visa info
Offer info in different formats
Choose suitable format
Provide info in chosen format
Note: The user intention and system responsibility are offset vertically, showing a sequence of interactions
117
Use case for travel
organizer
1. The product asks for the name of the destination country
2. The user provides the country’s name
3. The product checks that the country is valid
4. The product asks the user for their nationality
5. The user provides their nationality
6. The product checks the visa requirements of that country for a passport holder of the
user’s nationality
7. The product provides the visa requirements
8. The product asks whether the user wants to share the visa requirements on social
media
9. The user provides appropriate social media information
118
Alternative course for travel organizer
Some alternative courses:
4. If the country name is invalid:
4.1: The product provides an error message
4.2: The product returns to step 1
6. If the nationality is invalid:
6.1: The product provides an error message
6.2: The product returns to step 4
7. If no information about visa requirements is found:
7.1: The product provides a suitable message
7.2: The product returns to step 1
119
Summary
Illustrate the purpose of the requirements by exploring the problem and try to find what to develop
Different types of requirements explained and how each one serve different project purposes
The process of data gathering and its importance
The difference between personas and scenarios
Personas: rich descriptions of typical users of the product under development.
Scenarios: an “informal narrative description
Use cases to capture interaction design
120
Human Computer Interaction
Module 11: Design, Prototyping and construction
121
Content
1. Prototyping
2. Concrete design and Generating prototypes
3. Construction
122
Weekly Learning Outcomes:
1. Describe prototyping and the different types of
prototyping activities
2. Explain the concrete design for a product
3. Describe physical computing kits and software
development kit and their role in construction
123
1. Prototyping
124
What is
Prototype
Prototyping provides a
small-scale model of an
idea—whether it is a new
product or a modification
of an existing one—which
allows designers to
communicate their ideas
and users to try them
out.
125
Prototype example
Small-scale model such as:
• A miniature car
• A miniature building
or town
126
Prototype example
Figure 12.3 shows a paper-based
prototype of a handheld device to help
an autistic child communicate.
This prototype shows the intended
functions and buttons, their positioning
and labeling, and the overall shape of the
device, but none of the buttons actually
works.
This kind of prototype is sufficient to
investigate scenarios of use and to
decide, for example, whether the button
images and labels are appropriate and
the functions sufficient, but not to test
whether the speech is loud enough or
the response fast enough
127
What is Prototype in interaction design
The PalmPilot was the first generation of the PDA (personal digital
assistant)
A SERIES OF
SCREEN
SKETCHES
A
STORYBOARD.
EX: CARTOON
A POWERPOINT
SLIDE SHOW
A THREEDIMENSIONAL
MOCK-UP OF A
WORKSTATION.
A VIDEO
SIMULATING
THE USE OF A
SYSTEM
A LUMP OF
WOOD (EX: THE
PALMPILOT)
A PIECE OF SOFTWARE
WITH LIMITED
FUNCTIONALITY
128
A CARDBOARD
MOCK-UP
Why Prototype
Allow evaluation and feedback with stakeholders
Effective way for designers to gather ideas
Encourage the process of reflection on the design
Allow stakeholders to interact with the product
129
Prototype
Different kinds of prototyping
• Low fidelity (loyalty, devotion)
• High fidelity
Compromises in prototyping
• Vertical
• Horizontal
130
Low-Fidelity Prototyping
• It does not look very much like the final product, nor does it
provide the same functionality.
• For example, it may use very different materials, such as
paper and cardboard rather than electronic screens and
metal, it may perform only a limited set of functions, or it
may only represent the functions and not perform any of
them.
• Advantages: simple, cheap, quick to produce and easily
changed.
131
Low-Fidelity Prototyping example
STORYBOARDING
SKETCHING
PROTOTYPING
WITH INDEX CARDS
WIZARD OF OZ
132
1. Storyboarding
• It is a series of sketches
showing how a user might
progress through a task
using the product.
• Often used with scenarios,
bringing in more detail
and a chance to role play
(Christina) using a new mobile device for exploring historical
The example storyboard shown in Figure 12.4 depicts a person (Christina) using a new mobile device for exploring
historical sites. This example shows the context of use for this device and how it might support Christina in her quest for
133
information about the pottery trade at The Acropolis in Ancient Greece
2. Sketching
• Depends on hand-drawn
sketches
• Many people find it difficult to
engage in sketching because
they are not confident about
their drawing quality
• Use simple boxes, stick fingers
for sketching vocabulary
134
3. Prototyping with Index cards
• It is used for developing a range of
interactive products.
• Simple and successful
• Index cards (3 x 5 inches)
• Each card represents
one element of interaction
• In evaluation, can step through the
cards
135
4. ‘Wizard-of-Oz’ Prototyping
• The user thinks they are interacting
with a computer, but a human is
responding to output rather than
the system
• Usually done early in design to
understand users’ expectations
The method takes its name from the classic story of the little girl who is swept away in a storm and finds herself in
the Land of Oz (Baum and Denslow, 1900). The Wizard of Oz is a small shy man who operates a large artificial image
of himself from behind a screen where no one can see him.
136
High-Fidelity Prototyping
• The materials used is expected to be in the final product
• The prototype looks more like the final system than a low-fidelity
version
• High-fidelity prototypes can be developed by integrating existing
hardware and software components
• Disadvantages: users think they have a complete system à see
compromises
137
Compare
Type
Advantages
Disadvantages
Low-fidelity prototype
•Quick revision possible
•More time can be spent on
•improving the design before
•starting development
•Evaluates multiple design concepts
•Useful communication device
•Proof of concept
•Limited error checking
•Poor detailed specification for
•development
•Facilitator-driven
•Limited usefulness for usability tests
•Navigational and flow limitations
High-fidelity prototype
•(Almost) complete functionality
•Fully interactive
•User-driven
•Clearly defines navigational scheme
•Use for exploration and test
•Look and feel of intended product
•Serves as a “living” or evolving
•specification
•Marketing and sales tool
•More resource-intensive to develop
•Time-consuming to modify
•Inefficient for proof-ofconcept designs
•Potential of being mistaken for the
final product
•Potential of setting inappropriate
expectations
138
Compromises Prototyping
• For software-based prototyping, maybe there is a slow response? sketchy
icons? limited functionality?
• “In the wild” prototypes operational but not necessarily robust
Two common types of compromise:
Horizontal: Provides a wide range of functions, but with little detail
Vertical: Provides a lot of detail for only a few functions
• Compromises in prototypes must not be ignored. Product needs
engineering
139
2. Concrete Design and Generating Prototype
140
12.4 Concrete design
• Difference between conceptual and concrete is a matter of changing
emphasis: during design
• Aspects to concrete design: Color, icons, buttons, interaction devices, etc.
• Two aspects of Dealing with issues related to user characteristics and
context:
1. Accessibility refers to the extent to which a product is accessible to as
many people as possible.
2. Inclusiveness means being fair, open, and equal to everyone.
141
12.5 Generating Prototype
GENERATING STORYBOARDS
FROM SCENARIO
GENERATING CARD-BASED
PROTOTYPES FROM USE CASE
142
12.5.1 Generate Storyboard
Generate a storyboard from a scenario
Break down scenario into steps
Create a scene for each step
Sketching out a storyboard prompts designers to think
about design issues
143
Generate Storyboard
144
12.5.2 Generate Card-Based Prototype
Generate a card-based prototype from a use case
§ Consider each step in use case – what interaction element is needed
§ Draw a card that captures it
145
Generate Card-Based Prototype
146
3. Construction
147
12.6 Construction
There are many useful resources to support development.
In this section, we introduce two kinds of resources: physical computing kits and software
development kits (SDKs).
1. Physical computing kits
• Use electronics to build and code prototypes
• Toolkits available include:
Arduino
LilyPad (for fabrics)
Senseboard
BBC micro:bit
MaKey MaKey
• Designed to be used by wide range of people
2. Software Development Kits (SDK)
It is a package of programming tools and components that supports the development of
applications for a specific platform
148
12.6.1 Physical Computing Kits
Physical computing is concerned with how to build and code
prototypes and devices using electronics
The toolkit is composed of two parts:
Arduino board (see Figure 12.19): is the
piece of hardware that is used to build
objects
Arduino integrated development
environment (IDE), which is a piece of
software that makes it easy to
program and upload a sketch
The Arduino board
Source: Used courtesy of Dr. Nicolai Marquardt
149
Physical Computing Kits
The MaKey MaKey toolkit is composed of a
printed circuit board with an Arduino
microcontroller, alligator clips, and a USB
cable (see Figure 12.21).
The Makey Makey toolkit
Source: Makey Makey
150
Physical Computing Kits
reset button
USB connector
battery socket
radio & Bluetooth antenna
25 LED lights
processor
2 buttons
compass
accelerometer
FRONT
edge connector for accessories
BACK
The BBC micro:bit
Source: micro:bit. Used courtesy of Micro:bit Foundation
• One of the most recent physical computing systems is the BBC micro:bit (https://microbit .org, see Figure 12.22).
• Like Arduino, the micro:bit system consists of a physical computing device that is used in conjunction with an IDE.
• However, unlike Arduino, the micro:bit device contains a number of built-in sensors and a small display so that it
is possible to create simple physical computing systems without attaching any components or wires.
151
12.6.2 SDKs: Software Development Kits
• A software development kit (SDK) is a package of programming tools and
components that supports the development of applications for a specific
platform, for example, for iOS on iPhone and iPad and for Android on
mobile phone and tablet apps.
• Makes development much easier
• Includes: IDE (integrated development environment) , documentation,
drivers, sample code, and application programming interfaces (APIs)
152
Software Development Kits Examples
• Amazon’s Alexa Skills Kit for voice-based services
• Apple’s ARKit for augmented reality
• Microsoft’s Kinect SDK for body motion tracking
153
Summary
Prototyping may be low fidelity (such as paper-based) or high fidelity (such as software-based)
Existing software and hardware helps create prototypes
Generate prototypes from scenarios and use cases
Concrete design specifies design details, for example, layout or navigation.
Physical computing kits and software development kits facilitate the transition from
design to construction.
154
Thank You
155
Human Computer Interaction
Module 12: Interaction Design in Practice, Introducing
Evaluation
156
Contents
1. The Why, What, Where and When of Evaluation
2. Types of Evaluation
3. Evaluation Case Studies
157
Weekly Learning Outcomes:
1. Introduce a range of different types of evaluation methods
2. Discuss the use of different evaluation methods for different
purposes at different stages of the design process and in
different contexts of use.
158
The Why, What, Where and
When to Evaluate
159
14.2 Why, What, Where, and When to Evaluate
Evaluation is a
continuous
process that
studies:
Why: To check
users’
requirements and
confirm that users
can utilize the
product and that
they like it
What: A
conceptual model,
prototypes of a
new system in an
early stage, more
complete
prototypes, and a
prototype to
compare with
competitors’
products
Where: In natural,
in-the-wild, and
laboratory settings
When:
Throughout
design; finished
products can be
evaluated to
collect
information to
inform new
products
Unlike a lab study, seeing children play in a natural setting will reveal when the children get bored and stop playing with the toy.
In a lab study, the children are told what to do, so the UX researchers cannot easily see how the children naturally engage with
the toy and when they get bored. You can ask them but may be they will be afraid to say I do not like it!
160
14.3 Evaluation’s Types
CONTROLLED SETTINGS
NATURAL SETTINGS
ANY SETTINGS
161
14.3.1 Controlled Settings
directly involve users (for example,
usability and research labs)
The main methods are usability
testing and experiments.
Experiments are typically conducted in research labs at
universities or commercial labs to test such hypotheses. These
are the most controlled evaluation settings
162
14.3.2 Natural Settings
• Involving users (for instance, online communities and products that are
used in public places)
• The main method used is field studies (for example in-the-wild studies) à
Often there is little or no control over what users do, especially in in-thewild settings
• The goal of field studies is to evaluate products with users in their natural
settings
163
14.3.3 Any Settings
Cognitive walk-throughs involve simulating a user’s problemsolving process at each step in the human-computer dialogue
and checking to see how users progress from step to step in
these interactions
Doesn’t directly involve users (for example,
consultants and researchers critique the
prototypes, and may predict and model how
successful they will be when used by users
The range of methods includes inspections,
heuristics, walk-throughs, models, and
analytics.
Analytics is a technique for logging and analyzing data either at
a customer’s site or remotely
164
Living Labs
The concept of a living lab differs from a traditional view of a lab insofar as it is trying to be
both natural and experimental and the goal is to bring the lab into the home (or other
natural setting) or online
Living labs is used to evaluate
people’s use of technology in
their everyday lives.
Such evaluations are too
difficult to do in a usability
lab
More recent examples
include whole blocks and
cities that house hundreds
of people.
Many citizen science
projects can also be
thought of as living labs,
for instance, iNaturalist.org
165
14.3.4 Selecting and
combining methods
• Combinations of methods are used to get a richer understanding
• For example, sometimes usability testing conducted in labs is combined
with observations in natural settings to identify the range of usability
problems and find out how users typically use a product.
166
Evaluation Case Studies
167
14.4 Evaluation Case Studies
• Case studies are useful for understanding how different elements fit
together and how different elements (implementation, context and
other factors) have produced the observed impacts
• Different types of case studies, used for different purposes in evaluation
1. Computer Game Experiment: to test whether playing with automatic
computer is more fun than playing with real friends
2. An ethnographic study of visitors at the Royal Highland show in which
participants are directed and tracked using mobile phone App
168
Case Study 1
• Evaluate the participants’ engagement while playing an online ice-hockey game
• Evaluate users’ experiences when playing against a friend and when playing alone
against the computer
• Ten participants, who were experienced game players, took part in the experiment.
• During the experiment, sensors were placed on the participants to collect
physiological data.
• The data collected included measurements of the moisture produced by sweat glands
of their hands and feet and changes in heart and breathing rates
• In addition, they videoed the participants and asked them to complete user
satisfaction questionnaires at the end
• To reduce the effects of learning, half of the participants played first against a friend
and then against the computer, and the other half played against the computer first
169
Case Study 1
Figure 14.2 shows the setup for recording data while the participants were playing the game.
170
Case Study 1
Results from the user satisfaction questionnaire revealed that the mean ratings on a 1–5 scale for each item
indicated that playing against a friend was the favored experience (Table 14.1). Data
171
Case Study 2
• A live chatbot—was used to collect data about people’s
experiences, impressions, and feelings as they visited and moved
around the Royal Highland Show (RHS)
• The RHS is a large agricultural show that runs every June in
Scotland
• Ethnobot was programmed to ask participants pre-established
questions as they wandered around the show and to prompt them
to expand on their answers and take photos
• It also directed them to particular parts of the show that the
researchers thought would interest the participants
The study consisted of four data collection sessions using the
Ethnobot over two days and involved 13 participants, who
ranged in age and came from diverse backgrounds
• The Ethnobat directed Billy to a particular place
(Aberdeenshire Village)
• Next, Ethnobot asks “…what’s going on?”
• The screen shows five of the experience buttons from
which Billy needs to select a response
172
Experience responses submitted in
Ethnobot
I tried something
• Overall, the analyses revealed that
participants spent an average of
120 minutes with the Ethnobot on
each session and recorded an
average of 71 responses
• A total of 435 pre-established
responses were collected, including
70 that were about what the
participants did or experienced
17
I didn’t like something
9
I experienced something
0
I learned something
20
I enjoyed something
16
I bought something
8
0
5
10
15
20
25
Number of prewritten experience responses submitted by participants to
the pre-established questions that Ethnobot asked them about their
experiences
173
14.5 Lesson learned from Case Studies
• How to observe users in the lab and in natural settings
• How evaluators select different levels of control in the lab and in natural
settings and in crowdsourcing evaluation studies
• Use of different evaluation methods
• How to develop different data collection and analysis techniques to evaluate
user experience goals such as challenge and engagement
• The ability to run experiments on the Internet that are quick and inexpensive
using crowdsourcing – reaching many more participants
• Crowdsourcing involves a large group of dispersed participants contributing or producing goods
or services—including ideas, voting, micro-tasks, and finances—for payment or as volunteers
• How a large number of participants can be recruited using Mechanical Turk
• Amazon Mechanical Turk is a crowdsourcing website for businesses to hire remotely located
“crowdworkers” to perform discrete on-demand tasks that computers are currently unable to do. It is
operated under Amazon Web Services, and is owned by Amazon.
174
Evaluation Methods
175
Evaluation language
Analytics
Analytical
evaluation
Biases
Controlled
experiment
Crowdsourcing
Ecological
validity
Expert review
or criticism
Field study
Formative
evaluation
Heuristic
evaluation
176
Evaluation language
Informed
consent form
In the wild
evaluation
Living
laboratory
Predictive
evaluation
Reliability
Scope
Summative
evaluation
Usability
laboratory
User studies
Usability
testing
Users or
participants
Validity
177
Evaluation language
Informed consent form This form describes what a participant in an evaluation study will be asked to do,
what will happen to the data collected about them, and their rights while involved in the study.
In-the-wild study This is a type of field study in which users are observed using products or prototypes
within their everyday context.
Living lab This place is configured to measure and record people’s everyday activities in a natural setting,
such as in the home.
Predictive evaluation This type of evaluation is where theoretically based models are used to predict user
performance.
Reliability The reliability or consistency of a method is how well it produces the same results on separate
occasions under the same circumstances.
Scope This refers to how much the findings from an evaluation can be generalized.
Summative evaluation This evaluation is done when the design is complete.
Usability lab This lab is specially designed for usability testing.
Usability testing This involves measuring how well a design supports users’ performance on various tasks.
User studies This generic term covers a range of evaluations involving users, including field studies and
experiments.
Users or participants In this context, these terms are used interchangeably to refer to the people who take
part in evaluation studies.
Validity Is concerned with whether the evaluation method measures what it is intended
to measure.
178
14.6 Other issues to consider when doing Evaluation
• Informing participants about their rights? (consent form)
• Consider biases and other influences that impact how
you describe your evaluation findings
179
Things to consider when
interpreting data
Reliability: Does the method produce the same results on separate occasions?
Validity: Does the method measure what it is planned to measure?
Ecological validity: Does the environment of the evaluation distort the results?
Biases: Are there biases that distort the results?
Scope: How generalizable are the results?
180
Summary
Some of the data gathering methods are used in evaluation
Evaluations can be done in controlled settings such as laboratories, less controlled field settings, or
where users are not present
Usability testing and experiments enable the evaluator to have a high level of control over what gets
tested, whereas evaluators typically impose little or no control on participants in field studies
Different methods can be combined to get different perspectives
Participants need to be made aware of their rights
It is important not to over-generalize findings from an evaluation
181
Thank You
182
Human Computer Interaction
Module 1
What is Interaction Design?
1
1. Good and Poor Design
2
Good and Poor Design
• Interactive devices are pervasive in our daily life
• Smartphone, coffee machine, smoothie maker, e-reader, smart TV. etc.
• Some of the products are easy to use while some are not.
• Why?
• Keeping users in mind while designing the product makes it easy to
use.
• Many interfaces of new products do not adhere to the interaction
design principles validated in the 1990s.
• Important Question: How can we rectify this situation so that the
norm is that all new products are designed to provide good user
experiences?
3
Bad Design
• Two switches with light on each
switch
• The top switch turns the coffee maker
on and off. When it is on, its light goes
on.
• The bottom switch selects the
quantity of coffee desired,
• the smaller quantity of 3 or fewer cups
or the larger quantity of 4 or more cups.
• The problem is with the light on this
bottom switch.
• When would you expect the switch light
to go on, for the smaller quantity or for
the larger quantity?
www.baddesigns.com
• Why is this confusing?
• more coffee to be associated
with more light (light on).
4
Bad Design
• If you set the photocopier to
make 15 copies, sorted and
stapled. Then you push the big
button with the “C” to start
making your copies.
• What do you think will happen?
www.baddesigns.com
• The photocopier makes the copies
correctly.
• The photocopier settings are
cleared and no copies are made.
• If you selected (b) you are right!
The “C” stands for clear, not
copy.
5
Good Design
Why interface of this remote is better
designed?
• Shape to fit in hand
• Logical layout and color-coded,
distinctive buttons
• Easy-to-locate buttons
6
What to Design?
• Need to consider
•
•
•
•
•
the expected users
what might help people with the way they currently do things?
what might provide quality user experiences?
what people want and getting them involved in the design?
user-centered techniques during the design process
7
2. What is Interaction Design?
8
Interaction Design – I
“Designing interactive products to support the way people
communicate and interact in their everyday and working lives.”
Sharp, Rogers, and Preece (2019)
“The design of spaces for human communication and interaction.”
Winograd (1997)
Goal of Interaction Design is to develop usable products
Usability means easy to learn, effective to use, and provides an
enjoyable experience
9
Interaction Design – II
• Terms similar to interaction design:
• User interface design, software design, user-centered design, product design,
web design, experience design (UX)
• Interaction design is the umbrella term covering fundamental of
different disciplines
10
Interdisciplinary Field
The Figure shows that many people are involved in performing interaction design, ranging from social scientists
to movie-makers. This is not surprising given that technology has become such a pervasive part of our lives. But
it can all seem rather bewildering to the onlooker. How does the mix of players work together?
11
Interaction Design Academic Perspective
• Psychology
• Social Sciences
• Computing Sciences
• Engineering
• Ergonomics
• Informatics
12
Interaction Design Design Practices
• Graphic design
• Product design
• Artist-design
• Industrial design
• Film industry
13
Who is Involved?
• People from different backgrounds with different perspectives;
Pros
• More ideas and designs generated
Cons
• Difficult to communicate and progress forward the designs being create
14
3. The User Experience
15
The User Experience
• Product used by the people in the real world
• How people feel about the product, pleasure, satisfaction
• “Every product that is used by someone has a user experience: newspapers, ketchup bottles,
reclining armchairs, cardigan sweaters.” (Garrett, 2010)
• “All aspects of the end-user’s interaction with the company, its services, and its products.
(Nielsen and Norman, 2014)
• Interaction design focuses on design for a user experience
16
The iPod Phenomenon
• distinct family of rainbow
colors
• Simple, elegant, distinct
brand, pleasurable, catchy
names, cool…
• Quality of the
overall user experience
paled in comparison to that
provided by the iPod
17
Essential Aspects of Interaction Design
• Users involvement throughout the development of the project
• Identification and specification of usability and user experience goals
• Agreed upon with users
• Iterative process
18
Understanding Users
• Knowing users
• Age, education, where they live, work
• User understanding can help designers
• Understand user preferences
• How to design interactive products for good user experience
• One size does not fit all – children have different expectations than adults
• Cultural differences is also an important concern for interaction
design
19
4. Accessibility and Inclusiveness
20
Accessibility
Accessibility: the extent to which an interactive product is accessible by as many
people as possible
• Focus is on people with disabilities; for instance, those using android OS or apple voiceover
• Companies like Google and Apple provide tools for their developers to
promote this. The focus is on people with disabilities. For example,
Android OS provides a
• Accessibility can be achieved in two ways:
• first, through the inclusive design of technology,
• and second, through the design of assistive technology.
21
Inclusiveness
Inclusiveness: making products and services that accommodate the widest possible
number of people
• For example, smartphones designed for all and made available to everyone regardless of their
disability, education, age, or income
• People with permanent disabilities often use assistive technology in their
everyday life, which they consider to be life-essential and an extension of
their self.
• Examples include
• wheelchairs (people now refer to “wearing their wheels,” rather than “using a
wheelchair”)
• and augmented and alternative communication aids.
• Much current HCI research into disability explores how new technologies,
such as IoT, wearables, and virtual reality, can be used to improve upon
existing assistive technologies.
Inclusiveness aims to ensure that as many individuals as possible, regardless of their
diverse characteristics and needs, can access, use, and benefit from products and services
22
5. Usability and User Experience Goals
23
Usability goals
• Effectiveness – Effective to use
• Efficiency – Efficient to use
• Safety – Safe to use
• Utility – Have good utility
• Learnability – Easy to learn
• Memorability – Easy to remember how to use
24
Usability goals and
Questions
• Effectiveness
• Is the product capable of allowing people to learn, carry out their work efficiently, access the
information that they need, or buy the goods that they want?
• Efficiency
• Once users have learned how to use a product to carry out their tasks, can they sustain a high
level of productivity?
• Safety
• What is the range of errors that are possible using the product, and what measures are there
to permit users to recover easily from them?
25
User Experience Goals
Desirable aspects
Satisfying
Helpful
Enjoyable
Motivating
Engaging
Challenging
Pleasurable
Enhancing sociability
Exciting
Supporting creativity
Entertaining
Cognitively stimulating
Undesirable aspects
Boring
Frustrating
Making one feel guilty
Annoying
Childish
Fun
Provocative
Surprising
Rewarding
Emotionally fulfilling
Experiencing flow
Unpleasant
Patronizing
Making one feel stupid
Cutesy
Gimmicky
26
Design principles
• Abstractions for thinking about different aspects of design
• The do’s and don’ts of interaction design
• What to provide and what not to provide at the interface
• Derived from a mix of theory-based knowledge, experience, and
common-sense
27
Feedback – Examples of poor interface
• Sending information back to the user about what
has been done
“ccclichhk”
• Includes sound, highlighting, animation, and
combinations of these
• For example, when screen button is clicked, it
provides sound or red highlight feedback:
28
Consistency
• Similar operations must have similar elements for similar tasks.
• for example, always use Ctrl key plus first initial of the command for an
operation: Ctrl+c, Ctrl+s, Ctrl+o
• Consistent interfaces are easier to learn and use
• Internal consistency
• designing operations to act the same within an application
• External consistency
• designing same operations and interfaces across applications and device
29
summary
Designing interactive products to support how
communication and interaction
How to create quality user experiences for services,
devices, and interactive products
Interaction design is a multidisciplinary field
Consideration of the context of use, types of
activity, UX goals, accessibility, cultural differences,
and user groups.
Design principles, such as feedback and simplicity,
are useful heuristics for informing, analyzing, and
evaluating aspects of an interactive product.
Human Computer Interaction
Module 2
THE PROCESS OF INTERACTION DESIGN
3
1
1. Introduction
32
Introduction
• This chapter focuses on
• what interaction design involves.
• discussing the advantages of involving users in development.
• what is a user-centered approach.
• introducing the four basic activities of interaction design
• asking some important questions about the interaction design process
• Incorporating interaction design activities can be integrated into other development
lifecycles.
33
Activity
• Let’s design a cloud-based service
• to enable people to share their photos, movies, music, chats, documents, and so on,
in an efficient, safe, and enjoyable way.
• What would you do?
• How would you start?
• Would you begin by sketching how the interface might look, work out how
the system architecture should be structured, or just start coding?
• Would you start by asking users about their current experiences with
sharing files and examine the existing tools, for example, Dropbox and
Google Drive?
34
The double diamond of design
• The Design Council of the United Kingdom captures these in the double
diamond of design,
• This approach has four phases which are iterated:
• Discover: Designers try to gather insights about the problem.
• Define: Designers develop a clear brief that frames the design challenge.
• Develop: Solutions or concepts are created, prototyped, tested, and
iterated.
• Deliver: The resulting project is finalized, produced, and launched.
35
The double diamond of design
Source: Adapted from The Design Process: What is the Double Diamond?
36
Activity 2.1
37
Activity 2.1
38
2. What is involved in interact design?
39
What is involved in Interaction Design?
• Interaction Design is a process focusing on:
§ discovering requirements, designing to fulfil requirements, producing prototypes and
evaluating them
§ considering users and their goals
§ involving trade-offs to balance conflicting requirements
• Exploring alternatives and the best out of them
• Four approaches:
• user-centered design,
• activity-centered design,
• systems design,
• genius design
40
Importance of users involvement
Investigate about the
• current user experience?
• the change needed?
• Improvement the change will bring to the situation?
Explore and articulate the problem space
• Team effort
• different perspectives
• Avoid incorrect assumptions and unsupported claims
result of decades of research into
human factors of information displays
41
Understanding the problem space
• Users’ Expectation
• Wishes and needs
• Realistic expectations
• Avoid surprises and disappointments
• Timely training and communication
• Ownership is the key
• Active stakeholders vs passive listeners
• Problems identification and acceptance
• Essential or for product acceptance and success
42
Degrees of user involvement
• Users can be involved at different stages
• Full time: constant input, but lose touch with users
• Part time: patchy input, and very stressful
• Short term: inconsistent across project life
• Long term: consistent, but lose touch with users
• Face-to-face meetings in group or individual activities
• Market-driven products
• Virtual contributions from thousands of users
• Online Feedback Exchange (OFE) systems
• Crowdsourcing design ideas
• Citizen science
• Users may also be involved after product release
43
User-centered approach
User-centered approach is based on :
• Early focus on users and tasks
• directly studying cognitive, behavioral, anthropomorphic, and attitudinal characteristics
• Empirical measurement
• users’ reactions and performance to scenarios, simulations, and prototypes are
observed, recorded, and analyzed
• Iterative design
• finding problems with user testing, fix them and carry out more tests
44
3. Activities of interaction design
45
Four basic activities of Interaction Design
1.
2.
3.
4.
Discovering requirements
Designing alternatives
Prototyping alternative designs
Evaluating product and its user experience throughout
46
Discovering requirements
• discovering something new about the world and defining what will be
developed.
• In the case of interaction design,
• understanding the target users
• the support an interactive product could usefully provide
• this understanding is gleaned through data gathering and
analysis
47
Designing alternatives
• This is the core activity
• proposing ideas for meeting the requirements
• For interaction design this activity can be viewed as two subactivities:
• Conceptual design involves producing the conceptual model for the product
• conceptual model describes an abstraction outlining what people can do with a product
and what concepts are needed to understand how
to interact with it
• Concrete design considers the detail of the product including the colors,
sounds, and images to use, menu design, and icon design
• Alternatives are considered at every point
48
Prototyping
• Designing the behavior of interactive products as well as their look and feel.
• The most effective way for users to evaluate such designs is to interact with
them, and this can be achieved through prototyping.
• This does not necessarily mean that a piece of software is required.
• There are different prototyping techniques, not all of which require a working
piece of software
• For example,
• paper-based prototypes are quick and cheap to build and are effective for identifying
problems in the early stages of design,
• and through role-playing users can get a real sense of what it will be like to interact with
the product.
49
Evaluating
• Evaluation is the process of determining the usability and acceptability of the
product or design
• It is measured in terms of a variety of usability and user-experience criteria.
• Evaluation does not replace activities concerned with quality assurance
• QA and Testing activities are focused to make sure that the final product is fit
for its intended purpose, but it complements and enhances them
50
Simple Interaction design life cycle
51
Google Design Sprints (Knapp et al., 2016)
Source: Google Design Sprints (used courtesy of Agile Marketing)
52
Google Design Sprints (Knapp et al., 2016)
For example, Google Design Sprints (Box 2.3) emphasize problem investigation, solution
development, and testing with customers all in one week. This does not result in a robust
final product, but it does make sure that the solution idea is acceptable to customers. The
in-the-wild approach (Box 2.4) emphasizes the development of novel technologies that are
not necessarily designed for specific user needs but to augment people, places, and settings.
Pages 53-54.
53
Research in the Wild (Rogers and Marshall, 2017)
A framework for research in the wild studies
Source: Rogers and Marshall, 2017, p6. (used courtesy of Morgan and Claypool)
54
4. Practical issues
55
Some practical issues
• Who are the users?
• What are the users’ needs?
• How to generate alternative designs?
• How to choose among alternatives?
• How to integrate interaction design activities with other lifecycle
models?
56
Knowing stakeholders
Not easy
• 382 distinct types of users for smartphone apps (Sha Zhao et al, 2016)
• Many products are intended for use by large sections of the population, so
user is “everybody”
• More targeted products are associated with specific roles
Stakeholders
• Larger than the group of direct users
• Identifying stakeholders helps identify groups to include in interaction design
activities
57
Knowing users’ needs
• Wishes vs. needs
• Users rarely know what they need and what is possible
• Designers must:
§ Explore the problem space
§ Investigate who are the users
§ Investigate user activities to see what can be improved
§ Try out ideas with potential users
• Focus on peoples’ goals, usability, and user experience goals, rather
than expect stakeholders to articulate requirements
58
Generating and choosing among alternatives
• Considering alternatives helps identify better designs
• Where to search for?
§ ‘Flair and creativity’: research and synthesis
§ Cross-fertilization of ideas from different perspectives
§ Users can generate different designs
§ Product evolution based on changing use
§ Seek inspiration: similar products and domain, or different products and domain
• Balancing constraints and trade-offs
• Evaluation with users or peers
• A/B testing and quality assurance
59
Integrating interaction design activities within other models
• Integrating interaction design activities in lifecycle models from other disciplines
requires careful planning
• Software development lifecycle models are prominent
• Integrating with agile software development is promising because:
§ It incorporates tight iterations
§ It champions early and regular feedback
§ It handles emergent requirements
§ It aims to strike a balance between flexibility and structure
60
summary
Discovering requirements,Designing
alternatives, Prototyping, Evaluating
Early focus on users
and tasks
Empirical
measurement using
quantifiable and
measurable usability
criteria
Iterative design
Human Computer Interaction
Module 3
Conceptualizing Interaction
6
2
1. Conceptualizing Interaction and models
63
Conceptualizing design
Proof of concept
• Envisioning the working of proposed product
Why conceptualize?
• Finishing the vague ideas and assumptions about the benefits of the proposed product in
terms of their feasibility
• Feasibility to develop
• Desirable and usefulness.
64
Assumptions and claims
• Specify assumptions and claims
• Try to defend and support them by what they will provide
• Identify
§ what ideas are vague or unrealistic
§ human activities and interactivities that are problematic
• Iteratively work out how the design ideas might be improved
65
Assumptions
• Taking something for granted when it needs further investigation
§ For example, people will want to watch TV while driving
Technotopic Narratives and Networked Subjects: Preparations for Everyday Life in Cooltown
66
Claims
• Stating something to be true when it is still open to question
§ For example, “a multimodal style of interaction for controlling GPS — one that
involves speaking while driving — is safe.”
67
Activity
How will enabling robot waiters to speak to customers enhance their
experience?
Source: Xinhua, Guo Cheng
68
Identifying the problem
• For example:
§ The robot could take orders and entertain customers by having a conversation
with them
§ The robot could make recommendations for different customers, such as
restless children or fussy eaters
• But just assumptions
• The real problem being addressed:
“It is difficult to recruit good wait staff who provide the level of customer
service to which we have become accustomed.”
69
Analyzing the problem space
• What are the problems with an existing product or user experience?
• What are the reasons of these problems?
• How the proposed design will might sole these problems?
• For new user experience, how the proposed design ideas support,
change, or extend current ways of doing things?
70
Activity
• What were the assumptions and claims made about watching 3D TV?
Source: Andrey Popov, Shutterstock
71
Activity- Assumptions and claims:
• There was no existing problem to overcome
§ What was being proposed was a new way of experiencing TV
• An assumption
§ People would really enjoy the enhanced clarity and color detail provided by 3D
• A claim
§ People would not mind paying a lot more for a new 3D-enabled TV screen because of
the new experience
72
Benefits of conceptualizing
Orientation
• It encourages design teams to ask specific questions to understand the
conceptual model
Open-minded
• Motivates design teams to avoid from becoming narrowly focused early on
Common ground
• Establish a set of commonly agreed terms
73
Problem space to design space
• Having a good understanding of the problem space can help inform
the design space
§ For example, what kind of interface, behaviour, functionality to provide
• Before deciding upon these, it is important to develop a conceptual
model
74
What is a conceptual model?
• A conceptual model is:
“…a high-level description of how a system is organized and operates” (Johnson
and Henderson, 2002, p26)
• A conceptual model enables:
“…designers to straighten out their thinking before they start laying out their
widgets” (Johnson and Henderson, 2002, p28)
• Provides a working strategy and framework of general concepts
and their interrelations
75
Components of a Conceptual model
• Specifying Metaphors and analogies
• Understand what a product is for and how to use it for an activity
• Understand concepts that people are exposed to through the product
§ For example
§ Task–Domain objects, their attributes, and operations
• What is the relationship between these concepts
76
Formulating a conceptual model
• Understand users tasks and activities?
• How will the system support these?
• What are the appropriate interface metaphor?
• What kinds of interaction modes and styles to use?
§ Always consider how the user will understand the underlying conceptual model
• Many kinds of conceptual models
• The best conceptual models are:
§ Obvious and simple
§ The operations they support are intuitive to use
77
2. Interface Metaphors
78
Interface metaphors
• Although the interface designs are similar to a physical entity but also
has own properties
• desktop metaphor, and web portals
• These are based on activity, object, or a combination of both
• The designers must exploit user’s familiar knowledge and help them
to understand ‘the unfamiliar’
• Examples
• Conceptualizing what users are doing – surfing the Web
• A conceptual model instantiated at the interface – the desktop metaphor
• Visualizing an operation – an icon of a shopping cart into which the user
places items
79
Example of interface metaphors
• The card is a very popular UI.
Why?
§ It has familiar form factor
§ It can easily be flicked
through, sorted, and themed
§ It structures content into
meaningful chunks (similar to
how paragraphs are used to
chunk a set of related sentences
into distinct sections)
§ Its material properties give
the appearance of the surface
of paper
Google Now card for restaurant
recommendation in Germany
Source: Johannes Shonning
80
Pros and Cons of interface metaphors
Pros
• Makes learning new systems
easier
• Helps users understand the
underlying conceptual model
• Can be very innovative and
enable the realm of
computers and their
applications to be made
more accessible to a greater
diversity of users
Cons
• Break conventional and cultural
rules
• Can constrain designers in the
way that they conceptualize a
problem space
• Conflicts with design principles
• Forces users to understand only
the system in terms of the
metaphor
• Designers can inadvertently use
bad existing designs and
transfer the bad parts over
• Limits designers’ imagination in
coming up with new conceptual
models
81
3. Interaction types
82
Interaction types
• Instructing
§ Used for issuing commands and selecting options
• Conversing
§ Use for interacting with a conversational system
• Manipulating
§ Designed for interacting with objects in a virtual or physical space by manipulating them
• Exploring
§ Interface for moving through a virtual environment or a physical space
• Responding
§ The system initiates the interaction and the user chooses whether to respond in a specific
manner
83
Instructing
• End users instruct with the system what to do
§ For example: Tell the time, print a file, or save a file
• Very common conceptual model covering the diversity of devices
and systems
§ For instance: Word processors, VCRs, and vending machines
• The main benefit is that instructing supports quick and efficient
interaction
§ Good for repetitive kinds of actions performed on multiple objects
84
Example
Which is easiest and why?
85
Conversing
• Models of having a conversation with another human
• Simple voice recognition, menu-driven systems to more
complex ‘natural language’ dialogs
• Examples
• timetables, search engines, advice-giving systems, and help systems
• virtual agents, chatbots, toys, and pet robots designed to converse with you
86
How good is Conversing
Pros
• Allows users, especially novices, to interact with a system in a way
that is familiar to them
§ Can make them feel comfortable, at ease, and less scared
Cons
• Misunderstandings can arise when the system does not know how to
parse what the user says
§ For example, voice assistants can misunderstand what children say
87
Manipulating
• Involves
• dragging, selecting, opening, closing and zooming actions on virtual objects
• Based on users’ knowledge of how they move and manipulate in the
physical world
• Can involve actions using physical controllers
• (for example, Nintendo Wii) or air gestures (such as, Microsoft Kinect) to
control the movements of an on-screen avatar
• Tagged physical objects (for instance, balls) that are manipulated in a
physical world result in physical/digital events (such as animation)
88
Direct Manipulation (DM)
• Coined by Ben Shneiderman (1983)
• Three essential properties:
§ Continuous representation of objects and actions of interest
§ Physical actions and button pressing instead of issuing commands with
complex syntax
§ Rapid reversible actions with immediate feedback on object of interest
89
Direct Manipulation
Pros
Cons
• Helpful for novices
• the metaphor of direct manipulation can be
considered too literally
• Experienced users can work extremely rapidly to carry
out a wide range of tasks−even defining new
functions
• Not all tasks can be described by objects,
• Intermittent users can retain
operational concepts over time
• Some tasks are better
achieved through delegating
– spell checking
• Error messages rarely needed
• Can cover screen space
• Users gain confidence and
mastery and feel in control
• Moving a cursor using a mouse or touchpad can be
slower
90
Exploring
• Is designed for applications for moving through virtual or physical
environments
§ Users can explore aspects of a virtual 3D environment
§ Sensors are used to embedded physical environments to trigger digital or
physical events to happen
• Examples of virtual environments, including cities, parks, buildings,
rooms, and datasets
§ Enable users to fly over them and zoom in and out of different parts
91
Seeing things larger than life in VR
Cyber-Insects in the CAVE
Source: Alexei A. Sharov
92
Responding
• System takes the initiative to alert user
• System does this by:
§ Detecting the location and-or presence of someone in a vicinity and
notifies them on their phone or watch,
§ What it has learned from their repeated behaviors
• Examples:
§ Alerts the user of a nearby coffee bar where some friends are meeting
§ User’s fitness tracker notifies them of a milestone reached
• Automatic system response without any requests made by the
user
93
Which Interaction Style to Choose
• Direct manipulation
• For ‘doing’ types of tasks – designing, drawing, flying, driving, or sizing
windows
• Issuing instructions
• For repetitive tasks – spell-checking and file management
• Having a conversation I
• For certain services – finding information or requesting music
• Hybrid conceptual
• For supporting multiple ways of carrying out the same actions
94
Interaction type vs. Interaction style
Interaction type:
• A description of what the user is doing when interacting with a system, for
example, instructing, talking, browsing, or responding
Interface style:
• The kind of interface used to support the interaction, for instance, command,
menu-based, gesture, or voice
95
4. Paradigms, Visions, Theories, Models, and Frameworks
96
Paradigm
• Inspiration for a conceptual model
• General approach adopted by a community for carrying out research
§ Shared assumptions, concepts, values, and practices
§ For example, desktop, ubiquitous computing, in the wild
• Pervasive computing
• Wearable computing
• Internet of Things (IoT)
97
Visions and Theory
Visions
• A driving force that frames research and development
• Provide concrete scenarios of how society can use the next
generation of imagined technologies
• Also raise ethical questions such as, privacy and trust
Theory
• Explanation of a phenomenon
• For example, information processing that explains how the mind, or some aspect of
it, is assumed to work
• Can help identify factors relevant to the design and evaluation of
interactive products
• Such as cognitive, social, and affective
98
Framework
• Set of interrelated concepts and-or specific questions for ‘what to look for’
• Provide advice on how to design user experiences
§ Helping designers think about how to conceptualize learning, working,
socializing, fun, and emotion
• Focus on how to design particular kinds of interfaces to evoke certain
responses
• Come in various forms:
§ Such as steps, questions, concepts, challenges, principles, tactics, and
dimensions
99
summary
Understanding the problem space,
Being clear about your assumptions
and claims, Specifying how the
A conceptual
proposed
model
is a high- design will support users
level description
of a product in
terms of user
needs
Paradigms, visions,
theories, models,
and frameworks
provide ways for
framing interaction
design research
Human Computer Interaction
Module 4
Cognitive Aspects
1
0
1. Introduction
10
2
4.1: Introduction: Multi-tasking?
•
The study of human cognition can help us understand the impact of multitasking on human behavior.
•
There are many different kinds of cognition, such as thinking, remembering, learning, daydreaming,
decision-making, seeing, reading, talking, writing, etc.
•
First way of classifying cognition (Norman, 1993):
§Experiential: where people perceive, act, and react to events.
§Examples include driving a car, reading a book, having a conversation, and watching a video)
§Reflective: involves mental effort, attention, judgment, and decision-making, which can lead to new
ideas and creativity.
§Examples include designing, learning, and writing a report) cognition
•
Second way of classifying cognition (Kahneman, 2011) :
§Fast: reflexive, and effortless
§Example: 2+2
§Slow thinking: takes more time and is considered to be more logical and demanding, and it requires
greater concentration)
§Exampe: 21*19
10
3
Understanding cognition
• Understanding cognition can:
• Provide knowledge about what users can and cannot be expected to do
• Identify and explain the nature and causes of problems that users encounter
• Provide theories, modeling tools, guidance, and methods that can lead to the
design of better interactive products
10
4
2. What is cognition?
10
5
Cognitive processes
Cognition has also been described in terms of specific kinds of processes. These include
the following:
1. Attention
2. Perception
3. Memory
4. Learning
5. Reading, speaking and listening
6. Problem-solving, planning, reasoning and decision-making
10
6
Attention: Clear Goal
•
Recognizing and selecting things on which to concentrate at a point in time, from the range of possibilities
available, allowing us to focus on information that is relevant to what we are doing
• Text while watching TV!
•
It may involve audio and/or visual senses
4.2.1.1 Clear Goal – Focused and divided attention
Focused: When someone has just landed at an airport after a long flight, which did not have Wi-Fi onboard,
and they want to find out who won the Champions League, you will focus to find out the result
Divided: When going to a restaurant, someone may have vague idea of what they want to eat, scan the
menu, imagine how dishes look to be + considering the price, restaurant specialty, waiter recommendation
à then you decide
10
7
Attention: Multitasking
•
Enables us to be selective in terms of the mass of competing stimuli, but limits our ability to keep track
of all events
4.2.2.3 Multitasking and Attention – Is it possible to perform multiple tasks without one or more of
them being detrimentally affected? There has been much research on the effects of multitasking on
memory and attention.
The general finding is that it depends on the nature of the tasks and how much attention each
demands
•
Design recommendation
•
Information at the interface should be structured to capture users’ attention
•
For example, use perceptual boundaries (windows), color, reverse video, sound, and flashing lights
•
Use techniques to achieve this – color, ordering, spacing, underlining, sequencing, and animation
•
Avoid cluttering visual interfaces with too much information
•
Consider designing different ways to support effective switching and returning to an interface
10
8
Perception
• Information acquisition from the world and transformation into
experiences
• Obvious implication is to design representations that are readily
perceivable, for instance:
§ Text should be legible
§ Icons should be easy to distinguish and read
10
9
Activity
What is the time?
What is the time?
What is the time?
What is the time?
What is the time?
Which is the easiest to read and why?
11
0
Design recommendation
• Icons should enable users to distinguish their meaning readily
• Bordering and spacing are effective visual ways of grouping
information
• Sounds should be audible and distinguishable
• Research proper color contrast techniques when designing an
interface:
11
1
Memory
• Recalling of knowledge to act appropriately
§ For example, recognizing someone’s face or remembering someone’s name
• We don’t remember everything
• filtering and processing
• Context is important as to how we remember (that is, where, when, how, and so
on)
• We recognize things much better than being able to recall things
• We remember less about objects that we have photographed than when we
observe them with the naked eye (Henkel, 2014)
11
2
Recognition vs. recall
• Command-based interfaces require users to recall from memory a name from a possible
set of 100s of names
• Graphical interfaces provide visually-based options (menus, icons) that users need only
browse through until they recognize one
• Memory load
• Online/mobile and phone banking now require users to provide multiple pieces of
information to access their account
• For instance, ZIP code, birthplace, a memorable date, first school attended
• Reduces stress and memory load on users
• Passwords could become extinct (no longer existing) with the widespread use of
biometrics and computer vision algorithms
11
3
Design recommendations
• Reduce cognitive load by avoiding long and complicated procedures
for carrying out tasks
• Design interfaces that promote recognition rather than recall
• Provide users with various ways of labelling digital information to help
them easily identify it again
§ For example, folders, categories, color, flagging, and time stamping
11
4
Learning
• Learning is closely connected with memory
• Learning involves the accumulation of skills and knowledge that would be
impossible to achieve without memory
• Two main types:
• Incidental learning (for example, recognizing people’s faces, what you did
today)
• Intentional learning (for instance, studying for an exam, learning to cook)
• Intentional learning is much harder!
• Many technologies have been developed to help (for example, multimedia,
animations, VR)
• People find it hard to learn by following instructions in a manual
• People prefer to learn by doing
11
5
Design recommendations
• Design interfaces that encourage exploration
• Design interfaces that constrain and guide learners
• Dynamically linking concepts and representations can facilitate the learning
of complex material
11
6
Reading, speaking, and listening
• The ease with which people can read, listen, or speak differs:
• Many prefer listening to reading
• Reading can be quicker than speaking or listening
• Listening requires less cognitive effort than reading or speaking
• Voice user interfaces allow users to interact with them by asking questions – Google
Voice, Siri, and Alexa
• Speech-output systems use artificially-generated speech – written text-to-speech systems
for the visually impaired
• Natural-language systems enable users to type in questions and give text-based
responses – chatbots
11
7
Design recommendations
• Speech-based menus and instructions should be short
• Highlight the intonation of artificially generated speech voices
§ They are harder to understand than human voices
• Provide opportunities for making text large on a screen
• without affecting the formatting, for people who find it hard to read
small text
11
8
Problem-solving, planning, reasoning, and
decision-making
• All these processes involve reflective cognition
§ For example, thinking about what to do,
§ what the options are, and the consequences
• Often involves conscious processes, discussion with others (or
oneself), and the use of artifacts
§ Such as maps, books, pen and paper
• Also need to work through different scenarios and selecting the best
one
• Exploring the alternatives
11
9
Design recommendations
• Provide information and help pages that are easy to access for people who wish
to understand more about how to carry out an activity more effectively (for
example, web searching)
• Use simple and memorable functions to support rapid decision-making and
planning
12
0
3. Cognitive Frameworks
12
1
4.3 Cognitive frameworks
• These framework are used to explain and predict user behavior at the
interface
§ Based on theories of behavior
§ Focus is on mental processes
§ Also use of artifacts and representations
• Most well known are:
§ Mental models
§ Gulfs of execution and evaluation
§ Distributed cognition
§ External and embodied cognition
12
2
Mental models
• Knowledge is sometimes described as a mental model:
• How to use the system (what to do next)
• What to do with unfamiliar systems (used for the first time) or unexpected
situations (how the system works)
• Users develop an understanding of a system through learning about
and using it
• mental models are used to make inferences
12
3
Activity
You arrive home on a cold winter’s night to a cold house. How do you get the
house to warm up as quickly as possible?
1. Set the thermostat to be at its highest
2. or to the desired temperature?
Many people when asked (a) choose the first option Why?
•
•
They think it will heat the room up quicker
But it is a wrong mental model for thermostats based on on-off switch model
Most of us have erroneous mental models (Kempton, 1996)
Just watch people waiting for an elevator. How many times do they press the button? A lot
of people will press it at least twice. When asked why, a common reason is that they think it
will ensure the elevator arrives.
12
4
UX for better mental models
• UX designers can help to build better mental models by
• Clear and easy to use instructions
• Tutorials and context sensitive guidance
• Videos and chatbots
• Transparency: to make interfaces intuitive to use
• Knowing what actions an interface allows
• For example, swiping, clicking, or selecting
12
5
Gulfs of execution and evaluation
• The gulf of execution and the gulf of evaluation describe the gaps that exist
between the user and the interface
• The gulf of execution
§ The distance from the user to the physical system
• The gulf of evaluation
§ The distance from the physical system to the user
• Bridging the gulfs is important to reduce cognitive efforts required to perform
tasks
by designing usable interfaces that match the psychological
characteristics of the user (for example, taking into
account their memory limitations)
and by the user learning to create goals, plans, and action
sequences that fit with how the interface works
12
6
Distributed cognition
• Information is transformed through different media (computers, displays,
paper, heads)
• Distributed cognition model involves interactions among people, the artifacts
they use, and the environment in which they are working
12
7
External cognition
• Explains how we interact with external representations
(such as maps, notes, and diagrams)
• cognitive benefits and the processes involved
• What technologies can we develop to help people carry
out complex tasks (for example, learning, problem solving,
and decision-making)?
• Externalizing to reduce memory load
• use of diaries, reminders, calendars, notes, shopping lists, todo lists
12
8
Design recommendations
• Provide external representations at the interface to reduce memory
load
§ For example, information visualizations have been designed to allow people
to make sense and rapid decisions about masses of data
12
9
summary
Cognition involves different processes including
attention, memory, perception, and learning
Interface design is
highly affected by
how well users can
perceive, attend,
learn, and
remember how to
do their tasks
Theoretical
frameworks, such as
mental models and
external cognition,
provide ways of
understanding how
and why people
interact with
products
Human Computer Interaction
Module 5
Social and Emotional Interaction
1
3
Chapter 5: Social Interaction
1
3
1. Being Social and remote conversations
1
3
Social interaction
• We live together, work together, play together, talk to each other, and
socialize
Are we spending too much time in our own digital bubbles?
9
Just Think
• Are F2F conversations being superseded by social media interactions?
• How many friends do you have on Facebook, LinkedIn, WhatsApp,
and so on versus real life?
• How much do they overlap?
• How are the ways that we live and interact with one another
changing?
13
5
Conversational rules
Conversational mechanisms enable people to coordinate their talk with one another,
allowing them to know how to start and stop
Rule 1: The current speaker chooses the next speaker by asking an opinion, question,
or request
Rule 2: Another person decides to start speaking
Rule 3: The current speaker continues talking
Farewell rituals
• Bye then, see you, yeah bye, see you later, …
• Repeating themselves several times until they finally separate
Sacks et al. (1978)
13
6
online conversations
• Do the same conversational rules apply?
• How do people repair them for:
§ Email?
§ Instant messaging?
§ Texting?
§ Skype or other videoconferencing software?
13
7
online conversations
VideoWindow system (Bellcore, 1989)
videophone from the 1960s
13
8
Videoconferencing and telepresence rooms
• Many to choose from to connect multiple people (for instance, Zoom)
• Customized telepresence rooms for groups
13
9
Telepresence and Social presence
• Telepresence refers to one party being present with
another party, who is present in a physical space,
such as a meeting room (Telepresence robots are also
being investigated to determine whether they can
help people who have developmental difficulties visit
places remotely)
• Social presence refers to the feeling of being there
with a real person when in virtual reality
Telepresence robots
• Two avatars (Jack and Diane) are talking at a virtual table beside a lake
and with some mountains in the background.
• Users experience this by wearing virtual reality (VR) headsets.
• The goal is to provide users with a magical feeling of presence
• To make the experience appear more life-like,
users can move their avatar’s arms through controls provided by the VR Facebook’s vision of socializing in a
OculusTouch.
3D world using VR (social presence)
14
0
2. Social Engagement
14
1
Social engagement
• Participation in activities of a social group
• Social exchange where people give or receive something from others
• Voluntary, unpaid
• Websites often used as hub to connect people
• Retweeting is a powerful way of connecting millions of people…
• The epic Twitter battle between Ellen DeGeneres and Carter Wilkerson
• Millions retweeted in the space of hours
14
2
Social Interaction
• Social interaction is central to our everyday lives
• Enable us to collaborate and coordinate our activities
• Keeping aware of what others are doing and letting others know what you are
doing are important aspects of collaborative working and socializing
• Many technology systems have been built to support telepresence, social
presence, and co-presence
• Social media has changed the way people keep in touch and manage their social
lives
14
3
summary
Emotional aspects of interaction design are
concerned with how to facilitate certain states
(for example, pleasure) or avoid reactions (for
instance, frustration)
Badly designed interfaces make people
frustrated, annoyed, or angry
Emotional technologies can be designed to
persuade people to change their behaviors
Anthropomorphism is the attribution of human
qualities to objects
Chapter 6: Emotional Interaction
14
5
3. Emotions and the User Experience
14
6
Emotions and the user experience
• Emotional interaction is concer…