Case Study
UX Research
Branding
Responsive Design
UI/UX
Mobile App Design
manage emotional lows by learning with others
mello :)(
Role | UI/UX Designer, Researcher
Duration | Sep - Nov 2022 (6 weeks)
Kids want to learn about emotions in a safe and warm environment but don't want to feel like they are taking another class with homework.
Challenges
The Mello app and website was created as my third and final project for the UX Design Program. We were given a prompt and were asked to find a problem and design a solution for it. I chose the prompt 'design a mobile app and responsive website for kids to learn about emotions'. As a parent and designer, I wanted to create a product that kids of varying ages could use at home and on-the-go to learn about emotions, join a support group, and chat with a friend. I wanted to design a product that had two main users with different needs and user experiences.
Background
Mello is a mobile app and responsive website design focusing to offer a learning tool for users to learn about emotions through videos, activities, interactive games, and chat sessions. Welcome to Mello, managing emotional lows by learning with others!
Project Vision
User Insights
"The chat icon wasn't working."
"I like that I get to collect points with every game."
"It would be cool if there was a quiz for what I like."
"It would be fun to customize my buddy."
When I began my research it was important for me to create a product that focuses on how a child thinks and what a child enjoys doing. My goal was to create a mobile app and responsive website with multiple device sizes, which allows the user to learn about emotions by watching videos, playing games, listening to stories, writing in a journal, joining an emotion group, and talking to a support friend through a chat feature.
Solution & Goals
While doing a competitive audit, I noticed that there are sites that teach kids about emotions but many of them target adults with a classroom atmosphere. For direct competitors, I noticed that the information architecture appeared complicated for younger children to follow, and some of the design elements didn't appear warm and inviting. Kids want a place where they can play games, watch videos, and be rewarded for participating in activities when they are learning. Some users want a place to turn to or someone to talk to when they are feeling confused or upset, so offering an accessible chat feature seemed appropriate. With these in mind, I designed Mello with familiar iconography, scroll options, accessibility like audio and visual hierarchy, so the user can easily navigate throughout the site using the search function, familiar icons, or filter feature.
Competitive Analysis
Case Study & Interactive Process Deck
While designing Mello, I learned that making a product for a different kind of user like children requires understanding of what they like, how they interact with apps and websites, and what motivates them to use a product. Offering features like rewards, audio options, characterization, and familiar iconography can go a long way to helping the user fulfill their need. The most important takeaway for me is to focus on the real needs of the user when working on design solutions.
Target users shared that the design was easy to navigate, fun to explore, and they liked that a personality questionnaire had been added to the Home Screen to help them find activities that fit their needs.
Takeaways & Insights
Thank you for mellowing along!
Love to dress and accessorize pets, robots, aliens, and more? Create a happy pal and use reward points to collect new items for you pal.
Create A Buddy
Want to make some new friends? Need someone who understands you emotionally? Join a supportive group that fits your needs, in a safe environment where you can share and listen.
Join A Group
Too shy to join a group? Not interested in playing an activity or game? Start a journal and write your thoughts down. Save your thoughts and come back later. Collect reward points for every page and add stickers to your journal.
Start A Journal
Don't like pink or blue? Not feeling the playful colors? Change the theme of Mello so that it is truly you! Become a jungle, go to outer space, or add a treehouse.
Customize Theme
Future Features
Primary Flow
The primary flow takes the user on a journey that begins on the main screen with the option to select a category. The user selects a favorite and browses the options. Upon completion of an activity, they collect rewards points and can rate the activity. This flow was designed to be simple for the user to navigate. Initial low-fi prototypes didn't include a questionnaire, so an additional main screen was added to the hi-fi prototype.
Questionnaire Flow
After my first research study, I realized it would be beneficial and fun to get to the know the user by offering a questionnaire at the very beginning of the user flow. Activity options would then be catered to their needs, making it easier for a younger user to navigate the site.
Chat Flow
The secondary user wanted an app where they could talk to someone any time of the day when they are feeling down. In my initial designs I had a chat feature but didn't have additional elements to help the user with their needs. I added additional screens so the user can view profiles, talk to a "friend", and schedule a session for a later date.
