The Psychology Behind Emotional Design and IA

Seattle Information Architecture & UX Meetup

alterspark.comBrian Cugelman, PhD

Who’s this guy?Brian Cugelman, PhD

Specialist in online behavior change and data scienceEnjoys training, research, consulting and teaching

Runs AlterSpark, data science and digital psychologySerious geek

3

Schemas of space and information architecture

How is it, that people can understand information architectures

4

Danaher B.G., McKay, H.G., The Information Architecture of Behavior Change Websites. J Med Internet Res 2005;7(2): e12. URL: http://www.jmir.org/2005/2/e12/

HierarchicalMatrix

HybridTunnel

Ever wondered about the language of information architecture

5

You’re “on” this page

You’re “in” this page

You’re “at” this page

How about processes

6

<< Backward Forward >>

Clues to understanding comprehension, in the language of prepositions

7

In a survey of 53 languages Haspelmath found that all of them, without exception, employ spatial expressions for temporal notions.

On

Under BehindIn front

Next to

Time is space metaphor (schema)

8

Space (3 dimensions) Time (1 dimension)She’s at the corner She arrived at 1:30

Her book is on the table Her birthday is on Monday/October 6th

Her coat is in the closet She left in the morning/July/the summer/2003

She left her keys somewhere around her desk

She had dinner around 6:30

She planted flowers between the tree and the bush

She likes to run between 4:00 and 5:00

She ran through the forest She worked through the evening

She hung the chandelier over the table

She worked over 8 hours

She swept the crumbs under the rug She worked under 8 hours

She painted the picture in her studio She painted the picture in an hour

Kemmerer, David. "The spatial and temporal meanings of English prepositions can be independently impaired." Neuropsychologia 43.5 (2005): 797-806.

Can the time-is-space metaphor help us understand IA

9

Space Time IAShe’s at the corner She arrived at 1:30 ?

Her book is on the table Her birthday is on Monday/October 6th ?

Her coat is in the closet She left in the morning/July/the summer/2003

?

She left her keys somewhere around her desk

She had dinner around 6:30 ?

She planted flowers between the tree and the bush

She likes to run between 4:00 and 5:00 ?

She ran through the forest She worked through the evening ?

She hung the chandelier over the table

She worked over 8 hours ?

She swept the crumbs under the rug

She worked under 8 hours ?

She painted the picture in her studio

She painted the picture in an hour ?

How users understand special relationships:Egocentric V.s. Allocentric Spatial Processing

10

AllocentricEgocentric

Let’s borrow the language of space and time, to help users understand virtual space and processes

11

AfterDuring

<<<Previous

Prior

>>>NextFollowing

Starting Started Stopping StoppedProgressingAt this step

On this page

Before

12

Emotional design psychology and neuroscience

Evoking emotion to encourage target outcomes

Intended

Unintended

PositiveOutcome

NegativeOutcome

TARGET OUTCOMEThe outcome we are

trying to achieve.

DARK PATTERNPractices that are illegal, unethical or may be perceived as manipulation.

BACKFIRE RISKUnwanted outcomes, including the opposite behavior or other

negative consequences.

UNEXPECTED BENEFITSGood outcomes that

emerge by luck, but which are good accidents.

Stibe, A. & Cugelman, B. (2016, in press) Persuasive Backfiring: When Behavior Change Interventions Trigger Unintended Negative Outcomes. PERSUASIVE 2016, LNCS 9638, Springer International Publishing Switzerland 2016. pp. 1–13, 2016. DOI: 10.1007/978-3-319-31510-2_6

Different perspective on human behavior

Black box

Infer psychological

constructs

Input Output

PsychologyTell me the psychological constructs within the black-box, based on theories about what shapes behavior.

Black box

Ignore brain or mind

Inputs Output

Behavioral scienceShow me what has been empirically proven to shape behavior. But don’t tell me what you think is in the black box.

Grey box

Observe brain & biological

systems

Input Output

NeuroscienceShow me the neural structures, of the nervous system, that have some links to inputs and outputs. Show me the structure of the black box, even if it’s an incomplete map.

Where do we get our strategies to describe interactive design and UI

15

Psychological

Neurological

Behavioral science

Industry lingo

Anticipating reward Feeling confident Motivating goal

Boosting self-efficacy

Triggering the reward system No fight-or-flight reaction

Value prop Trust bling

The Emotion-Behavior Model

16

Anatomical sub-divisions of the brain and pop psychology

17

Forebrain

Midbrain

Hindbrain

Spinal cord

Embryonic vertebrate brain Adult human brain

Intellect

Emotion

Survival systems

Communication network

Several pop-psychologists describe neural processes through generalizations about the major brain divisions.

There’s some truth to these simplifications, but lots of distortion too.

We’ll introduce a model that describes the major neural processes relevant to emotion and behavior.

18Leonardo Restivo - hippocampal picture, in the Frankland Lab, Hospital for Sick Children

Let’s look at interactive design and marketing, from a neurological perspective

The Emotion-Behavior Model (simple linear version)By Cugelman and Restivo

19

Sense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Decision makingGlucose consumption

Trigger event

(external or internal)

FastEffortless and pre-conscious

Low glucose consumption

SlowRequires conscious effortHigh glucose consumption

Trigger events and sense perceptionSense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Sight

Hearing

Touch

Trigger events are perceived through our senses. People may have up to 20 senses.

Eyes will focus on the most prominent parts of the page

Perception, interpretation & association

21

Sense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Information is classified and compared with schemas

Schemas simplify the world, enabling us to deal with a vast amount of information, in a compact format

Without schemas, our senses would overload our consciousness with too much information

Prior associations with the schemas, prime users for their response

Schemas help users understand UI elements, shaping their UX

22

Concepts learned in one part of life…. …aids comprehension in another.

Emotional reaction

What is an emotion?

Sense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Emotional rewards and punishments

Kenrick, Douglas T., et al. "Renovating the pyramid of needs contemporary extensions built upon ancient foundations." Perspectives on psychological science 5.3 (2010): 292-314.

Loss aversion (-=)What we avoid

Incentives (+=)What we desire

Pleasurable opportunities

that I must pursue!

Painful threats that I must

avoid!

Biology of personality and motivating emotions

2525

Serotonin

Oxytocin

Endorphin

Vasopressin

Testosterone

Dopamine

Cortisol

Norepinephrine

Glucose

Prolactin

Each chemical impacts user emotion, cognition & behavior

Estrogen

Emotional reaction

Lally, P., Van Jaarsveld, C. H., et al. (2010). "How are habits formed: Modelling habit formation in the real world." European Journal of Social Psychology 40(6): 998-1009.

Walking for 10 minutes after breakfast

Habits (automaticity) forms in roughly 2-monthsIt takes from 18 to 254 days to form a new behavior to feels automatic, averaging 66 days.

Autom

aticity

Attempted behavior

Trigger(or conditioned

stimulus)Reinforcement

Days

Sense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Perception, interpretation & association

Change the schemas

Emotional reaction

If we can catch an emotion before it takes over, we can change its impact by changing the way we look at a situation.

If you can’t change a situation, you can change how you feel about it.

Cognitive appraisal

1. Act on the impulses without

awareness

2. Consciously reassess impulses

Sense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Decision making and neurochemistry

28

Serotonin

Dopamine

Cortisol

Threat (-)What we avoid

Opportunity (+)What we desire

Cognitive learning based on past positive outcomes

Emotional driver of behavior through anticipation of reward

Cognitive learning based on past negative outcomes

Cognitive learning of schema violations

Emotional inhibition of risky behavior

Emotional booster: amplifying fear of a threat

Emotional booster: amplifying fear of losing an opportunity

Emotional reaction

Glucose = fuel for cells

Sense perception

Schemas & Learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal & Cognition

Behavior (deliberate)

Glucose consumption

How to drain users’ glucose

Concentration

Logical reasoning

Effort in difficult tasks

Controlling emotions

Controlling salient emotions

which use more glucose (e.g.

fear of death)

Controlling what you say in

public

What interactive design practices can speed-up or

slow-down glucose depletion?

Emotional reaction

Final behavioral stage after:

• Experiencing the page

• Perceiving, interpreting, and

associating the page with past

experiences

• Reacting emotionally

• Consciously reassessing our

emotions or acting on them

Sense perception

Schemas, & learned

associationsEmotional reaction

Behavior (habitual)

Cognitive appraisal

Behavior (deliberate)

Triggering emotions

31

Hello

32

You look wonderful

today33

I’m so happy to see you

34

How do you feel about a slide deck that welcomes

and flatters you?

35

Oxytocin

Oxytocin

37

• How to trigger: Facial recognition, social bonds, interaction with others, physical touch

• Emotional impact: Feeling trust, friendly, connected, jealous, territorial, possessive

• Behavioral impact: Acting on trust, loyalty behavior, or distrust, jealousy and defensive hostility

BACKFIRE RISKThe pain of oxytocin is felt physically,

and may trigger jealousy, territorial behavior, and the pain of social loss.

Oxytocin and personality/emotional associations

Social perception• Empathy (Reading other people’s emotions)• Social memory of faces• Social memory of words

Relationships• Attachment• Attachment anxiety• Separation pain

Tribal behavior• In-group trust and cooperation• Out-group distrust and antagonism

Social comparison• Jealousy• Envy

38

Authenticity and Nielsen Norman Group’s eye tracking study

People Photos = Good (If They're Real People)

• Pictures that are ignored: Typically for big feel good types of images that are purely decorative

• Pictures that are scrutinized: Photos of real products and people (as opposed to stock photos of models)

39

Can your users spot an authentic smile in you images?

Source effect where the psychology of branding and human-computer-interaction merge

40

Social psychology applies to humans, brands and technology

Hypothesis: Oxytocin help explain the media equation phenomena

Users can interact with many types of sources

Companies Technology

People

Pets

BrandsEmbodied agent

41

Trigger oxytocin

Trigger oxytocin

Trigger oxytocinProposed

trigger oxytocin

Levels of brand humanization

42

Human brandHuman at forefront

Semi-human brandHuman & corporate paring

Non-human brandCorporate identity

Oxytocin’s impact on human-brand relationships

43

CommitmentIntimacySatisfactionSelf-connectionTrustLoyalty

Warm and sociable personalityLower autism quotient scoresOxytocin increases these brand traits

Scientists & engineering personalityHigher autism quotient scores Oxytocin decreases these brand traits

Fürst, Andreas, et al. (2015). The neuropeptide oxytocin modulates consumer brand relationships. Scientific reports 5

Oxytocin and brand relationships(high/low autism-spectrum quotient)

44

Fürst, A., Thron, J., Scheele, D., Marsh, N., & Hurlemann, R. (2015). The neuropeptide oxytocin modulates consumer brand relationships. Scientific reports, 5.

Mathematicians, scientists and engineers

45

AlterSpark and Kanetix study

Conversion pipelines in practice

Home page QuoterPg. x

QuoterPg. y

QuoterPg. z

Quote retrieval

Quote

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Ad

Flo from Progressive

Little Knight from BelairDirect

Source psychology strategies

Sociable

Confidence

Eye Contact

Directional Cues

Friendly and approachable

Expression of confidence. Flo with her hands on the hip. Little Knight with his shield/sword

Making eye contact to pull in users

Using body position or pointing at the Call To Action

Directing users to answer the question “What do I do next?” or “What is the main goal of this page”

Pronouns Lots of “you” and “we” language used to strengthen the

social bond

Positive Social Endorsement

s Brand mascots uses facial expressions and body

language to encourage and endorse user behavior. e.g. ok and thumbs up

Thanks so much

50

Stay in touch:

www.alterspark.combrian@alterspark.com(416) 858-2055