John Keefe

Emotions: N, R, Y

keefedesign.com

View Process as Web Gallery Download PDF Deck ( 17.9MB )

Concept & Research

The goal of this project is to teach children about their emotions and how they can recognize their feelings while identifying them. This reaches educating kids that some emotions that we may think up as negative are ok to feel. As a group, we decided that we wanted to relate all of these emotions to be represented by characters and that we should have the information presented in card format. This is so that the cards can be passed around by multiple kids in a classroom instead of one child holding a book.

For research, I went to a local children’s books store and talked to people who had a background in childhood development. Part of my research led me to the fact that children relate to faces on characters to receive information. Based on this information I designed all of my characters as a face first, then built the design out from there.

N is for Numb

For this card, I needed to display the feeling of wanting to get away from everyone and to hideaway by yourself. For this card, I decided to create an environment that showed a depressing scene that displayed how the potato cut himself off from all his friends. I made a low lit room in Cinema 4D and played with a couple of angles to shoot the emotion that I was going for. The interaction involves the user taking the role of the potatoes friend as you work with him to help the potato realize they are not alone and that getting over depression is a process and will not happen all at once.

Numb shows a couch potato that has decided to cut himself off from the world.
Numb Spread
Video of Numb Tablet Interaction Prototyped with Figma

R is for Restlessness

When I was creating restlessness as a character I wanted a simple character that would have user drawn to the face of the character. Getting the face correct was important to one relate the emotion to the user, but secondly to create a face that would be funny and entertaining to kids. The back of the card tells children through illustration that restlessness affects others around you and can be disruptive to others. The interaction shows the user how they can calm down in almost any situation.

Restlessness has too much energy and has to run and be active to deal with all of his excess energy.
Restlessness Spread
Video of Restlessness Tablet Interaction Prototyped with Figma

Y is for Yearning

For the yearning card, I wanted to find an example of a situation of want that a child can harmlessness relate to. I decided to relate yearning to the anticipation that a child may have on Halloween. This want for sweets is relatable to most kids and the look the character shows on the back shows them in a state where their goals are in sight. The interaction walks the user through the experience of anticipation as the user clicks on a house and gets a surprise piece of candy.

A girl is shaking her bag in disappointment as she yearns to have some candy and eventually finds some.
Yearning Spreads
Video of Yearning Tablet Interaction Prototyped with Figma

Augmented Reality

Finally, with my augmented reality interaction, I had a game where the user swipes Spud the Potato out the out of his house to help him with his numbness. The games works similarly to golf where the user wants to hit the goal with as few swipes as possible. I wanted to make a game that was fun but also gave kids a reason to laugh about what may be a problem in their lives to help with seeing a positive outlook.

Recap

The interactions for all of these characters are simple because the goal of the whole project was to relate to kids and to do that one has to keep things simple. I was an interesting challenge to reduce my design to hit a demographic that may not be able to understand more complicated experiences. It was helpful to have a team of people working on this project not only to have a full stack of cards but to have people that we can bounce ideas off each other to set limits for ourselves.

Emotions Cards
Emotions Cards: N, R, Y

Downloadable Assets

You may use the below assets created for this project provided via Figma as long as you give attribution, share your outcomes, and if your use is non-commercial in nature.

The above work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
Creative Commons License