A sleep app that feels like a place, not a tool.
A case study by James Ibitoye
Prefer to feel it? Step into The ExperienceI've fallen asleep to rainymood.com since I was a kid. Just a tab of rain in the dark. It never tracked me, scored me, or asked how I felt. It only made the room quieter.
Most sleep apps do the opposite: a graph waiting in the morning, a streak to keep, a score. Somnia is the other kind. A place you'd want to be at the end of the day, calm long before it's useful.
Rather than explain it, I'd rather you feel it, so the rest of this page is the thing itself. It starts with sound.
01Sound
Pick one. The page becomes it.
Choose a soundscape and the whole page takes its colour, light, and motion. That is the idea the app runs on: you don't pick from a menu, you step into a world.
Tap a disc to begin. After that, hover any other to preview it.
02Breathe
The app opens by slowing you down.
The hardest moment in a sleep app is the first thirty seconds: phone bright, mind still going. So Somnia opens on a breath and lowers the temperature before it asks for anything.
Breathe in
Four seconds in, four held, six out. The pace a paramedic teaches to bring a racing body back down. Sync with the orb for one cycle.
03The loop
What a night actually looks like.
A sleep app is one loop: evening, night, morning. The honest version spends most of it doing nothing you can see. You set it, the phone goes down, and it stays out of the way until morning. Here is the whole arc anyway, even the part you sleep through.
Tonight
The one screen you really touch. Pick a sound, set a sleep timer, then put the phone down.
Tonight
Wind-down at 11:00 PM. Timer set.
Lights out
Screen off, face down. The sound keeps playing through whatever you are on: your phone, headphones, a speaker across the room, at your own volume.
Lights out
Playing. Screen off.
While you sleep
Nothing on the screen. Sleep is tracked quietly in the background, and the app asks nothing of you while you are under.
While you sleep
Resting…
Good morning
You wake to a calm recap if you open it. If you do not, it just waits. No buzzing, no streak to rescue.
Good morning
Good morning. You slept 7h 38m.
04Particles
Every soundscape gets its own world.
Each soundscape carries its own particle field — rain in vertical streaks, embers rising for the hearth, fireflies through the forest. All eleven share one small canvas.
Soft drifting motes, slow downward sink.
Larger floating particles, upward drift.
Tiny twinkling fixed points, distant sky.
Sparse wanderers connected by proximity links.
Vertical streaks with mild wind shear.
Small fast risers, gentle curl on the way up.
Sparse wanderers that blink on and off.
Rising wobblers, semi-transparent.
Slow drifters with faint comet trails.
95% sparse stars + 5% rare shooting stars.
Layered, depth-shaded swells with foam riding the surface.
05Try it
Open the real thing.
Not a video or flat mockups. The actual prototype, running right here. Pick a soundscape, scrub the night, run the loop. A sleep app lives or dies on how it feels in the hand.
loading prototype…
best on a real phone · works on desktop · audio requires a click
Why it matters
I'm not the only one with a rain tab open.
People already fall asleep to rain, study to it, and leave a fireplace crackling on the TV for hours. The behaviour is everywhere; it is just scattered across browser tabs and ten-hour videos. Somnia is a bet that it deserves a place of its own.
$9.6B
projected sleep-app market by 2034, up from $2.9B in 2025
Business Research Insights, 2025
1B+
views on a single faceless white-noise channel on YouTube
Relaxing White Noise, YouTube
133M
downloads of Calm alone — calm is not a niche
Statista · Business of Apps
And it is not only for sleep. The same soundscapes are background for focus and calm during the day. A 2024 meta-analysis in the Journal of the American Academy of Child & Adolescent Psychiatry found white and pink noise measurably improved task performance for people with ADHD. Left running as ambient sound and a slow visual, the same product just points at the daytime too.
06Origin
It started as a school project.
The brief was a branding course: invent a company and build its whole identity from nothing. I made Somnia, a sleep brand, and gave it the full treatment. A name, a logo, a palette, a type system, posters and packaging, a pitch. Back then it was a luxury label that sold pajamas and sleep masks and ran a wellness app on the side.
A second course that term asked us to design an app around a problem we actually cared about. I already had Somnia sitting there, so I pointed it at the thing I knew firsthand: falling asleep to sound. It was my first year, so the project ended where most first-year projects end, at a set of Figma screens.
Then I left it alone for a few years.
Coming back to it after graduating, the surprising part was how much of the original held up. The spiral, the wordmark, the deep indigo, the whole idea of drifting away. What had aged was the execution, not the instinct. So I kept the bones and rebuilt everything on top of them.
What stayed
The spiral mark, the SOMNIA wordmark, the midnight palette, and the feeling of drifting off. The brand was right the first time.
What grew up
The borrowed stock photos became generated atmosphere. Five products became one focused place. Flat screens became something you can open and use. The cartoon mascots are gone, and the restraint is the point now.
07The look
Five looks before this one.
I ideated wide, then narrowed to these five. To choose between them I didn't just trust my own eye. I put all five in front of five people, had them rank each one and say why, then asked what worked, what didn't, and which pieces they'd carry from one direction into another.
That feedback is how Pure Indigo won. I ran the same test on the dashboard layouts, ranked for which felt the least overstimulating to open in the dark, and that chose the home screen.
Tonight's plan is shaped for restful sleep.
★ Picked
Pure Indigo
Quiet · monastic · alive
A monochrome lavender bath, breathing on its own. The one that landed.
08The brand
Pure Indigo.
Almost entirely one colour, carried over from the first-year guide and finally disciplined. Palette, type, and voice, holding one continuous dusk together.
Palette
Type
Fraunces
display
Inter
body
JetBrains Mono
metadata
Cinzel
wordmark only
Voice
- “Rest, deliberately.”
- “Wind-down at 11:00 PM.”
- “A missed night isn't a broken streak. Begin again tonight.”
- “One choice, then put the phone down.”
09Core design decisions
The five I'd defend.
Decisions about the product itself — and what to leave out matters as much as what to keep.
Engineering
Designed, then actually built.
The short version:
- A real working prototype, designed in Figma, then built in React and TypeScript.
- Generative visuals, the nebula and particle fields, rendered with WebGL via React Three Fiber.
- A small Web Audio engine that keeps every soundscape layered, live, and reactive.
- One shared set of design tokens driving every surface, so brand and build stay in sync.