top of page

Feeling Zoo App and Responsive Website Design

Feeling Zoo is a fictional platform designed by developmental psychologists to teach children about emotions and empathy. Their main product is an app that is easy to navigate for kids, while they also have a website that parents can use to monitor their child’s progress and to read about the app. Their main audience is children whose parents don’t have time to participate in beneficial co-viewing activities to teach their children.

Project duration:

January 2022

feeling zoo app mockups.jpg

<a href="">Phone psd created by rezaazmy -</a>

Project Overview

The Problem:

While co-viewing media is an extremely beneficial process for children to learn about emotions and the consequences of certain actions, most parents do not have time to participate in co-viewing.

The Goal:

Create an app that can substitute for a parent during the consumption of media so that children enjoy content that is fun and entertaining while also reassuring their parents that they are learning lessons about their emotions.

My role was the UX designer designing an app and website for Feeling Zoo from conception to delivery. My responsibilities included conducting interviews, paper and digital wireframing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, and iterating on designs.

User Research

My research involved conducting interviews and creating personas for groups that may be interested in using the Feeling Zoo app. Two major user groups were identified: caretakers of young children who didn’t want them to fall behind in their emotional development and those young children themselves.


These interviews revealed that both entertainment and education were important to these users, as children did not want to interact with a boring site and parents wanted to make sure their children were learning.


Problem statement:

Ben is a young child with busy parents 

who needs access to interesting educational content

because he wants to have fun while learning.

Course 7 Personas.jpg

Problem statement:

Alina is a busy mother

who needs trustworthy educational content for her child 

because she doesn’t have time to select and watch appropriate content with her.

Course 7 Personas (1).jpg


A Crazy Eights exercise was done to ideate different ways that users might be able to interact with different parts of the app.

CamScanner 01-09-2022 21_edited.jpg

Digital Wireframes

To accommodate for young users, large options that didn’t require scrolling or reading were presented at the tops of pages.

Categories for parents to find certain content

lofi feeling zoo 1.png

Large options for easy clicking

List of lessons hidden until clicked to prevent clutter

lofi feeling zoo 2.png

Categories for parents to choose relevant lessons

Since users wanted to be sure the app was educational, a dedicated lessons page that children could navigate with an adult was added.

Low-Fidelity Prototype

The low-fidelity prototype mapped out the process of navigating each section of the app. This prototype was used in a usability study.

App prototype:

feeling zoo lofi prototype.png

Usability Studies

I conducted a usability study on the low-fidelity prototype. The results of this study were used to inform the design of the high-fidelity prototype.

usability study.png


Homepage Difficulty

The homepage had too many functions for a younger child to navigate.



No Self-Reflection

Users wanted to see an option for children to reflect on their own feelings as an extension of the other functions of the app.



Not Interesting

Several users wanted to see the use of characters in the app to draw children’s attention.

Refining the Design

Before usability study
After usability study

Users thought that a homepage with several functions was too complicated for a child to navigate, so the homepage was simplified.

Home – 2.png
Before usability study
After usability study
Home – 6.png

Users wanted to see a function of the app that would allow children to acknowledge their own feelings.

Final Mockups for User Flow

High-Fidelity Prototype

Accessibility Considerations



Text is large so that it can be read easily even on colored backgrounds.



All text in the app would default to being read aloud to accommodate for young users who cannot read.



Headers were used for screen reader accessibility.

Responsive Design

The sitemap was designed to include the same elements that were important in the app as well as additional information for caretakers who want to determine if the app is reliable.

Sitemap feeling zoo.jpg
feeling zoo website mockups.jpg

Responsive designs for the website version of Feeling Zoo were created, adding content as necessary to accommodate for the different screen sizes.

<a href=''>Mockup psd created by syifa5610 -</a>



This app creates a dedicated place where children can consume educational content and learn about their feelings without an adult having to be present for the co-viewing experience.

One quote from the usability study:

“This is a really underexplored field. I think an app like this would be amazing for so many parents.”

What I learned

I learned about the different uses for an app and a responsive website. Although initially I thought both would have the same function, it turned out that because more adults use the web version than kids, it made more sense to include relevant information for adults there instead of just lessons for children.

Next Steps

1. Run another usability study on the high-fidelity prototype to confirm whether users like design choices.

2. Conduct further user research to be sure the app contains all necessary functions for users.

Thank you for reviewing my work on the Feeling Zoo app and website!

bottom of page