Designing with Psychology in Mind 5 principles from psychology that we can use to inform web design

@bokardo

Kurt Lewin “Founder of Social Psychology”

B=⨍(PE) Lewin’s Equation

B=⨍(PE) Behavior is a function of a Person & their Environment

We can’t change the Person

B=⨍(PE) But we can change Behavior by designing the Environment Ahem...that’s our job.

When we as web designers create screens we are defining the universe for our users. We are crafting an environment through which all activity occurs. This is a huge responsibility! If something doesn’t exist in the interface, it doesn’t exist period. In this way we are playing God...

The Stanford Prison Experiment

http://www.youtube.com/watch?v=RKW_MzREPp4

The Lucifer Effect raises a fundamental question about human nature: How is it possible for ordinary, average, even good people to become perpetrators of evil? In trying to understand unusual, or aberrant behavior, we often err in focusing exclusively on the inner determinants of genes, personality, and character, as we also tend to ignore what may be the critical catalyst for behavior change in the external Situation or in the System that creates and maintains such situations. (aka the Fundamental Attribution Error)

Behavior change: Change people from offline shoppers to online buyers

Behavior change: Change people from prospective to happy clients

Behavior change: Change people from readers to subscribers

What do web designers do?

observe record influence respond to induce guide Web designers change behavior monitor elicit support enable manipulate encourage

Changing behavior is what web designers do.

Changing behavior is what psychologists study.

“

The emergence of the Internet has led to a proliferation of Web sites designed to persuade or motivate people to change their attitudes and behavior. Web sites are the most common form of persuasive technology today. B.J. Fogg - Persuasive Technology

PDAs

motivation

web sites video games

attitude change

mobile phones desktop software

Captology

change in worldview

smart environments exercise equipment

behavior change

virtual reality kiosks

Computers

compliance

Persuasion

One more for the pile... Psychologist

Information Architect

Coder

Usability Specialist

UX Designer

Visual Designer

Programmer Client Babysitter

Copywriter Icon Designer

Behavior First. Design Second.

Egocentric Worldview We can’t help but see ourselves at the center of it all.

“

There are more things in heaven and earth, Horatio, than are dreamt of in your philosophy. Shakespeare, Hamlet, Act I, Scene 5

Maslow’s

Hierarchy of Needs

Selfactualization

Esteem

Love

Safety

Physiological

The Del.icio.us Lesson Personal value precedes network value

Del.icio.us Popular

My Del.icio.us

(social value)

(personal value)

Even if the social value didn’t exist, Del.icio.us would still provide real, personal value

Awareness Test

http://www.youtube.com/watch?v=Ahg6qcgoay4

Single Locus of Attention We can actively think about only one thing at a time.

“

When you are awake and conscious, your locus of attention is a feature or object in the physical world or an idea about which you are intently and actively thinking. Jef Raskin - The Humane Interface

Obligatory Apple slide :)

Obligatory Apple slide :)

“

...you need to limit distractions to the full extent possible. Pull quotes—so effective near the top of an article— become a nuisance further down; many readers will find themselves unconsciously drawn to them, even when they want to focus on the text. Mandy Brown, describing how to keep the text as the locus of attention

1. Invite the reader in Summary, subheadings, illustrations, callouts, site logo, navigation

3 Distinct Phases

2. Leave the reader alone (nothing but text & inline content)

3. Provide avenues to continue interest Comments, learn more, about the author

Social Proof The mere fact that others are doing something is often enough for us to do it as well

Product Ratings Share your own Product Images People who viewed this...buy this

Tell a friend Amazon sales rank

Customers who bought this also bought...

Rate this item Customer Reviews

Customer Discussions Listmania

Social Proof at Amazon

Offsite Reviews

Social Influence & Blockbusters What should entertainment companies do to improve their odds of success? The key is to understand that the outsize performance of hits is not driven solely, or perhaps even primarily, by intrinsic attributes such as sound, plot, style, or even star power. Rather, (our) new research shows, much of the success of entertainment products derives from social influence–the effect that consumers have on one another’s decisions. So in addition to anticipating which features individual consumers might find desirable, executives designers should adopt strategies that take social influence into account. Duncan Watts & Steve Hasker Harvard Business Review, September 2006

Quick data point

After Rypple added avatars to emails, response rate improved between 15 and 20%.

Porter’s Law of Avatars

Avatars increase in size and realism over time.

Positive Reinforcement Immediate, positive feedback elicits similar behavior in the future.

Four behavioral consequences and their effects.

Get something you want

Positive Reinforcement

Avoid something you don’t want

Negative Reinforcement

Behavior Get something you don’t want Lose something you have

Punishment

Penalty

Super important!

The behavior you’re seeing is the behavior you’ve designed for. (whether intentional or not)

Tumblr: Initial login (before 1st post)

Tumblr: After 1st post

Tumblr: After 2nd post

Tumblr: After a few posts

Passionate Engagement We all know that money doesn’t make us happy... but can we design for what does?

flow the mental state of operation in which the person is fully immersed in what he or she is doing by a feeling of energized focus, full involvement, and success in the process of the activity also known as being “in the zone”, “in the groove”, or “fully engaged”

Conditions for Flow 1. Clear goals 2. Concentration & Focus 3. Loss of the feeling of self-conciousness 4. Distorted sense of time 5. Direct & Immediate feedback 6. A sense of control over the situation 7. Intrinsically rewarding 8. Action and awareness merge 9. Balance between ability level & challenge

“

One cannot enjoy doing the same thing at the same level for long. Mihaly Csikszentmihalyi - Flow, The Psychology of Optimal Experience

Very challenging

Anxiety

Flow Channel Challenges

Boredom

Social Networks Trivial Low

Skills

High

LinkedIn: No challenge!

Very challenging

Anxiety

Productivity Apps

Flow Channel Challenges

Boredom

Social Networks Trivial Low

Skills

High

Campaign Monitor: Improving Skills

Rypple: Improving Skills

“

The more knowledge and skill someone has, the more passionate they become, and the more passionate they become, the more they try to improve their knowledge and skills. Kathy Sierra - Creating Passionate Users

Wait. Isn’t this all a bit...evil?

“

So, when and how do we turn on the light to let the dogs drool? Brendan Thesingh, commenting on my blog

manipulate verb. to control or influence cleverly, unfairly, or unscrupulously.

Evolution of Facebook Beacon #1

#2

#3

#4

“

“We bear in mind that the object being worked on is going to be ridden in, sat upon, looked at, talked into, activated, operated, or in some other way used by people individually or en masse. When the point of contact between the product and the people becomes a point of friction, then the designer has failed. On the other hand if people are made safer, more comfortable, more eager to purchase, more efficient—or just plain happier—by contact with the product, then the designer has succeeded. Henry Dreyfuss - Designing for People

5 Principles

1. Egocentric worldview 2. Single locus of attention 3. Social Proof 4. Positive Reinforcement 5. Passionate Engagement (challenge + skill improvement)

Thank you.

[email protected] http://bokardo.com @bokardo