Inside the Microsoft Emoji Design Studio

Discover the hidden complexity behind your favorite emoji

Arthur Canales
Jul 16, 2019 · 5 min read
Image for post
Image for post
Image description: Four rows of the newest emoji including a sloth, a wheelchair, guide dog, and more.

Did you know that someone designs the emoji you send to your friends? 😲

Before words, humans communicated through pictures to tell stories. We still do this today with emoji. We use emoji to help add expression and personality to text, but you might be amazed at how much thought and design energy goes into making them.

“Emoji transcends culture,” program manager Judy Safran-Aasen says. “It’s actually becoming its own writing system.” Judy’s team creates the design for each emoji available in Windows. “Our emoji design and creation process juggle many implementation and creative considerations to create emoji that work at a global scale.”

What happens if the emoji you want to use doesn’t exist yet? You can submit a proposal for a new emoji (bubble tea, anyone?) to the Unicode Consortium. The Consortium is a nonprofit made up of tech companies and others that help promote, develop, and maintain consistency of writing systems across all software products. They review and vote on the emoji proposal. If they approve a new emoji, tech companies begin their design work.

It’s up to each company to interpret how an emoji will look in their design style. At Microsoft, our emoji are unique because they’re vector-based font glyphs. The font stacks the glyphs on top of each other to compose the final design. This allows for reuse of the same glyph for different colors like the skin tones. Our emoji font is scalable just like a text font so as you get larger the images will remain crisp and clear.

Image for post
Image for post
Image description: The skateboard emoji shown as spliced glyphs.

Still, a crucial part of emoji design is legibility at small sizes. “Because emoji are typically used at small sizes, it can be difficult to include enough detail to make them recognizable at those small sizes.” explains Judy. “For example, many emoji faces have only minor differences between them. In certain instances, the design will need to exaggerate certain features to make them distinct..”

For designer Mike LaJoie, designing emoji ties back to his roots. “I was a skateboard designer 20 years ago. That experience came flooding back when we were figuring out how to produce these complex emoji into a font. Vectors are what we used for skateboard screen printing, and layering vectors together is how we create emoji, too."

When Unicode’s list of approved emoji included a skateboard, Mike knew that he had to get the design right. “Skateboards are near and dear to my heart, because I have so much experience designing them. It allowed me to explore outside of the box — from mild to wild.”

“The sample images from Unicode and others showed the top of the board with the grip tape,” Mike recalls. “Showing the top means you’re looking at a solid black object, especially in our style. I wanted it to have an interesting graphic on the bottom, because when you buy a skateboard, the design on the bottom is an expression of you, not unlike using an emoji.”

“It’s the little details that make all the difference and make it look right. The trucks needed to face the right direction and have proportionately sized wheels,” describes Mike.

As part of the design process, Mike and his team usually create four or five versions of an emoji before narrowing it down to one. In this case, they created around 20. Mike had a few ideas: a plain skateboard, one at a different angle, one referencing a classic 1980s design, and ones with different patterns and colors.

Image for post
Image for post
Image description: Different iterations of the skateboard design.

One challenge that emerged during the design phase was figuring out the best shape for an emoji skateboard. Mike drew both a classic “pool” shape and a more modern “street” style design. In the end, the modern design won. “Straight angles work better at small sizes. And it’s the skateboard shape that is more popular these days.”

The design team also had to figure out what designs on the skateboard would work at such a small size. The team considered putting Ninja Cat on the bottom of the skateboard, for example, but it was too small to be legible at the typical emoji size.

Image for post
Image for post
Image description: The final skateboard design.

“We ended up with a skateboard design that has geometric pattern at the bottom. It’s not too outrageous, and the lines give a sense of depth on the board,” says Mike.

When it came down to either red or blue for the color, the design team looked at the whole emoji set. “You don’t want your emoji set to overuse a particular color and we realized that we needed more blue. If you have too many emoji of the same color, it’s difficult to differentiate them,” Judy says.

After the emoji has been reviewed internally and approved, we introduce the emoji in the next Windows release. This involves making sure the new emoji appears in both the touch keyboard and the emoji panel.

For Mike, one of the most important parts of the emoji design process is the sheer scale of the decisions he and his team make. “Designing emoji for an operating system that has billions of users is just mind-blowing,” he says. “It’s incredibly humbling to be able to design anything for that broad of an audience. And to design things that people can express their emotions, or have fun with? I love it. That’s one reason why I keep doing it. Being able to design things that people find useful, hundreds of times a day, for years, is really cool.”

Emoji continue to change how we communicate. Once reserved for informal texts and social media, they’re becoming increasingly common across all parts of our lives. More and more people are using emoji — so it’s a good thing we have designers sweating the small stuff for us.

Running Windows 10? Press the Windows key + period (.) or Windows keys + semicolon (;) to launch the emoji panel on the desktop. Happy World Emoji Day! 🎆🎉🎊

To stay in-the-know with Microsoft Design, follow us on Dribbble, Twitter and Facebook, or join our Windows Insider program. And if you are interested in joining our team, head over to aka.ms/DesignCareers.

Microsoft Design

Stories from the thinkers and tinkerers at Microsoft

Arthur Canales

Written by

Writer at Microsoft. I watch and make movies in my spare time. Laura Dern is my spirit animal. Views are my own. (He/him)

Microsoft Design

Stories from the thinkers and tinkerers at Microsoft. Sharing sketches, designs, and everything in between.

Arthur Canales

Written by

Writer at Microsoft. I watch and make movies in my spare time. Laura Dern is my spirit animal. Views are my own. (He/him)

Microsoft Design

Stories from the thinkers and tinkerers at Microsoft. Sharing sketches, designs, and everything in between.

Medium is an open platform where 170 million readers come to find insightful and dynamic thinking. Here, expert and undiscovered voices alike dive into the heart of any topic and bring new ideas to the surface. Learn more

Follow the writers, publications, and topics that matter to you, and you’ll see them on your homepage and in your inbox. Explore

If you have a story to tell, knowledge to share, or a perspective to offer — welcome home. It’s easy and free to post your thinking on any topic. Write on Medium

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store