A discussion on what user empathy is and how you can make sure that your UX process prioritizes users. Includes tips for doing this in WordPress. From WordCamp Chicago 2017

1. User Empathy:PRIORITIZING USERS IN YOUR UX PROCESS

2. Hello, Chicago!

3. I’m Mary Fran Wiley, a UX
designer with Ogilvy & Mather.
Follow Me:
 @maryfran
 @maryfranw

4. imagine
human body
a site as the

5. the codewhich gives
a site
the bones
structure
represent

6. the UX designthat supports essential functions
the organsrepresent

7. the UI designthey’re presentation and appeal
the clothesrepresent

8. the heart
UX is
of the matter

9. they didn’t
gives userssomething
Great UX
know they needed.
(although, who doesn’t know they need a unicorn)

10. if you have to explain it
a user interface is
like a joke
it’s not that good

11. get there?
howdo we

12. to know
we
need
our users

13. to feel
we need
with users

14. empathy
we can use
to enhance our knowledge

15. Empathy
people. Brene Brown
is feeling with

16. empathy
a lesson in

17. why
empathy?
do we need

18. empathy
low
Research suggests that those working in a technological field,
specifically males, have low empathy.

19. detachment
user-designer
Being detached from the users of a product or site - thinking of
them only in the abstract - endagers the success. If we think only
in technicalities, statistics and best practices, we lose the human
component that is cruial to interaction.

20. self-as-user
the
One of the hardest aspects of UX design and Human &
Computer Interaction is an assumption is that users will
approach and solve problems in the same way as designers and
developers working on your project do.
bias

21. cognitiveemotional empathyempathy
Cognitive empathy is a skill that can
be learned, even if we struggle to truly
feel empathy. It lets us uderstand the
thought process of others typically by
observation and applying empathy to
a system using tools such as empahty
maps and personas.
Emotional empathy is typically what we
think of when we think of empathy. The
emotional connection. The warmth.
The sensitivity. All the feels. This is what
drives us to create interfaces that excite
users.

22. take noteBeing empathetic isn’t just a switch you can turn on or off; it’s
something you actually have to believe in and practice.

23. seeing
& doing
practicing empathy

24. seeingInterviews
Home visits
Read
Watch documentaries
Stay informed

25. doingTravel
Volunteer
Improv classes
Mindfulness practice

26. creating a user-centric
ux process
applying empathy

27. observeCreating a truly empatheic UX process
starts at the beginning of every project.
Our very first step is to figure out what we
can observe of our users so that we can
truly learn about them - both the facts
and figures and the intangibles such as
emotion.

28. capture dataOnce we know what we are going
to observe, we must capture data.
Demographic data and general profiles
are a start, but for an empathetic
process we must dig deeper. Interviews,
observations and experiencing situations
the way users do are all types of data that
can help foster empathy.

29. reflectAfter gathering that data, you need to
reflect on it to make sense of it. This can
be in the form of personas, but those can
be vague and fall flat. You can strengthen
them with your data and by creating both
empathy maps and user stories.

30. personaOne of the most common UX
deliverables, personas have the potential
to be very useful documents if they are
prepared from contact with actual users.
Personas help visualize an example of a
customer - perfect for helping to foster
empathy.

31. Sasha Foxcreative · expressive · experimental
Technology
IT & Internet
Mobile Apps
Software
Social Networks
AGE: 26
Occupation: Advertising Creative
Status: Single
Location: Chicago, IL
Tier: Enthusiast
Archetype: Explorer
Goals:
• To gain knowledge in areas that interest
her
• To explore new opportunities in her local
areas
• To go on planned adventures with close
friends
Biography:
Sasha Fox is a creative in an advertising
agency where she spends most of her
time writing about diapers and toilet bowl
cleaner. She loves reading and margaritas
with girlfriends.
Frustrations:
• Actions that haven’t been thought through
• Content without substance
• Close-mindedness
Personality:
Introvert
Sensing
Thinking
Judging
Extrovert
Intuition
Feeling
Perceiving
Motivations:
Incentive
Fear
Achievement
Growth
Power
Social

32. archetypeLess fluffy and business-oriented than a
persona, an archetype is a data-driven
description of user behavior. Archetypes
provide insight into users behavior
patterns including how they are currently
using a product. Archetypes can directly
influence functionality and determine,
validate, and prioritize features.

33. empathy mapAn empathy map is a way to expand a
persona and truly understand the feelings
and motivations of a user.

34. think feel
say do
hear
what really counts · major aspirations · preoccupations
what friends say · what boss says · what
influencers say
seeenvironment · friends · what the market
offers
attitude in public · appearance · behavior twords others
pains gainsfears · frustrations · obstacles wants/needs · success · obstacles

35. user storyBy telling a story, you can explain and
understand the journey your user takes
as they go through the site. This can help
all the members of the team from UX to
client prioritize the needs of the users.

36. (user)
(do this)
(achieve this)
as a
i want to
craft a
so that I can
user story

37. brainstormDon’t set aside all the work you’ve done
so far and revert to your old wireframing
process. Use them to help guide your
brainstorm - what is the most important
information to your user? What problems
do they face that you can answer? How
can your interface anticipate their needs?

38. constructYou can’t go straight into prototyping
and development and call it a day. As you
build and adjust, make sure you weigh
any compromises with your user priorities.
Will a last minute client addition alienate
users? Will an unforseen technical
limitation force you to change your on-
page strategy?

39. testYou need to test your ideas at every stage
possible. Whether it is a formal user
test, the mom test or going back to your
interviewees to vet an idea or assumption
- don’t leave your users behind now.
Take those results and figure out where
you can make tweaks to improve your
experience. Always be testing and
responding.

40. wordpress
some
specifics

41. architectureCard sorts give great insight into how users perceive and use
sites and WordPress allows for custom post types and custom
taxonomies for a flexible architecture. Structure your data so it
can be sorted and browsed easily. Explore taxonomies and post
types - use just enough to make your site easier, but don’t add
them just to add them.

42. developmentIt’s easy to leave development out of the UX process, but it is the
lynchpin to your success. Make sure not to cut corners here and
make sure you involve developers early in the process to avoid
unforseen compromises. (Developers are one of your user groups
for your UX - make sure you have empathy for them, their role
and their expertise).

43. designWordPress has a myriad of tools that allow your visual design
to enhance your UX - especially targeting taxonomies and post
types with custom templates or CSS. Be careful to not go too wild
with unique implementations, consistency makes for strong
user experiences.

44. contentContent is the oft-overlooked piece of UX, despite it being key to
the actual experience. Make sure you are following best practices
such as filling out alt text and meta data as well as using
language that is familiar to your audience.

45. avoid empathy
success
We can’t
and expect

46. prioritizing users
Empathy is
needs and emotions

47. is usability
Prioritizing users

48. accessibility
Usability is

49. Questions?
Find Me:
 @maryfran
 @maryfranw
 @maryfranwiley
 curio.maryfranwiley.com
 maryfranwiley.com
Download the slides:
 https://www.slideshare.net/MaryFranWiley