THE STORY
Using our phones before sleeping is bad. We know that, but still do it.
Existing solutions don’t meet people where they are. Our project started with the acknowledgement that our phones are stuck to us and people resist change.
Digital Melatonin—an app that works with users’ bedtime phone usage to encourage sleep
Location
Berkeley, Remote
Timeline
Nov 2024—1 month
Role
PM, Designer, Researcher
Team
Karissa Wong, Jade Hyeryeong, Josh Wang, Sun-Q Kim
THE Solution
What if we let people use their phones the way they want while encouraging sleep intrinsically?
Digital Melatonin is a bedtime app that helps reduce phone usage before sleep. Users select their desired sleep time and choose an intensity level (1, 5, or 10) that determines how strongly the app's features affect phone activity.
Here’s the deck. Watch the pitch here!
The metaphors
Digital Melatonin is a digital "pill" that activates features to reduce phone use before bedtime.
Digigram (dg) is our playful unit of measurement, like digital milligrams.
Dosage describes the intensity level (1, 5, or 10 dg) that determines which features are activated.
Dosages and features
While each intensity level (1, 5, and 10 dg) comes with preset features, users can customize their experience by editing, disabling, or regrouping features for each dosage.
Product showcase
Onboarding
During onboarding, users are introduced to the concept of Digital Melatonin, and take a quiz or self-prescribe their typical dosage.
Taking Digital Melatonin
After receiving a notification, users can decide if they want to take digital melatonin tonight. If they do, they’ll set a goal and choose a dosage.
Home
On the home screen, they can see a graph of features being activated over the time from the pill intake to sleep goal and options to edit and cancel features.
1 Digigram Features
Short form video tracker
Bedtime routine helper
Gradual dimming
Gradual B&W mode
Timed muted notifs
The short form video tracker is a lightweight feature that overlays social media apps to help users keep track of their short form video intake.
5 Digigram Features
Sleep exercises
Calming content
Reverse snoozing
Sleep exercises interjects bedtime phone usage with increasingly frequent 20-30 second exercises that help relax the body and mind for sleep.
10 Digigram Features
Intentional usage
Exhausted phone mode
Slow battery charging
Intentional usage requires users to set a goal and time limit each time they use an app, making each phone interaction purposeful and time-boxed.
Bedtime Statistics
The statistic tabs provides a weeks overview, with toggles to overlay screen time, sleep, and digital melatonin usage.
THE OUTCOMES
Moonshot 1st Place
On Demo Day, I pitched on behalf of my team, and our project received a unanimous vote from all 4 judges.
“Typically teams hit 1-2 out of 3 targets, but Digital Melatonin hit 3 out of 3 (idea, design, pitch) out of the park.”
Missy Yarbrough, Moonshot Judge
“Seriously. Great work today! Proud of you and how it turned out. You did amazing.”
Rocky Montez-Carr, Moonshot Mentor
“This incredible team delivered a project that redefined creativity, innovation, and impact.”
Luke Preston, Moonshot Organizer
My Individual Contributions
UI/UX Design, PMing, Pitching
78 final screens; 11 user flows
Our PM software & SoT (Google Docs)
Storytelling, presentation deck, pitch
That was the TLDR; continue below for details!
Process Overview
Timeline & Roles
Problem definition
What’s a meaningful project?
I led 2 ideation sessions with the team. We started with 30+ problem spaces and hypothetical ideas and narrowed it to 11 by voting.
I suggested we plot the 11 ideas on 2 decision matrices and vote for the final problem space based on our interests and abilities.
Secondary Research
Zeroing in on modern-day insomnia
Poor sleep is common and unbiased—it appears across demographics, therefore solutions are impactful and have high social value.
Unsurprisingly, bedtime phone use is one of the culprits. We each struggled with this, and we could easily interview this group at Berkeley.
Competitve Analysis
Existing solutions: What isn’t working?
Productivity apps tell us to exclude our phones,
…but it’s not sustainable or realistic for many
“I hate losing control of my phone. It’s so jarring”
“If an app blocks me from using something for more than 30 seconds I would delete it”
“I felt violated when Regain kicked me off of Instagram suddenly”
“I had to keep turning off my Apple bedtime settings”
“I downloaded challengers just to delete it within a week”
Sleep apps focus on providing activities to add to people’s routines,
…but people already have their own phone routines
“Going on social media at night is a reward for my day”
“Mindless scrolling is my transition between work and sleep”
“Tiktok helps me dissociate”
“I go on Youtube shorts to turn off my brain. A meditative exercise would detract from my sleep or unwind time.”
“I’ve conditioned myself to fall asleep listening to the same Youtuber for the past 5 years”
User interviews
Meet Sarah and Mark, our personas
We collectively conducted 20+ student interviews, 5+ mentor interviews, and 1 professor interview to understand people’s bedtime routines, motivations, and pain points.
90%
of interviewees identify with Sarah
Sarah
20, Student
Sarah doesn’t plan to change her phone habits drastically and doesn’t like interventions
10%
of interviewees identify with Mark
Mark
28, Adult
Mark actively wants to sleep earlier, reduce phone usage, and appreciates app intervention
The common bedtime routine
Dim phone
Check
notifications
Respond to messages
Turn on DND
Dim phone
Scroll on social media
Fall asleep to sounds
I synthesized our research insights into personas, and averaged their bedtime routines and pain points. This allowed persona-driven design, where we could ideate features and flows for different user groups.
Design Deep Dive
Sarah’s pain points
Sarah isn’t particularly motivated to change her phone usage, but she does find time-wasting moments in her bedtime routine. Here's an overview of her routine:
Sarah’s onboarding
Interested in the non-constraining features, Sarah downloads Digital Melatonin. This is her narrated onboarding experience.
Features for Sarah
Sarah starts with the 1 dg pills (feature presets shown). Narrated below are features “Short form video tracker” and “Bedtime routine helper” in action.
Her pain points have been addressed by digital melatonin. She enjoys the satisfying experience and minimal intrusiveness, so she takes digital melatonin everyday, unknowingly cutting down her bedtime phone usage by 10-20%
Features for Mark and more
For those more motivated to sleep earlier, the 5 dg and 10 dg pills have features with more intervention. Shown below are the “Sleep exercises” and “Intentional usage” features.
Statistics for everyone
In order to form motivation, people need to feel that their current situation needs to change. We do this not by guilt tripping, but providing insights on users’ habits.
Features that didn’t make it
It’s just as important to discuss features that we chose to leave out. Here are 3 of many, and why.
Gamification
Users receive points or rewards for hitting certain sleep goals
Positive and negative connotations may hinder intrinsic motivation
Game factors can become stressful and actually demotivating
Introduces the idea that users can “fail” at sleep
Phone mascot
A character represents the phone’s “sleepiness” over time, encouraging users to sleep since their phone is “tired”
Interviewee feedback mentioned that mascots never motivated them
Unnecessary and maybe a little corny
Lots of effort for minimal positive effect (Bad ROI)
Morning Check-in
Users record quality and length of sleep, and add tags to find correlations between routines and sleep
Users may find this burdening or annoying
Not essential for helping people sleep earlier
We want the app to be lightweight and easily adoptable
Design considerations
Our North Star
Melatonin heavily inspired our features because its characteristics (unintrusive, gradual, and taken case-by-case) addressed pain points with existing solutions. Here are our UI and UX goals.
UI that is calm and clean
Lots of white space to prevent excessive cognitive load
Minimal intrusiveness for features that overlay on other apps
Only informative or functional UI
Purple as a relaxing, and low-light-friendly color
UX that enhances existing routines
Flexibility for nightly sleep needs
Simple and straightforward user flows for daily use
Taking melatonin is satisfying and easy
Gentle and neutral copywriting that serves to inform
Exploring good UX
I also analyzed popular and award-winning apps to develop my design intuition for Digital Melatonin.
Accessibility
Font size and colors were chosen thoughtfully to pass A11y guidelines, verified by the A11y Figma plugin.
end Credits
The warmest thank yous
This designathon was a huge team effort and I am so grateful for Jade, Josh, and SunQ. We met for ~2 hours every other day at 9PM for 3 weeks, which was not an easy task while balancing school.
Thank you to the mentors Amy, Rocky, and Stefanie for generously sharing your time with me and lending feedback and advice. Special thank you to mentor Amy, who gave me PM, design, and professional advice across multiple calls and built up my confidence.
Thank you to Luke, the organizer of Moonshot, Professor Davina Chan, who extended her office hours for me, and all the interview participants and people who supported us along the way!
