Chapter 5 – Affective Aspects
Ben Coulston, Lauren Goff, Shanee
Dawkins, Jarrett Chapman
Goal: design systems that elicits a
positive response from users
 Feeling at ease / comfortable
 Avoiding frustration
Examples of designs that may elicit
negative responses from users:
Examples of designs that may elicit
negative responses from users:
Other positive user responses include
motivation to learn, be creative, or be
social
 Chat client example 1
Other positive user responses include
motivation to learn, be creative, or be
social
 Chat client example 2
Other positive user responses include
motivation to learn, be creative, or be
social
We may also want to elicit feelings of
security or a perception of authority:
Affective: generation of an emotional
response
 How can systems be designed to provoke
emotions?
 Reproducing environmental stimuli that
naturally elicit affect
MIT’s COG
MIT’s Kismet
Expressive Interfaces
 Convey Emotional
States
 Elicit Emotional
User Responses
Expressive Interfaces
System Status Indicators
 Dynamic Icons
Recycle bin expanding
 Animations
Swirling beach ball
 Spoken Messages
“You’ve Got Mail”
 Action & Event Sonifications
AIM door open / close
Expressive Interfaces
 Advantages
 Disadvantages
 Reassuring Feedback
 Intrusive
 Informative
 Annoying
 Fun
 Anger
Positive Emotions
 Emoticons
 Smile
:)
 Frown
:(
 Wink
;)
 Stick out Tongue :P
• 3D & Animated
Emoticons
Positive Affectiveness
Imagery affects Experience
 Engaging
 Enjoyable
Aesthetics affect Usability Perception
 Graphics
 Fonts
 Color
 Images
Frustrating Interfaces
Inadvertently elicit negative responses
 Expect Simplicity – Get Complexity
Attempted Solution
 Companions for Novices
Cute Bunny = Comfortable Environment?
Microsoft Office “Clippy”
 Intrusive & Distracting
Frustrating Interfaces
Causes
 Application Crash
 System Performance Differs from User
Intentions
 System does not Meet Expectations
 Lack of System Instructions
 Vague Error Messages
 Annoying Interface
Cluttered, Gimmicky, Garish, Patronizing
Gimmicks
Waiting
Load Flash Websites
Hanging Links
Software Upgrade
Time consuming
Too many tasks
 Reset preferences
 Extensions
 Configurations
Lost Settings
“This used to work!! :( “
Appearance
Overloaded websites
Flash banners & pop-ups
Sound effects & music
Excessive features & operations
Childish helper agents
Poor design
 Leads to common mistakes
Error Messages
One Line Messages
Lack of Indicators
 How to get more info
 How to correct problem
Threatening Messages
 User panic mode
Error Message Design
 “Fix It” Messages
 State Cause &
Solution
 Guidelines
 Courteous Solutions
 Avoid
Fatal, Error,
Invalid, Bad,
Illegal
 Exclude Lengthy
Error Codes
 Guidelines (cont’d)
 User Controlled
Audio Warnings
 Precise
 Include Help Icon
Context sensitive
help
 Short Messages
Long Explanations
Persuasive Technologies
 Attention Getters
 Pop ups, warning messages, reminders,
etc.
 Uses of Persuasive Technology
 Commercial
 Splash Pages, Recommender Systems
 Non-commercial
 Pocket Pikachu, WaterBot, Cigarette
Counter
Anthropomorphism in ID
 What is anthropomorphism?
 Propensity people have to attribute
human qualities to objects.
 Examples:
 Gaming industry – Super Mario, Sonic
the Hedgehog, etc.
 Toys – Baby dolls
 Search engines – Jeeves
Cons to Anthropomorphism
 Can lead to a false sense of belief
 “Software bots” pretending to be
conversant human beings
 Can stifle creativity in children
 Annoying – biggest complaint
 E-Commerce sites
Interface Agents, Virtual Pets,
and Interactive Toys
 Anthropomorphization of the user
interface
Alice Bot
http://www.pandorabots.com/pandora/talk?botid=f5d922d97e345aa1
Examples
 Web search agents
 E-commerce
assistants
 Electronic learning
companions
 Video game
characters
 Virtual Pets
Designing the
Interface with Agents
 Recognizing and responding to verbal
and non-verbal input
 Generating verbal and non-verbal
output
 Conversing: dealing with turn-taking,
breakdowns, etc.
 New dialogue and signals for current
state of conversation.
 Ex. Rea, a life-like realtor
Models of Affective Aspects
 Emotional design model
 Pleasure Model
 Technology as experience framework
Emotional Design Model
 Visceral
 Behavioral
Reflective
control
Sensory
Behavioral
control
Visceral
 Contemplative
Motor
Pleasure Model
 Physio-pleasure
 Socio-pleasure
 Psycho-pleasure
 Ideo-pleasure (cognitive)
Technology as
Experience Framework
 Sensual thread
 Emotional thread
 Compositional thread
 Spatio-temporal thread