please refer to attachment questions, you may refer to lectures slides if needed to support the answers.
Textbook
College of Computing and Informatics
Human Computer Interaction
1
Human Computer Interaction
Module 1
What is Interaction Design?
2
Contents
1. Good and Poor Design
2. What Is Interaction Design?
3. The User Experience
4. Accessibility and Inclusiveness
5. Usability and User Experience Goals
3
Weekly Learning Outcomes
1. Define interaction design and how it relates to HCI and
explain the difference between good and poor design
2. Explain the relationship between the user experience
and usability
3. Introduce what is meant by accessibility an
inclusiveness in relation to HCI
4
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: chapter 1 Page 1 to 34
Recommended Reading
1. COOPER, A., REIMANN, R., CRONIN, D. AND NOESSEL, C. (2014) About
Face: The Essentials of Interaction Design (4th ed.). John Wiley & Sons Inc.
https://www.wiley.com/enps/About+Face:+The+Essentials+of+Interaction+Design,+4th+Edition-p9781118766576
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
1. Good and Poor Design
6
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?
7
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).
8
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.
9
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
10
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
11
2. What is Interaction Design?
12
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
13
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
14
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?
15
Interaction Design Academic Perspective
• Psychology
• Social Sciences
• Computing Sciences
• Engineering
• Ergonomics
• Informatics
16
Interaction Design Design Practices
• Graphic design
• Product design
• Artist-design
• Industrial design
• Film industry
17
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
18
3. The User Experience
19
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
20
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
21
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
22
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
23
4. Accessibility and Inclusiveness
24
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.
25
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.
26
5. Usability and User Experience Goals
27
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
28
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?
29
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
30
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
31
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:
32
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
33
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
5
Contents
1. Introduction
2. What is involved in interact design?
3. Activities of interaction design
4. Practical issues
3
6
Weekly Learning Outcomes
1. Reflect on what interaction design involves and explain
the main principles of a user-centered approach.
2. Introduce the four basic activities of interaction design
and how they are related in a simple lifecycle model.
3
7
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: chapter 1 Page 37 to 55
Recommended Reading
KELLEY, T., with LITTMAN, J. (2016) The Art of Innovation, Profile Books.
https://profilebooks.com/work/the-art-of-innovation/
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
1. Introduction
39
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.
40
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?
41
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.
42
The double diamond of design
Source: Adapted from The Design Process: What is the Double Diamond?
43
Activity 2.1
44
Activity 2.1
45
Human Computer Interaction
Module 2
THE PROCESS OF INTERACTION DESIGN
4
6
Contents
1. Introduction
2. What is involved in interact design?
3. Activities of interaction design
4. Practical issues
4
7
Weekly Learning Outcomes
1. Reflect on what interaction design involves and explain
the main principles of a user-centered approach.
2. Introduce the four basic activities of interaction design
and how they are related in a simple lifecycle model.
4
8
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: chapter 1 Page 37 to 55
Recommended Reading
KELLEY, T., with LITTMAN, J. (2016) The Art of Innovation, Profile Books.
https://profilebooks.com/work/the-art-of-innovation/
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
2. What is involved in interact design?
50
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
51
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
52
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
53
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
54
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
55
3. Activities of interaction design
56
Four basic activities of Interaction Design
1.
2.
3.
4.
Discovering requirements
Designing alternatives
Prototyping alternative designs
Evaluating product and its user experience throughout
57
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
58
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
59
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.
60
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
61
Simple Interaction design life cycle
62
Google Design Sprints (Knapp et al., 2016)
Source: Google Design Sprints (used courtesy of Agile Marketing)
63
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.
64
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)
65
4. Practical issues
66
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?
67
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
68
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
69
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
70
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
71
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
7
3
Contents
1. Conceptualizing Interaction and models
2. Interface Metaphors
3. interaction types
4. Paradigms, Visions, Theories, Models, and Frameworks
7
4
Weekly Learning Outcomes
1. Explain conceptualize interaction by describing what a
conceptual model is and how to begin to formulate one.
2. Discuss the use of interface metaphors as part of a
conceptual model and outline the core interaction types
for informing the development of a conceptual model.
3. Introduce paradigms, visions, theories, models, and
frameworks informing interaction design.
7
5
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: chapter 3 Page 69 to 97
Recommended Reading
JOHNSON, J. and HENDERSON, A. (2012) Conceptual Models: Core to Good
Design.Morgan and Claypool Publishers.
https://www.morganclaypool.com/doi/abs/10.2200/S00391ED1V01Y201111HCI0
12
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
1. Conceptualizing Interaction and models
77
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.
78
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
79
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
80
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.”
81
Activity
How will enabling robot waiters to speak to customers enhance their
experience?
Source: Xinhua, Guo Cheng
82
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.”
83
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?
84
Activity
• What were the assumptions and claims made about watching 3D TV?
Source: Andrey Popov, Shutterstock
85
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
86
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
87
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
88
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
89
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
90
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
91
2. Interface Metaphors
92
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
93
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
94
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
95
3. Interaction types
96
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
97
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
98
Example
Which is easiest and why?
99
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
10
0
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
10
1
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)
10
2
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
10
3
Direct Manipulation
Pros
• Helpful for novices
• Experienced users can work
extremely rapidly to carry out a
wide range of tasks−even
defining new functions
• Intermittent users can retain
operational concepts over time
• Error messages rarely needed
• Users gain confidence and
mastery and feel in control
Cons
• the metaphor of direct
manipulation can be
considered too literally
• Not all tasks can be
described by objects,
• Some tasks are better
achieved through delegating
– spell checking
• Can cover screen space
• Moving a cursor using a
mouse or touchpad can be
slower
10
4
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
10
5
Seeing things larger than life in VR
Cyber-Insects in the CAVE
Source: Alexei A. Sharov
10
6
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
10
7
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
10
8
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
10
9
4. Paradigms, Visions, Theories, Models, and Frameworks
11
0
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)
11
1
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
11
2
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
11
3
summary
Understanding the problem space,
Being clear about your assumptions
and claims, Specifying how the
proposed design will support users
A conceptual model is a high-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
1
Contents
1. Introduction
2. What Is Cognition?
3. Cognitive Processes
4. Cognitive Frameworks
1
1
Weekly Learning Outcomes
1. Explain the different aspects of cognition and it’s
importance for interaction design
2. Show the difference between various cognitive
frameworks that have been applied to HCI and explain
what mental models are.
1
1
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: Chapter 4 Page 101 to 123
Recommended Reading
EYSENCK, M. and BRYSBAERT, M. (2018) Fundamentals of Cognition (3rd
ed.). Rout-ledge.
https://scholar.google.com/scholar?q=EYSENCK,+M.+and+BRYSBAERT,+M.+(
2018)+Fundamentals+of+Cognition+(3rd+ed.).+Rout+ledge.&hl=en&as_sdt=0&as_vis=1&oi=scholart
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
1. Introduction
11
9
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
12
0
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
12
1
2. What is cognition?
12
2
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
12
3
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
12
4
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
12
5
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
12
6
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?
12
7
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:
12
8
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)
12
9
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
13
0
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
13
1
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
13
2
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
13
3
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
13
4
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
13
5
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
13
6
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
13
7
3. Cognitive Frameworks
13
8
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
13
9
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
14
0
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.
14
1
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
14
2
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
14
3
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
14
4
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
14
5
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
14
6
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
4
Contents
1. Being Social and remote conversations
2. Social Engagement
3. Emotions and the User Experience
4. Persuasive Technologies and Behavioral Change
5. Anthropomorphism
1
4
Weekly Learning Outcomes
1. Explain social interaction and describe the social
mechanisms that people use to communicate and
collaborate.
2. Discuss the use of social media for keeping in touch,
making contacts, and managing our social and working
lives.
3. Explain the relation of emotions with behavior and the
user experience and describe the effect of technologies
on people’s behavior.
5
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: Chapter 5 and 6 Page 135 to
187
Recommended Reading
TURKLE, S. (2016) Reclaiming Conversation: The Power of Talk in a Digital
Age.
https://www.penguinrandomhouse.com/books/313732/reclaiming-conversationby-sherry-turkle/
HÖÖK, K. (2018) Designing with the Body. MIT.
https://mitpress.mit.edu/books/designing-body
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
Chapter 5: Social Interaction
1
5
1. Being Social and remote conversations
1
5
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?
15
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)
15
6
online conversations
• Do the same conversational rules apply?
• How do people repair them for:
▪ Email?
▪ Instant messaging?
▪ Texting?
▪ Skype or other videoconferencing software?
15
7
online conversations
VideoWindow system (Bellcore, 1989)
videophone from the 1960s
15
8
Videoconferencing and telepresence rooms
• Many to choose from to connect multiple people (for instance, Zoom)
• Customized telepresence rooms for groups
15
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)
16
0
2. Social Engagement
16
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
16
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
16
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
Human Computer Interaction
Module 5
Social and Emotional Interaction
1
6
Contents
1. Being Social and remote conversations
2. Social Engagement
3. Emotions and the User Experience
4. Persuasive Technologies and Behavioral Change
5. Anthropomorphism
1
6
Weekly Learning Outcomes
1. Explain social interaction and describe the social
mechanisms that people use to communicate and
collaborate.
2. Discuss the use of social media for keeping in touch,
making contacts, and managing our social and working
lives.
3. Explain the relation of emotions with behavior and the
user experience and describe the effect of technologies
on people’s behavior.
5
Required Reading
1. Interaction Design: Beyond Human-Computer
Interaction, 5th Edition: Chapter 5 and 6 Page 135 to
187
Recommended Reading
TURKLE, S. (2016) Reclaiming Conversation: The Power of Talk in a Digital
Age.
https://www.penguinrandomhouse.com/books/313732/reclaiming-conversationby-sherry-turkle/
HÖÖK, K. (2018) Designing with the Body. MIT.
https://mitpress.mit.edu/books/designing-body
6
This Presentation is mainly dependent on the textbook: Interaction Design: Beyond Human-Computer Interaction, 5th Edition
Chapter 6: Emotional Interaction
16
9
3. Emotions and the User Experience
17
0
Emotions and the user experience
• Emotional interaction is concerned with how we feel and react when
interacting with technologies
• HCI has traditionally been about designing efficient and effective
systems
• Now more about how to design interactive systems that make people
respond in certain ways
▪ For example, to be happy, to be trusting, to learn, or to be motivated
17
1
Simple feedback obtaining method and emotive
messages
17
2
Design an interface for feelings
• Can an interface be designed to improve how we feel?
• Our moods and feelings are continuously changing
▪ How does the interface keep track and know when to do something?
• Matching of moods and interfaces
• happy, angry, sad, bored, or focused?
• Emotional Intelligence
▪ understand relationship between facial expressions, body language, gestures,
and tone of voice.
▪ How do people change their body posture when they are happy or angry
17
3
Claims from model
Our emotional state changes how we think
• When frightened or angry,
• we focus narrowly and our bodies respond by tensing muscles and sweating
• More likely to be less tolerant
• When happy, we are less focused and our bodies relax
• Overlooking minor problems and be more creative
• When someone is in a good mood, it is thought to help them make decisions more
quickly
• When angry
• Some are able to turn their nervous state to their advantage, using the increase in
adrenalin to help them focus on their performance. Others are only too glad when
the performance is over and they can relax again.
17
4
Three levels of design in mind
• Visceral design
• At the lowest level are parts of the brain that are
prewired to respond automatically to events
happening in the physical world
• Refers to making products look, feel, and sound
good
• Behavioral design
• The behavioral level is where most human activities occur. Examples include well-learned
routine operations such as talking, typing, and swimming
• Is about use, and it equates with traditional values of usability
• Reflective design
• Is about considering the meaning and personal value of a product
17
5
Expressive and appearance of interfaces
• Both informative and fun
• Color, icons, sounds, graphical elements, and animations are used to
make the ‘look and feel’ of an interface appealing
▪ Conveys an emotional state
• In turn, this can affect the usability of an interface
▪ People are prepared to put up with certain aspects of an interface (for instance, slow
download rate) if the end result is appealing and aesthetic
a) Emotional icons were used in the 1980s
b) computers use more impersonal
17
6
Compare the design of thermostats
(a)The Nest thermostat has a
minimalist and aestheticallypleasing design
• Round face and simple dial
• Large font and numbers
(b)It is very different from
earlier thermostat designs
• Utilitarian and dull
17
7
Microsoft’s Clippy and IKEA’s Anna
• Clippy was disliked
by so many?
▪ Was it annoying,
distracting,
patronizing, or other?
• Anna appeared as a
virtual agent
▪ Blinked, moved her lips
and head to suggest
facial expressions
17
8
Frustrating interfaces
Many causes:
▪ application doesn’t work properly or crashes
▪ system doesn’t do what it is intended to do and users’ expectations are not met
▪ system does not provide sufficient information
▪ vague, obtuse, or condemning error messages
▪ Appearance of the interface is garish, noisy, gimmicky, or patronizing
▪ a system requires users to carry out too many steps to perform a task
17
9
Recommendations for Error messages
“The application Word Wonder has unexpectedly quit due to a type 2 error.”
“The application has expectedly quit due to poor coding in the operating system”
Shneiderman’s classic guidelines for error messages include:
• Avoid using terms like FATAL, INVALID, or BAD
• Audio warnings
• Avoid UPPERCASE and long code numbers
• Messages should be precise rather than vague
• Provide context-sensitive help
18
0
404 error message
The number 404 comes from the HTML language. The first 4
indicates a client error. The server is telling the user that they
have done something wrong, such as misspelling the URL or
requesting a page that no longer exists
A friendly cute image instead of the
impersonal 404 error message
18
1
Affective Computing and Emotional AI
• Affective computing
• how to use computers to recognize and express emotions as humans do
(Picard, 1998)
• Designing ways for people to communicate their emotional state
• It uses sensing technologies to measure GSR, facial expressions, gestures,
and body movement
• Emotional AI
• aims to automate the measurement of feelings and behavior using AI to
infer them from facial expressions and voice
• The goal is to predict user’s emotions and aspects of their behavior
18
2
4. Persuasive Technologies and Behavioral Change
18
3
Techniques used
• Cameras
• Six core expressions
typically measured:
• Biosensors
• Sadness, disgust,
fear, anger,
contempt, and joy
• for measuring facial expressions
• placed on fingers or palms to measure GSR
• Affective expression in speech
• for example, intonation, pitch, and loudness
• Using accelerometers and motion capture
systems
• Body movement and gestures
18
4
Emotional data analysis
• If user screws up their face when an ad pops up
• If user starts smiling
• Website can adapt its ad, movie storyline, or content to match
user’s emotional state
• If system used in a car, it might detect an angry driver and suggest
they take a deep breath
• Eye-tracking, finger pulse, speech, and words/phrases also analyzed
when tweeting or posting to Facebook
• Nintendo’s Pocket Pikachu
• Designed to motivate children to be more physically active on a regular
basis
18
5
5. Anthropomorphism
18
6
Anthropomorphism
• Attributing human-like qualities to inanimate objects
• Well known phenomenon in advertising
▪ Dancing butter, drinks, and breakfast cereals
• Much exploited in human-computer interaction
▪ Make user experience enjoyable and motivating
▪ Make people feel at ease by reducing anxiety
• Furnishing technologies with personalities can make them enjoyable
to interact with
18
7
Which do you prefer?
Feedback when user gets something wrong:
1. “Now Chris, that’s not right. You can do better than that. Try
again.”
2. “Incorrect. Try again.”
Is there a difference as to what you prefer depending on type of
message? Why?
18
8
Robot-like or cuddly?
Aibo
The Haptic Creature
18
9
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
Thank You
42
College of Computing and Informatics
Assignment 1
Deadline: Thursday 01/10/2023 @ 23:59
[Total Mark for this Assignment is 8]
Student Details:
Name: ###
ID: ###
CRN: ###
Instructions:
• You must submit two separate copies (one Word file and one PDF file) using the Assignment Template on
Blackboard via the allocated folder. These files must not be in compressed format.
• It is your responsibility to check and make sure that you have uploaded both the correct files.
• Zero mark will be given if you try to bypass the SafeAssign (e.g., misspell words, remove spaces between
words, hide characters, use different character sets, convert text into image or languages other than English
or any kind of manipulation).
• Email submission will not be accepted.
• You are advised to make your work clear and well-presented. This includes filling your information on the cover
page.
• You must use this template, failing which will result in zero mark.
• You MUST show all your work, and text must not be converted into an image, unless specified otherwise by
the question.
• Late submission will result in ZERO mark.
• The work should be your own, copying from students or other resources will result in ZERO mark.
• Use Times New Roman font for all your answers.
Question One
Pg. 01
Learning
Outcome(s):
Define interaction
design process,
and describe
different type of
models, theories,
and frameworks
for
conceptualizing
interaction.
Question One
2 Marks
Find an everyday handheld device, for example, a remote control, digital
camera, or smartphone and examine how it has been designed, paying
particular attention to how the user is meant to interact with it.
a. From your first impressions, write down what is good and bad about the
way the device works. (0.5 Marks)
b. Discuss some of the core micro-interactions that are supported by it. Are
they pleasurable, easy, and obvious? (0.5 Marks)
c. Finally, discuss possible improvements to the interface based on the
answers given for A and B (1 Marks)
Question Two
Pg. 02
Learning
Outcome(s):
Define interaction
design process,
and describe
different type of
models, theories,
and frameworks
for
conceptualizing
interaction.
Question Two
2 Marks
Assume that, you have been hired as an interaction designer for a new smart
home device called “EcoThermostat” that claims to regulate home temperature
while also being environmentally friendly. Use the principles of a user-centered
approach to address the following:
a. Identify at least three different potential user groups for the
EcoThermostat. (0.5 Marks)
b. Develop a hypothetical scenario in which a user interacts with the
EcoThermostat. Describe what aspects of the user’s reactions and
performance you would want to observe and record. (0.5 Marks)
c. Based on your above scenario, identify two potential problems users
might encounter when using the EcoThermostat. (0.5 Marks)
d. Describe how you would address these problems in the design. (0.5
Marks)
Note: Remember to provide justifications for your responses, drawing from the
principles of a user-centered approach as discussed in the course.
Question Three
Pg. 03
Learning
Outcome(s):
Explain cognitive,
social, and
emotional aspects
of different types
of user interfaces
Question Three
2 Marks
Compare the following:
“A traditional landline telephone and a modern smartphone messaging app.”
a. From your observations, discuss any elements in the smartphone
messaging app’s conceptual model that might be confusing or
counterintuitive for users familiar with the traditional landline telephone.
(1 Marks)
b. Analyze any three pros and cons of each communication tool’s design,
especially in relation to their conceptual models and interface metaphors.
(1 Marks)
Note: Remember to provide justifications for your responses, drawing from the
principles of a user-centered approach as discussed in the course.
Question Four
Pg. 04
Learning
Outcome(s):
Explain cognitive,
social, and
emotional aspects
of different types
of user interfaces
Question Four
2 Marks
Choose a technological product (e.g., a smartphone, a smart home device, a
wearable, or any software application) that you frequently use.
a. Discuss the importance of these cognitive aspects in the design of the
chosen product’s user interface. (0.5 Marks)
b. Identify and briefly describe two different cognitive frameworks that could
be applied to Human-Computer Interaction (HCI). (1 Marks)
c. Explain what a mental model is in the context of HCI. (0.5 Marks)
Note: Remember to provide justifications for your responses, drawing from the
Cognitive Aspects concepts discussed in the course.
