how to embed emotional design into a transactional website

51
. @UXforChangeUK #UX4G How to Embed Emotional Design into a Transactional Website Sandra Gonzalez UX & RP

Upload: ux-for-change

Post on 16-Aug-2015

110 views

Category:

Education


3 download

TRANSCRIPT

Page 1: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

How to Embed Emotional Design into a Transactional Website

Sandra GonzalezUX & RP

Page 2: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Revolution Something Lost and Something Found

Designing for Emotion By Aarron Walter

.

.

.

.

.

.

.

.

.

.

.

.

Page 3: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Revolution Something Lost and Something Found

“As the machine found its place in our world, the human hand’s presence in everyday objects

slowly faded. “Aaron Walter

Designing for Emotion by Aarron Walter

Page 4: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Page 5: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Revolution Something Lost and Something Found

“We could reduce our industry to a commodities race, like those who manufactured the industrial

revolution.“Aaron Walter

Designing for Emotion by Aarron Walter

Page 6: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Revolution Something Lost and Something Found

“Or we could follow a different path, one paved by the artists, designers, and architects of the Arts and Crafts movement, who believed that

preserving the human touch and showing ourselves in our work isn’t optional. It’s

essential. “Aaron Walter

Designing for Emotion by Aarron Walter

Page 7: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

What is Emotional Design?

“Emotional design…uses psychology and craftsmanship to create an experience for users that makes them feel like there’s a person, not a machine, at the other end of the connection. “

Aaron Walter

Designing for Emotion by Aarron Walter

Page 8: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

What is the fastest growing language in the UK?

Page 9: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Emoji is the fastest growing language

Study done by Professor Vyv Evans, from Bangor University

Page 10: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Human Needs“No matter our age, gender, race, or station in life, we all have basic needs that must be met.“

Abraham Maslow

Designing for Emotion by Aarron Walter

Page 11: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Users Needs“What if we translated Maslow’s model of human needs into the needs of our users? It might look something like this.“

Aaron WalterDesigning for Emotion by Aarron Walter

Page 12: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

by Aaron Walter

Designing for Emotion by Aarron Walter

Page 13: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Page 14: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Pleasurable Experiences

“Why do we settle for usable when we can make interfaces both usable and pleasurable?“

Aaron Walter

Designing for Emotion by Aarron Walter

Page 15: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

THREE PRINCIPLES OFEMOTIONAL DESIGN

Page 16: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

LET YOUR BRAND PERSONALITY SHOWPrinciple #1

Page 17: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Let Your Brand Personality Show

“Emotional design turns casual users into fanatics ready to tell others about their positive

experience.“Aaron Walter

Designing for Emotion by Aarron Walter

Page 18: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

BABY-FACE BIAS Principle #2

Page 19: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

“Evolution has given us baby goggles that help us look past such shortcomings and trigger waves of positive emotions when we see a little one’s face. “

Aaron Walter

Jeff Atwood

Designing for Emotion by Aarron Walter

Page 20: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 21: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

THE WORLD IS OUR MIRRORPrinciple #3

Page 22: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Have anyone seen Donald in Mathmagic Land?

https://youtu.be/AJgkaU08VvY?t=7m

Page 23: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 24: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

PERSONALITY

Chapter available on A List Apart

.

.

.

.

.

.

.

.

.

.

.

.

http://alistapart.com/article/personality-in-design

Page 25: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Page 26: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

PERSONALITY

“Emotional design’s primary goal is to facilitate human-to-human communication. “

Aaron Walter

Designing for Emotion by Aarron Walter

Page 27: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 28: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Page 29: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 30: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 31: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

STRATEGIES FOR IMPLEMENTINGEMOTIONAL DESIGN

Page 32: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

SURPRISESTRATEGY #1

Page 33: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 34: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 35: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

ATICIPATIONSTRATEGY #2

Page 36: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Page 37: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

PRIMESTRATEGY #3

Page 38: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Page 39: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 40: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 41: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 42: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

IS BETTER TO ASK FORGIVENESS…

Page 43: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 44: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 45: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

HOW TO EMBED EMOTIONAL DESIGN INTO A TRANSACTIONAL WEBSITE?

Page 46: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 47: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 48: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 49: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 50: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Designing for Emotion by Aarron Walter

Page 51: How to Embed Emotional Design into a Transactional Website

.

@UXforChangeUK #UX4G

Thanks for your time

.

.

.

.

.

.

.

.

.

.

.

.