Botox and the Art Of Designing Empathy

Alex Walker
SitePoint
4 min readAug 25, 2016

--

We all know that the internet has its share of trolls-and likely always will.

But in the early days of SitePoint we noticed an interesting trend: Articles with author faces beside them were almost always treated more fairly in the comments thread than those without.

We found writers using caricatures or cartoon avatars faired better than those with nothing. Writers using logos or non-facial graphics were much more likely to attract aggressive and impolite feedback.

That didn’t mean photographic avatars completely shielded the author from criticism — nor would you want it to. But criticism tended to be much more even-handed and constructive.

What’s happening here?

In a 2011 study for Social Psychological & Personality Science Journal, test subjects were asked to view a series of faces and then describe what emotion they saw in each face. The idea was to test their ability to imagine what another human is feeling — we call it empathy.

Although results naturally varied from person to person, most people showed good skill at correctly identifying the facial expression they saw.

The interesting part came when analyzing the video recording of each user test. High-speed cameras revealed that, before answering, each test user momentarily copied the expression they saw in the photo.

These so-called ‘microexpressions’ were completely involuntary, unconscious and often barely perceptible to the naked eye, but seemed to help the subject make sense what they were seeing.

The obvious question: what would happen if we blocked these microexpressions?

Botox is Only Skin Deep

A few months later, the same test subjects were treated with botox before sitting another round of testing. As you might know, botox works by paralyzing the small facial muscles around the eyes and mouth. This reduced the appearance of wrinkles but also works to block micro-expressions.

Amazingly, these ‘botoxed’ test subjects were significantly less able to interpret the faces they were seeing. Some kind of feedback loop was broken and their ability to empathize declined.

It seems that when we physically mimic a facial expression, it triggers a memory of what that emotion feels like. You could say, we get into their mind by getting into their face.

Building Empathy into UIs

When we associate words with a nearby face, it changes the ‘internal voice’ we hear when we read it.

I’ve animated an example to show this in action: This sublime Dorothy Parker quote is presented:

1). as pure text
2). beside a vibrant, glowing Parker
3). beside a sad, almost broken Parker

The text doesn’t change yet it feels quite different each time the imagery alters. Something changes in our head.

Most of us use lots of faces in our design work but I think there are two places where engaging user empathy is particularly useful.

  1. Any Kind of Editorial Text: Blogs, reviews, forums, or comment threads. Include a face any time you present ideas that you’d like your users to give attention and respect to. Obviously, a relaxed, confident smiling author is more likely to trigger relaxed, smiling, confident readers.
  2. Testimonials and Quotes: Testimonials are all about social proof. The more we can help a user with the testimonial author, the more weight they’ll place in the words.

The Catch

We’re all products of the world we grew up in and brings our own set of preferences and prejudices. It’s an imprecise science, but – if you have a choice — displaying content from similar users to the reader (i.e. age, gender, and locality) is likely to get a more empathetic response.

And, of course, lay off botoxing your users if you can.

Originally published in the SitePoint Design Newsletter.

--

--

Alex Walker
SitePoint

Pixel puncher, pusher and prodder @SitePointDotCom