A UX journey towards a healthy sleep cycle.

This UX/UI project explores how to restore healthy sleep cycles by reducing screen time before bed. Through surveys, research, and prototyping, I designed an app that guides users in building better pre-sleep habits. The Hi-Fi prototype features fluid visuals, a calming palette, and friendly typography—creating a relaxing, user-centered experience.

Survey research during the prototyping phase revealed that late-night screen use was one of the main factors disrupting sleep. After identifying this core issue, I explored how existing apps addressed similar challenges and supported my research with health articles. The goal was clear: help users restore and maintain a healthy sleep cycle.

Control and balance Sleep cycles insights

username-journey-sleep-cycle-veramis-p-1600.jpeg
ux-ui-sketch-sleep-cycle-1-1-p-1600.jpeg

First Prototype and concept

With insights in hand, I began sketching prototypes. The app was designed to give users more control over their sleep cycle—before, during, and after bedtime—by guiding them toward healthier habits.

COLOR-PALETTE-SLEEP-CYCLE-1.jpg
COLOR-PALETTE-SLEEP-CYCLE3-p-1600.jpeg
COLOR-PALETTE-SLEEP-CYCLE4-p-1600.jpeg
COLOR-PALETTE-SLEEP-CYCLE2-p-1600.jpeg

Hi-Fi prototype

The final prototype aimed to be both engaging and calming. Fluid shapes represented the abstraction of sleep, while a moody palette of blues and purples contrasted with green and white to create a night-time atmosphere. Quicksand was chosen for its screen legibility and friendly, curved forms.

I focused on the pre-bedtime journey, guiding users to reflect on habits that delayed relaxation. Testing showed that features like identifying screen distractions and setting weekly goals were valuable, but the “tolerance level” setting felt overwhelming—so it was removed from the Hi-Fi prototype.

Previous

Deshilado type