Frog Sleep-It's a sleep partner

Redesigned a sleep companion app, achieving a 93% task success rate and 4.5/5 usability score through iterative, research-driven design.

Role

UX/UI Design, Animate, Illustration, User research, Prototype

Timelines

6 weeks

Devices

Overview

“Frog Sleep” is a personal wellness app designed for young people who struggle with falling asleep, especially those with irregular sleep schedules.

Challenge

How might I design an interactive digital product that helps young people who have difficulty falling asleep and motivates them to maintain a healthy and consistent sleep schedule?

Problem

Many young adults struggle to fall asleep

Interviews revealed that users struggled to maintain a consistent bedtime because they stayed on their phones late at night and lacked motivation to build healthy sleep habits.

Stress and Mental Load

Stress and anxiety can make it harder to fall asleep even when someone feels tired.

Stress and Mental Load

Stress and anxiety can make it harder to fall asleep even when someone feels tired.

Irregular Schedules

Different class schedules, shift work, or varying daily routines make it difficult to maintain consistency.

Irregular Schedules

Different class schedules, shift work, or varying daily routines make it difficult to maintain consistency.

Technology Use

Notifications and online interactions can make it difficult to disconnect before sleep.

Technology Use

Notifications and online interactions can make it difficult to disconnect before sleep.

Empathy

My first step was identifying and working with survey and interview with students who have experience sleep tracking app, and identify their pain point.

Survey

32%

32%

Students felt that bright app interfaces made it harder to wind down, and preferred darker color schemes to reduce blue light exposure before bed.

Students felt that bright app interfaces made it harder to wind down, and preferred darker color schemes to reduce blue light exposure before bed.

25%

25%

Students prefer falling asleep with stories compare to music

Students prefer falling asleep with stories compare to music

15%

15%

Students use other habit-building methods to improve their sleep.

Students use other habit-building methods to improve their sleep.

User interviews and survey responses revealed that many sleep app users struggled to limit screen exposure before bedtime and maintain a consistent sleep routine. Participants reported that features such as bedtime reminders, relaxing music, and sleep stories were the most helpful for falling asleep faster and building better sleep habits.

Challenge met

Since this is an academic project, my professor asked us to include participants outside class. my partners and I had trouble finding interviewees, so my professor suggested using a Google Form and sharing it on school platforms or Reddit.

From research to persona

I synthesized my interview findings into a persona, empathy map, and journey map to clarify who I was designing for and where their biggest pain points occurred. Mapping Mary's frustrations — feeling overwhelmed by complex health apps and waking up multiple times a night — made clear that the product needed a simple, low-effort way to build consistency, not another feature-heavy tracker.

Based on Mary's need for motivation, I designed a playful onboarding experience and bedtime reminders.

Why I designed an animated avatar

My partner Yumei and I chose to use gamification because many young people find traditional sleep-tracking apps boring and hard to stick with. By caring for a virtual frog that grows and thrives as users follow healthy sleep habits, the app builds an emotional connection and reinforces progress — encouraging users to return and develop sustainable routines over time.

Survey screen example

"Hello" animation

Added animated frog interactions to make onboarding feel more engaging and encourage users to return consistently.

"Hello" animation

Added animated frog interactions to make onboarding feel more engaging and encourage users to return consistently.

Animated Avatar

Sleep screen example:

Young adults often find traditional sleep-tracking apps boring, while animated characters can make the experience more engaging and rewarding. Virtual avatars also help improve motivation, support habit formation, and encourage users to maintain healthy behaviors over time.

Morrison, C., & Doherty, G. (2021). Virtual coaches and behavior change: A systematic review. JMIR Mental Health, 8(3), e22710. https://pmc.ncbi.nlm.nih.gov/articles/PMC7814928/

Outcome

4.5/5

Usability test satisfaction

Usability test satisfaction

+93%

complete tasks

Students found the sleep Q features easier to understand.

Next Steps

I plan to use AI tools like Claude to help bring this concept closer to a production-ready app, with the eventual goal of publishing it to the Google Play Store.

What I learn

Going in, I assumed the biggest challenge would be visual — making the app feel calming enough to open before bed. What I learned instead is that motivation, not aesthetics, was the real problem: participants already knew what a good sleep routine looked like, they just didn't stick with it.

That's what led Yumei and me to propose gamification — not as decoration, but as a way to make the app feel more fun and memorable than other sleep apps on the market. We illustrated the frog and built out its animations so the character would stick in people's minds; classmates outside our team reacted with genuine surprise at the animation work in Figma, which told us the concept was landing.

If I iterated further, I'd want to test whether that emotional connection holds up over weeks of real use, not just a short usability test — habit-formation is hard to validate in a two-week academic timeline.

Create a free website with Framer, the website builder loved by startups, designers and agencies.