Emoji Animations | Janina Kao

Emoji Animation

The best driving messenger to convey the information to other drivers

About

Emoji Animation is the soul of CarWink. It plays a vital role in displaying the message to the back drivers. Each of them can represent the information that often occurs on the road. Just call out commend words of specific emoji from App. The CarWink will display the emoji animation. Emoji Animation has become the new way to convey a message between cars.

Role

Visual Designer

Goal

Create meaningful and transparent pixel art animation as specific messages

Challenge

Inspired by Traffic Signs

I referenced the international official traffic signs to design emoji animations as meaningful scenarios and animate them into six frames animation. Used the current characters to express the visual language and let people feel familiar with the images and meaning and easy to understand. That would help them to get the messages and do the reaction soon.

The Statistics

We researched and found the statistics that there was a list of often causing road rage. I followed the results and discussed revising the animation several times about the wording and visual design.

Emoji Categories

*Hover the image to see the pixel version

Official Traffic Sign Related

These emoji animations' design was inspired by the current official traffic signs and conditions that create familiar recognition for users.

Self Driver’s Condition

These emoji animations are telling self condition to the back drivers. Let the back drivers know what you need and do the reaction.

Traffic Condition Ahead

Car accident ahead brings about the line moving slowly. Some drivers may not be patient and honk. We can send an emoji animation and reduce their intense moods.

Ask Back Driver's Action

Car accident ahead brings about the line moving slowly. Some drivers may not be patient and honk. We can send an emoji animation and reduce their intense moods.

Expression

Expression emoji is more fun and expressed personal moods. For example, show Sorry emoji animation to other drivers when changing lanes.

Solution

Animation Formate

We designed each animation to follow the template of 6 frames in 6-seconds. For the safety concern, the emoji animation moves too fast, which affects the driver's vision; and may cause car accidents. So playing animation not too fast can ensure safe driving and reading messages.

Emoji Animation Sets

Every set of emoji animation has three aspects. One is 6 seconds animation. The other is one single image to represent still mode. The last one is a flat icon as a button on the UI screen.

Pass Me

This emoji animation belongs to the "Ask back driver's action" category. I created an arrow to show go ahead and pass my car. Next frame, I animated a car from near and moved forward.

Too Close

The emoji informs the back driver to keep a safe distance between me. So the first fourth frames show the images of maintaining distance. Then the rest two frames show the text.