When you see these icons in an app, what do you assume that they mean?

This is how I personally interpret the icons in that context:

Since you’re reading this on Medium, you may recognize that these icons are from the Medium interface itself.

So what do these icons actually represent on Medium?

Now, I’ve been a Medium user for a couple of years now, but this naming convention continues to perplex me, so I decided to ask a few other people about it.

Following the Nielsen Norman Group guidelines for testing icon usability, I launched a series of Question Tests on UsabilityHub to ask how people perceive these icons.

Here is the particular question test:

Scenario: Imagine you are using an app that allows you to write blog posts and share them with others online… 1. “What would you expect to happen if you clicked on this icon in that app?” 2. “What text label would you expect to see associated with this icon?”

My Icon Question Test on UsabilityHub

It turns out I’m not that crazy.

While most people assumed that tapping the heart icon would “like” or “favorite” a post and save it to a personal profile, 0/25 testers associated the heart icon with the term “recommend” or “recommends”. They mostly expected it to be associated with labels such as “like”, “favorite”, or “love”.

Results from the heart icon question test on UsabilityHub

As for the chat bubble icon, while testers assumed that tapping the icon would create a comment on a post (or enable them to chat 1–1 with another user), 0/25 testers associated the chat bubble icon with the term “respond” or “responses”. Testers mostly associated that icon with the words “comment”, “message” and “chat”.

Results from the chat bubble icon question test on Usability Hub

Shocking, I know.

Still, these results are a good indicator that there is a cognitive disconnect between what people perceive the icons to mean, and what they actually represent in the Medium interface — a classic usability problem!

One immediate implication of this issue is feature discoverability. For instance, if users expect a heart icon to mean “like” or “favorite”, then they may go hunting for that specific term and encounter some difficulty finding where their “hearted” Medium stories are saved.

Discoverability issues with heart iconography

But beyond navigation issues, it's evident that this disconnect may inadvertently diminish the quality of the content being shared on the platform.

How?

Because people automatically interpret the heart icon and chat bubble icon to mean “favorite” and “chat” respectively, those are the types of light social interactions that users default to making on the platform. That’s okay in a silo, but it’s a bit awkward to see the system then define and broadcast these casual encounters with the overly aggrandizing terms of “recommends” and “responses”.

Natural user tendencies supersede the icon naming conventions, and result in content misnomers

Connotations matter.

And while the latter point is largely a philosophical one, at a time when false information is flooding social media, I think it’s important for designers to think carefully about the language and visuals they use to denote the nuances of social discourse online.

Okay, so how might we fix this?

For the usability issue, the solution is simple: pair icons with text labels across the app so that users don’t have to guess what the icons mean and where to find the related content.

Plus, adding these simple text labels may also help people think twice about the nature and quality of their writing.

A Medium UI concept with icon text labels for “recommend” and “respond”

At some point it may be worth supporting separate iconography and functionality for small micro-engagements in addition to more formal discourse, but I’ll leave that to the product team at Medium.

Which brings me to my final point…

The designers at Medium are smart cookies.

I am positive they put a lot of careful thought into the features, elements, and interactions for this platform. I am sure they have justifiably good reasons for omitting icon text labels.

So I invite them to share their reasoning on 2 points —

How and why did you all make the decision to use a label-free icon set? Has your user research revealed something contrary to my findings? Is it simply that you value a minimalist interface for writing over the potential usability cost? Something else? How do you plan to account for nuances in communication as Medium grows? Is there a plan to support interactions for light social sharing as well formal discourse?

Brad Artziniega, Paige Bennett, Sasha Lubomirsky, Andrew Crow, Peter Cho Tess Rothstein, and Marcin Wichary…

I invite you all to share your own thoughts on this subject, and I look forward to reading them!