Designing smarter inclusive interfaces for better Inclusive Design- an emoji case study

Experience Dynamics
5 min readOct 6, 2021

by Frank Spillers
CEO/CXO @ Experience Dynamics; UXInnerCircle.com

thumbs up icon changing colors white, black, yellow
Slack email icon showing a rotating skin color ‘thumbs up’.

Slack has a history with inclusive icons. Around 2015, the familiar thumbs-up icon got an inclusion facelift from a product manager at Slack. The decision to offer various skin tones caught on, and has become the Unicode default for emoji inclusive design ever since. As great as this is, we need to advance our Inclusive Design efforts by getting smarter about how we create inclusive interfaces. Think AI for Inclusion. I will explain below, but first an update…

Slack in 2021 introduced a way to customize your skin tone as your personal default. See the image below.

Slack emoji selector interface with various emoji symbols
Slack’s new (2021) emoji default feature. Yes, it’s lower right. My eye usually stays up at the top of the dialog when searching for an emoji.

Note: I have to admit that I only saw this “Skin Tone” button after I Googled the news story, then went to grab a screenshot for this post. Configuring emoji settings, I suppose, is not part of my mindset when using Slack or grabbing a relevant emoji — quickly. That’s a usability issue but points to a deeper problem with allowing for customizing inclusive defaults, over making them smart. For example, should users have to go looking for this feature, or should the system just adjust?

Slack emoji selector interface with various emoji symbols- skin tone picker showing various tones.
Slack’s new (2021) emoji default feature- expanded to show skin tone default picker.

Emoji inclusion still has a way to go…

In an Adobe report on Emoji Diversity and Inclusion (2021), they found:

  • 83% of respondents that Adobe surveyed said that emoji characters should continue to strive for more inclusive representation. Just about half said they felt their identity was adequately reflected in current emoji characters.
  • Only 37% of users with a disability or impairment said they felt represented.
  • 78% of respondents said they believed more customization options could address gaps in emoji inclusion. Those options could include other hairstyles and colors, accessories, body type, and eye color options.

Emoji Diversity and Inclusion Report 2021 (Adobe Report)

Users at Apple Insider provided examples of the types of customizations that users are looking for…

coments from Apple Insider blog post describing emoji customiation

Clearly, emoji’s can do more to elevate the representation of groups of communities traditionally left out. The users above seem to think of it as avatar customization and management in a game or virtual environment. But when was emoji default preference part of your onboarding of any software, mobile, or productivity app or experience? It wasn’t. It’s considered part of your chat interface settings. It seems to be a pattern borrowed from mobile and social media, where emojis grew up. However, the assumption that users are stopping to configure emojis while using Desktop or even mobile software is, well, an assumption. Select an emoji, sure. Configure emoji settings — maybe.

How can emojis and inclusive interfaces get smarter?

For inclusive interfaces to become the default, and thereby send the nudge to your teammates that you are welcoming (and inclusive) in the Slack example, we need smart configuration. By smart configuration, I am proposing an interface that you don’t have to touch unless you want to. Especially in contexts like Slack, the tool is a workhorse, you’re not there to play. Why can’t the icon adjust to the settings of the person you are communicating with? Reflecting the icons of the user you are socializing with would avoid you having to go out of your way to customize. For example, changing a yellow thumb to a black thumb, in order to send the subtle social signal you are inclusive, to your friend sending you a black or brown thumb.

Yellow thumbs seem to be the default. They started out being seen as ‘universal’ due to their in-between color. Think Simpsons yellow. However, I’ve noticed many of my black colleagues have changed theirs to a black thumb. Now for me to counter with a yellow or white thumb seems to me to be insensitive. I would rather counter a black thumb with a black thumb. And when my Asian teammates send me a brown thumb, I would rather reply with a brown thumb. Having to jump around and customize the icon each time I reply to a different person is tiring. In addition, the onus of social adjustment does not have to be (or shouldn’t be) on the user. If we’re going to call it Artificial Intelligence, we’re going to need it to think inclusively. Algorithms can be made ‘smart’ to perform a task like this. The inclusive interface rule could be: mirror any white or yellow thumb with the other user's skin tone setting preference. Elevating inclusiveness as the default.

The bottom line today is that if you want to be inclusive in your communication using emojis, you have to customize and customize and customize with each person, each time. If anything, why not remember my settings when I customize? Smart inclusive interfaces. What are we waiting for?

Frank Spillers CEO Experience Dynamics

About the author: Frank Spillers, CEO/ CXO of Experience Dynamics, a leading UX consulting firm with Fortune 500 clients worldwide.

For over 20 years, Frank has been a seasoned UX consultant, Researcher, Designer, and Trainer. He is an award-winning expert in improving the design of digital products, services, and experiences. Frank is a Subject Matter Expert in UX Design, UX Management, Accessibility, Emotion Design, Service Design, Localization UX, Lean UX, VR/ AR UX Design. He provides private corporate training and offers courses to the largest online design organization in the world (Interaction Design Foundation). In 2001, Frank founded UX consulting firm Experience Dynamics. He provides deep learning opportunities at UX Inner Circle.

--

--

Experience Dynamics

Experience Dynamics, a leading user experience design consultancy that helps high growth companies manage and win with UX/UI excellence.