Emotion Analysis

Company

NUVI

Project Type

Product / UX/UI design

Role

Lead UX/UI Designer

Project Overview

Analyze emotions to gain insight on their customer's perspective

Objective

Design a set of icons that accurately represent the entire range of emotions

My Role/Responsibilities

Research / UX/UI Designer

Problem Statement

I needed to design a set of emotion icons that accurately represent the range of emotions being detected in Twitter posts by our social media analytics app. These icons should be easy to understand, universally recognizable, and visually consistent with our app's design language, in order to effectively communicate the emotions being analyzed to our users.

Solution

I utilized Robert Plutchik's wheel of emotions as a framework to design a set of emotion icons for our social media analytics app. By using this well-established model, I was able to accurately represent a wide range of emotions and ensure that the icons were universally recognizable. To achieve visual consistency with our app's design language, I carefully selected colors that aligned with the Plutchik’s wheel of emotions and the brand's color palette. Through research, I was able to refine and optimize the icons to make them feel consistent and familiar to the user. Overall, by utilizing Plutchik's wheel of emotions as a foundation, I was able to create a set of emotion icons that are both visually appealing and effective in conveying the range of emotions being detected by our social media analytics app.

I understand the importance of user research in creating effective designs. However, when I was tasked with designing emotion icons for social media posts, I didn't have the luxury of conducting user research. Instead, I relied on market research to understand the needs of the customers and industry standards to guide my design decisions.

Based on my market research, I identified common icons used to express emotions. I then began sketching out different icon designs for each emotion, keeping in mind the need for simplicity and clarity to ensure that the icons were easily recognizable. Additionally, each color conveys different emotions. I used Plutchik’s wheel of emotions to learn about the colors and the emotions they represent. The wheel of emotions is widely accepted as the standard for emotions and their colors.

I utilized the colors associated with different emotions, such as blue for sadness, yellow for joy, and red for anger. I was able to find corresponding colors within the design system, ensuring that they were consistent with the rest of the platform. I was able to successfully create icons by following the current style being used within the platform and combining that with expressions users frequently use as emojis on their phones. By assigning specific colors to each emotion, combined with the icon, I was able to create a visual language that effectively communicated the desired emotions to users. My attention to color theory and the users familiarity with emotion icons helped me to create a user experience that was not only visually pleasing but also emotionally resonant.

Application

After finalizing the icons, the next step was to apply them to the mention feed. The main purpose of these icons was to provide users with more context regarding the sentiment of each post. By displaying these icons, users could gain a better understanding of the author's emotions while writing the post. Posts can express a wide range of emotions at varying levels, and it is essential to display all of them. To achieve this, the icons were designed to appear more or less vivid, depending on the prevalence of the expressed emotion. This allowed users to quickly view the more prevalent emotions while scrolling through the feed. Additionally, users could hover over each icon to view its percentage breakdown. By combining the emotions with the sentiment, users could gain a comprehensive understanding of their audience's thoughts and feelings.

Integrating to Reputation

As the acquisition by Reputation presented an exciting challenge, it also required the integration of our existing apps into their platform. I approached this task by carefully balancing the essential functions of the experience while also taking advantage of the opportunity to enhance it with Reputation's offerings. In doing so, I meticulously followed Reputation's style guide to seamlessly merge the two platforms and create a cohesive user experience. The result was a successful integration that not only met the requirements of the acquisition but also improved the overall user experience.

More Case Studies