A kids mindfulness app built around box breathing. Short, repeatable, and actually usable in the moment that counts. Designed mobile-first for children ages 6-12.
Kids with anxiety and many neurodivergent kids need practiced, accessible tools to downshift quickly. Box breathing is clinically effective, widely taught, and nearly useless when a child needs it most: mid-meltdown, no adult nearby, phone in hand.
Existing apps either entertain or instruct. Box Buddy had to do something harder: coach in the moment with short repeatable exercises, clear feeling-labeling, and no reading required. Completable in under two minutes.
The most critical early finding: kids want to feel better fast. Parents want to trust the tool and see whether it's helping. Compatible goals, but only if the design keeps them in completely separate lanes.
Mobile-first from wireframe one. Primary frame: iPhone SE, the smallest most constrained target. Click any phone to expand details.
Single CTA. Cloud mascot centered. Sound toggle and Grownups access tucked into corners. One screen, one decision.
Three large face buttons. Cloud mascot mirrors the child's selection instantly. Faces occupy 60%+ of the screen. Words are secondary labels only.
Illustrated tiles with mood filter on the right rail. Kids choose their world, not their exercise. Mood state carries forward from check-in.
Mood Log, Screen Time, Audio, and Settings in four quadrants. All data stays on-device. No account, no cloud, no COPPA exposure.
Both Figma prototypes are fully navigable. Click to open in a new tab and interact with the complete interaction design firsthand.
Both games are fully built and deployed in HTML/CSS/JavaScript. Each wraps the 4-4-4-4 box breathing cycle inside a game mechanic. Play them here.
Follow the wave through the box breathing cycle. The ocean environment guides kids through each 4-second phase using movement and sound. No instruction text required.
🌊 Play Mini-Game ↗Navigate the cosmos through the box breathing rhythm. A spaceflight metaphor carries kids through each breath phase without any instruction text. Built entirely in HTML/CSS/JS.
🚀 Play Mini-Game ↗Playtest sessions with children ages 6-12 across three rounds. We watched for hesitation, tap errors, and whether kids smiled or furrowed, not what they said they thought.
The cloud tells me when to turn.
I didn't have to think. I just followed it.
She actually used it on her own. That's never happened with any other app.
Measured across three playtest rounds against baseline. Results reflect specific design decisions: larger tap targets, faces-first mood selection, visual path coaching.
"Short wins build durable habits. A tool kids will actually use in the moment beats a comprehensive one they abandon after day two."Design principle, Box Buddy
Senior UX/UI Designer · Game UX · Product Development · Mobile-First Design
