Every decision we make affects the way real people experience our products. We’ve all heard the rallying cry for user-centered design, but even those of us who ascribe to that ideal often fall back on our own biases and instincts when it comes to making decisions about how people experience our content and our services. Sadly, this often means we make decisions we think will be good for our "users"—that anonymous, faceless crowd—rather than actually trying to understand the perspectives, surroundings, capabilities, and disadvantages of the actual people who we are here to serve.

1. Designing
Empathy
with
Aaron Gustafson
@aarongustafson
adaptivewebdesign.info

2. Photo Credit: Stuck in Customs

3. Designing
Empathy
with

4. Design ≠ Art _
Image Credit: L.e.e Photo Credit: faith goble

5. Photo Credit: Abby Lanes
Art serves the Artist

6. “ I’ve been amazed at how
often those outside the
discipline of design assume
that what designers do is
decoration—likely because
so much bad design simply
is decoration. Good design
isn’t. Good design is
problem solving.”
– Jeffrey Veen

7. de·sign
/dəˈzīn/
To devise for a specific function or end
Classical: To indicate
Medieval Latin: designare, to mark out

8. David Carson
has been called
“the most
influential
graphic designer
of our times”
Photo Credit: © Marc Eckardt for FontShop, Berlin.

11. It was Art

12. It was Ego

13. “ subjective,
personal, and
self-indulgent”
Photo Credit: © Marc Eckardt for FontShop, Berlin.

14. “ Your ego is a
bad designer.”
– Christopher Butler

15. http://demo.northkingdom.com/ihuvudetpatoyota/index_en.html

16. http://demo.northkingdom.com/ihuvudetpatoyota/index_en.html

17. http://demo.northkingdom.com/ihuvudetpatoyota/index_en.html

20. Just because you can
doesn’t mean you should
Photo Credit: harald walker

21. Photo Credit: altemark
Design to
communicate
not alienate

22. Photo Credit: Laurence & Annie
Design
isn’t about
showing off

23. Design = Creativity
for Communication

24. Designing
Empathy
with

25. em·pa·thy
/ˈem-pə-thē/
From the Greek empathia meaning
“state of emotion”

26. em·pa·thy
/ˈem-pə-thē/
The action of understanding, being
aware of, being sensitive to, and
vicariously experiencing the feelings,
thoughts, and experience of another …
without having the feelings, thoughts,
and experience fully communicated in
an objectively explicit manner

27. Empathy requires listening
Photo Credit: [phil h]

28. Empathy requires questioning
Photo Credit: [phil h]

29. Empathy requires observation
Photo Credit: [phil h]

30. Empathy requires intuition
Photo Credit: [phil h]

31. Empathy requires patience
Photo Credit: [phil h]

32. Perspective
is everything
Photo Credit: ZeroOne

33. Ego is a shield
Photo Credit: Dunechaser

34. “ Empathy begins with
vulnerability. And being
vulnerable, especially in
our work, is fucking
terrifying.”
– Sara Wachter-Boettcher

35. Trust makes
vulnerability
productive

36. em·pa·thy
/ˈem-pə-thē/
The action of understanding, being
aware of, being sensitive to, and
vicariously experiencing the feelings,
thoughts, and experience of another …
without having the feelings, thoughts,
and experience fully communicated in
an objectively explicit manner
Also: the capacity for this

37. John Rawls
1921-2002

38. “ Empathy is about
showing solidarity
with others who
have a one and only
life on this planet.”
– Jeremy Rifkin

40. Solidarity requires
communication
Photo Credit: LeonArts.at

41. Global Community
Nation States
Religious Groups
Tribes

42. Global response
within 3 hours
Photo Credit: United Nations Development Programme

43. Selfishness is a survival instinct
Photo Credit: Malingering

44. Photo Credit: Stuck in Customs
We are able to empathize by
seeing ourselves
in others.

45. Mirror neurons
enable us to
walk that
proverbial mile
Photo Credit: Éole

46. Personas foster empathy
In UX, we use
personas to
help us empathize
Credit: Kevin O’Connor

47. They also
frequently
devolve
into another
name for
“the user”
Photo Credit: Tinker*Tailor loves Lalka

48. Personas
need to
be real.
They need
to be
human.
Photo Credit: code poet

49. User Scenarios =
situational empathy
Photo Credit: Sergiu Bacioiu

50. User Scenarios =
situational empathy
User scenarios =
situational empathy
Kitty: Sergiu Bacioiu; Fire: Mr. Theklan

51. Design is
problem
solvinga
Photo Credit: Unhindered by Talent

52. Call out the
relevant facts:
Bob is a mechanic
He is left- handed
He wants to look up
parts info (and
possibly order a
replacement part)
while under a car
Photo Credit: Neil. Moralee

53. We only need enough detail
to be able to put ourselves in
his shoes.
Photo Credit: Frisno

54. We only need enough detail
to be able to put ourselves in
his shoes.
Who cares
about his
macchiato
addiction?
Photo Credit: Frisno

55. We want info on his
• goals,
• needs,
• circumstances,
• outside influences,
• distractions, and
• limitations.
Photo Credit: Neil. Moralee

56. User scenarios help us
empathize in a productive way
Photo Credit: Chris Garrison

57. Photo Credit: Horia Varlan

58. Set a performance budget
Photo Credit: Gunnar Ries

59. Author appropriate content
Photo Credit: schoschie

60. Consider physical limitations
Photo Credit: lastquest

61. Facilitate satisfaction
Photo Credit: CaptPiper

62. Don’t create
unnecessary
barriers
Photo Credit: andrechinn

63. Don’t force
your agenda
on your
customers
Credit: XKCD

64. Support common
assistive
technology
Credit: windsordi

65. Help users learn to
accomplish complex
tasks and
reward
them for
doing so.
Credit: pasukaru76

66. Progressive Reduction
http://layervault.tumblr.com/post/42361566927/progressive-reduction

67. Progressive Reduction
http://layervault.tumblr.com/post/42361566927/progressive-reduction

68. Progressive Reduction
http://layervault.tumblr.com/post/42361566927/progressive-reduction

69. Hurt not others in Do unto others as you
ways that you yourself would have them do
would find harmful. unto you.
–Buddhism –Christianity
The Golden Rule
No one of you is a What is hateful to you,
believer until he do not to your fellow
desires for his brother man. That is the entire
that which he desires law; all the rest is
for himself. commentary.
–Islam –Judaism

71. “ [Progressive enhancement]
keeps the design open to
the possibilities of sexiness
in opportune contexts,
rather than starting with
the ‘whole’ experience that
must be compromised.”
– Ben Hoh

72. Egalitarianism
Equality of opportunity,
not equality of outcome

73. Designing
Empathy
with

74. Thank you

75. Designing with Empathy
by Aaron Gustafson
@AaronGustafson
Further reading:
http://readlists.com/820c6ff1
http://adaptivewebdesign.info
http://blog.easy-designs.net
Slides available at
http://slideshare.net/AaronGustafson
This presentation is licensed under
Creative Commons
Attribution-Noncommercial-Share Alike 3.0
except where otherwise noted
flickr Photo Credits
http://www.flickr.com/photos/aarongustafson/galleries/72157633153882514/
http://www.flickr.com/photos/aarongustafson/galleries/72157633161513316/