UX/UI Design | Brand Design | Web Design
A marketing website and mobile application designed for Happypillar’s first round of beta testing.
About Happypillar
Happypillar provides practical, evidence based therapy skills to caregivers to help strengthen their relationships with their children. These skills are used during 5 minute Happy Time sessions (this may seem like a short period of time, but when you’re a mom, even 5 minutes is precious time!) Happypillar uses machine learning technology to listen to and analyze the sessions to provide personalized feedback to caregivers to improve their techniques. These skills are proven to decrease tantrum frequency, increase child self-esteem, increase social & sharing skills, and decrease caregiver stress.
-
As the team lead, I led communication with stakeholders and guided the group to ensure goals were achieved on time. I also collaborated with my teammates to conduct research, create the UX/UI design, and design a presentation and merch for the brand.
-
Chelsea Lensing (team lead)
Aero Zachritz
Erin McFall -
Figma
Otter AI
Loom
Notion
Jotform
The Problem
Happypillar has gone through two rounds of alpha testing via a HIPAA compliant Jotform. Happypillar was created based on the founders’ personal experiences with parenting and navigating the difficulties that come with parent-child therapy accessibility. In order for Happypillar to move into beta testing, they needed research gathered from alpha testing and additional caregivers in order to design and build their first mobile application for Happypillar. Special attention needed to be paid to data visualization so that Happypillar can show progress in a way that’s easy to understand and track.
Screenshot of Happypillar alpha app via Jotform
The Research
We began our research by diving into some competitors and comparators to see what other apps were on the market that offered a similar experience to what Happypillar was trying to achieve. We simultaneously conducted user interviews and had a survey for Happypillar alpha testers to participate in. We wanted to make sure we were capturing data from previous Happypillar users as well as caregivers and moms who would benefit from the use of this app. We were able to gather a large amount of data to move forward with our design confidently. Let’s take a look at the research process below!
Competitor + Comparator Analysis
The client provided us with a long list of potential competitor and comparators that we narrowed down to three apps that provided the best insight and inspiration for designing an engaging app for Happypillar that would best serve its users.
-
Mental Health App for Families & Children
Intro is super in-depth and informative
App feels super kid friendly but also not too “kiddy” for parents to feel good about using
Like the combination of a simple design that still feels fun and motivational
-
Mindful Meditation App
Engaging visualizations
Informative onboarding
Breaks down large chunks of information into digestible portions
-
CBT Therapy & Self-Care App
Love the simple home/landing page of the app
Like the intro “recommended by leading therapists” - establishes trust
User Personas
We created a very large affinity map with the information gathered in our survey & user interviews. From this affinity map we were able to pull out key themes: they were all super busy parents, struggling to balance work, personal lives and navigating the waters of raising young children.
We also saw across the board that all of these moms wanted an app that felt parent and child friendly - they all shared that their children would be interested what was on the screen during Happy Time and if it was something that felt friendly and inviting, the chances of their child being excited about Happy Time was higher. From this information we were able to begin to divide our data into two core personas for Happypillar:
User Persona #1: Natalie
Natalie is a working single mother who is struggling to teach her child to handle emotions and feelings that lead to outbursts and temper-tantrums. Her and her ex-partner struggle to find the time and resources to manage these outbursts in a way that works with their co-parenting routine. They would love to have access to a resource where they can both learn techniques to build social skills and a stronger relationship with their child.
-
Finding time for new routines with her child
Her and her ex-partner don’t always agree on parenting
Going to an in-person therapist does not work for schedules
-
Help her child understand emotions and feelings in order to have less temper-tantrums
Consistent routine with her child
Be on the same page with her ex-partner about techniques used
-
Needs reminders to do tasks
Visualizing streaks and maintained habits is motivating for her
Needs documentation - has a difficult time remembering everything to share with her ex
-
Help her daughter understand and communicate emotions
Ensuring her child is mentally and emotionally healthy
“I’ve been wanting to try parent-child therapy but my busy schedule makes it so difficult to find times that me and my ex-partner are both available to commit.”
User Persona #2: Kaitlyn
Kaitlyn is a stay at home mom with two children. Kaitlyn hasn’t had many behavioral issues with her youngest, but her oldest struggles to play nicely with other children. At home, he is unresponsive and lashes out when Kaitlyn tries to talk with him about his feelings. Advice from other parents isn’t working and she can’t find a child therapist to see them soon enough.
-
Her kids have very different needs and she feels overwhelmed
Her partner misses out on a lot of the kid’s development
Has to wait 3 months for an open therapy appointment
-
Learn practical communication techniques that feel productive
Keep notes for her partner
Reduce the number of tantrums and issues at preschool
-
Always takes notes during her kid’s doctor appointments to pass on to her partner
Motivated by seeing progress charts for her kids
-
Creating a family routine
Feeling connected with her children
“I feel like I can’t communicate with my son anymore. I’m exhausted and don’t think I can wait 3 months to see a child therapist.”
The Solution
Designing an app that instills trust and provides an intuitive, informative and engaging experience for both caregivers and children will offer the best experience for the Happypillar user. By creating brand-specific illustrations, vibrant animations, and intuitive page layouts, we were able to bring that experience to life.
Wireframing
Mid fidelity wireframes for the onboarding that I designed in Figma. →
Our goal as designers for this project was to design UI that would establish trust between Happypillar and its users. Additionally, we wanted to create branding and illustrations that felt appropriate for the caregivers as well as their children. Even though this app isn’t intended for the child’s use, we heard from the majority of our users that if they were going to use this app to do an activity with their child, it needed to be somewhat engaging for the child as well. The Happypillar team had a few branding guidelines to adhere to, but really let us take the lead on identifying and designing a brand identity.
Usability Testing
Throughout my design process, I referred back to the data and research to ensure that my designs remained on track to solve the users' problems. I created a mid-fidelity and high-fidelity prototype to conduct testing at multiple stages throughout the design process. These tests assisted me in identifying and resolving three major usability issues →
-
On some pages, users were having trouble returning to the previous screen. I corrected my pagination and double-checked that the font size was readable on both desktop and mobile devices.
-
It was unclear to the user whether things were successfully added to their cart. I updated the cart icon to include a small dot above it when items were added.
-
Description text goes hereI changed the footer to include a "Contact Us" page because navigation to the contact page was unclear with just the chat feature.
The Prototype
View Figma mockup + design system here.
The Marketing Website
In order to gather beta testers for their product, Happypillar needed a location where investors and potential customers could go to view more information. Over the course of two weeks, we designed and built a responsive and interactive marketing website using Wix that brought in over 100 potential testers for the beta.
High fidelity Figma wireframes →
View Live Website here.
Please note that this is a live website that is currently maintained by Happypillar.
A few more things designed for Happypillar…
T-shirt designed for Happypillar to distribute to investors. →
← Illustrations designed for Happypillar.