MODULE 1

OVERVIEW OF INTERACTION DESIGN

HCI 102 (HUMAN-COMPUTER INTERACTION 2)

Prepared by: ADOPTED BY: FRANCIS TUCAY Subject Instructor

INTERACTION DESIGN

GOOD AND POOR DESIGN

• A central concern of interaction design is to develop interactive products that are usable.
• Identifying the specific weaknesses and strengths of different interactive products.

WHAT TO DESIGN

• Designing interactive products requires considering who is going to be using them, how
they are going to be used, and where they are going to be used.
• Understand the kind of activities people are doing when interacting with these products.

Need to take into account:

1. Who the users are.

2. What activities are being carried out.
3. Where the interaction is taking place.
4. Need to optimize the interactions users have with a product.
5. Such that they match the users' activities and needs.

THE COMPONENTS OF INTERACTION DESIGN

• Relationship among contributing academic disciplines, design practices, and

interdisciplinary fields concerned with interaction design.
• Differences: Methods, philosophies, and lenses they use to study, analyze, and design
products.

5 DIMENSIONS OF INTERACTION DESIGN

1. Words - Should be meaningful and simple to understand.

2. Visual representations - Graphical elements like images, typography, and icons.
3. Physical objects or space - The space where users interact with the product.
4. Time - Refers to media that changes with time (animation, videos, sounds).
5. Behavior - The mechanism of a product and user interactions.

IMPORTANT QUESTIONS INTERACTION DESIGNERS ASK

 • What can a user do with their mouse, finger, or stylus to directly interact with the
interface?
• What about the appearance (color, shape, size, etc.) gives the user a clue about how it
may function?
• Do error messages provide a way for the user to correct the problem or explain why the
error occurred?
• What feedback does a user get once an action is performed?
• Are the interface elements a reasonable size to interact with?

THE USER EXPERIENCE

• User experience refers to how a product behaves and is used by people in the real world.
• Jakob Nielsen and Don Norman define it as encompassing "all aspects of the end-user’s
interaction with the company, its services, and its products."
• Designers sometimes refer to UX as UXD, which focuses on the quality of user
experience.

UNDERSTANDING USERS

• Collaborative planning tools differ based on user needs.

• Understanding individual differences helps designers appreciate that one size does not fit
all.
• Learning more about people reveals incorrect assumptions about user needs.
• Cultural differences play an important role in interaction design.

ACCESSIBILITY AND INCLUSIVENESS

• Accessibility refers to the extent to which an interactive product is accessible to as many

people as possible.
• Inclusiveness means being fair, open, and equal to everyone.
• Accessibility can be achieved through inclusive design and assistive technology.
• Examples: JABtalk for non-verbal communication, Apple Voice Over, Android screen
reader tools.

TYPES OF IMPAIRMENTS

• Sensory impairment (e.g., loss of vision or hearing)

• Physical impairment (e.g., loss of function in body parts)
• Cognitive impairment (e.g., memory loss, learning disabilities)

USABILITY AND USER EXPERIENCE GOALS

• Usability ensures that interactive products are easy to learn, effective to use, and
enjoyable.
• 6 Usability Goals:
1. Effective to use (effectiveness)
 2. Efficient to use (efficiency)
3. Safe to use (safety)
4. Having good utility (utility)
5. Easy to learn (learnability)
6. Easy to remember how to use (memorability)

User Experience Goals:

• Covers a range of emotions and experiences.

DESIGN PRINCIPLES

• Visibility: Users should be able to know what to do next.

• Feedback: Users should receive clear responses to their actions.
• Constraints: Restricting interactions to prevent errors.
• Consistency: Using similar operations and elements across interfaces.
• Affordance: Giving clues to users on how to interact with objects.

APPLYING DESIGN PRINCIPLES IN PRACTICE

• Applying multiple design principles may create trade-offs.

• Example: More constraints can reduce visibility.
• Aesthetic designs may impact usability.

SUMMARY

• Interaction design focuses on creating interactive products that support communication

and interaction.
• It is multidisciplinary and considers various usability and experience goals.
• Design principles like feedback, visibility, and consistency help improve user experience.

END OF MODULE 1
MODULE 2

THE PROCESS OF INTERACTION DESIGN

HCI 102 - Human Computer Interaction 2

Adapted by: FPT Subject Instructor

OVERVIEW

• Importance of involving users

• Degrees of user involvement
• User-centered approach
• Four basic activities
• Practical issues in design

THE PROCESS OF INTERACTION DESIGN

• Interaction design focuses on users and their goals.

• The Double-Diamond Design Process:
1. Discover: Gather insights about the problem.
2. Define: Develop a clear brief.
3. Develop: Create, prototype, test, and iterate solutions.
4. Deliver: Finalize and launch the product.

INVOLVING USERS

• Co-creation – A people-centered approach to design and development.

• Ensures usability and increases the likelihood of adoption.
• Expectation management and ownership are key factors.

DEGREES OF USER INVOLVEMENT

• Member of the design team (full-time, part-time, short-term, long-term involvement).

• Newsletters and dissemination tools to engage a wider audience.
• A combination of approaches is often necessary.

USER-CENTERED APPROACH

• Directly studying cognitive, behavioral, anthropomorphic, and attitudinal characteristics.

• Observing user performance, reactions, and behaviors with scenarios, prototypes, and
simulations.
• Iterative design: Fix issues based on user testing and repeat evaluations.
• Empirical measurement: Evaluate usability throughout the process.

FOUR BASIC ACTIVITIES OF INTERACTION DESIGN

 1. Discovering requirements – Understanding users, their needs, and defining what will be
developed.
2. Designing alternatives – Conceptual design (creating a mental model) and concrete
design (detailed UI elements like colors, icons, and layout).
3. Prototyping – Creating interactive models to test behavior and user interaction.
4. Evaluating – Assessing usability, acceptability, and user experience through testing.

PRACTICAL ISSUES IN INTERACTION DESIGN

• Who are the users? Identifying stakeholders (primary, secondary, tertiary users).
• Understanding user needs: Analyzing tasks, behaviors, and information flow.
• Generating alternatives: Exploring multiple design solutions.
• Choosing among alternatives: Evaluation through user testing, technical feasibility, and
usability criteria.
• Integrating interaction design into development models: Combining with agile
methodologies (Scrum, Kanban, XP, etc.).

SUMMARY

• Different design disciplines follow various approaches but share commonalities in the
Double-Diamond model.
• Understanding the problem space is crucial before creating solutions.
• The four key interaction design activities (discover, design, prototype, evaluate) guide the
process.
• User-centered design emphasizes early user involvement, empirical testing, and iterative
refinement.
• Involving users ensures usability, proper expectation management, and user ownership.
• Exploring multiple design alternatives and seeking inspiration enhances creativity.
• Evaluating designs through usability testing, prototyping, and technical feasibility helps
refine solutions.
• Interaction design is increasingly integrated with software development lifecycle models.
Emotional Interaction Reviewer

Module 4: Emotional Interaction

Topics Covered:

• Emotions and the User Experience

• Expressive Interfaces and Emotional Design
• Annoying Interfaces
• Affective Computing and Emotional AI
• Persuasive Technologies and Behavioral Change
• Anthropomorphism

Emotions and the User Experience

• HCI focuses on designing systems that influence emotions.

• Emotional interaction studies user responses to technology.
• Examples include frustration with slow interfaces or joy from smooth experiences.

Emotional Design Model

• Explores how users' emotions impact their perception of interfaces.

• Emotional attachment to products like virtual pets is common.

Expressive Interfaces and Emotional Design

• Interfaces provide feedback through colors, icons, sounds, and animations.

• Can enhance usability but may also be intrusive and frustrating.
• Users tolerate minor inconveniences if the interface is aesthetically pleasing.

User Experience (UX) and Usability

• Emotional design impacts overall usability and user satisfaction.

Annoying Interfaces

• Negative emotional responses arise from:

o System crashes and unresponsiveness.
o Confusing error messages and excessive steps to complete tasks.
o Overloaded interfaces with excessive animations, pop-ups, and sounds.
 o Poorly designed input devices leading to frequent user mistakes.

Affective Computing and Emotional AI

• Affective computing aims to make computers recognize and express emotions.

• Methods include:
o Facial expression analysis.
o Biosensors detecting anxiety or stress.
o Speech and voice quality analysis.
o Body movement tracking with motion sensors.

Facial Coding

• Measures emotions using webcam images.

• Tracks expressions of anger, joy, sadness, fear, disgust, and contempt.
• Helps personalize digital content based on user reactions.

Persuasive Technologies and Behavioral Change

• Designed to influence user attitudes and actions (Fogg, 2003).

• Examples include:
o Pop-up ads, reminders, and personalized messages.
o Amazon 1-click, fitness tracking apps, and nudging techniques.

Examples of Persuasive Technologies

• Nintendo’s Pocket Pikachu: Encourages physical activity through virtual pet

interaction.
• Tracking Devices: Apps that monitor habits (e.g., fitness, sleep) and encourage
improvement.

Anthropomorphism

• Assigning human traits to objects (e.g., talking cars, animated characters).

• Used in advertising and interaction design to enhance engagement.
• Social robots are employed for emotional support and companionship.

Criticism of Anthropomorphism

• Can be deceptive or create anxiety.

 • Some users dislike overly friendly virtual assistants.
• Personalized feedback may feel insincere.

Virtual Agents

• Used in sales, video games, learning tools, and customer support.

• Can create a sense of involvement but may also mislead users.
• Believability depends on:
o Appearance (cartoon-like vs. realistic characters).
o Behavior (expressions, gestures, and interaction style).

Key Takeaways

• Emotional interaction is crucial in HCI to enhance user experience.

• Well-designed interfaces evoke positive emotions, while poor design leads to frustration.
• Affective computing helps systems respond to user emotions.
• Persuasive technologies shape user behavior through subtle nudges.
• Anthropomorphism and virtual agents play roles in making digital interactions engaging
but must be designed responsibly.