Lungful

The brief

Create a fitness or wellness application with a working prototype, not a picture of one.

The idea

A breathing app should be usable with your eyes half closed. So there is one shape, it grows and shrinks, and colour tells you the phase before the word does.

Decisions

• Peach for in, lilac for hold, teal for out, so the phase reads without reading.
• A quiet tone rises with the inhale, so the app works with your eyes shut.
• Words at the end stay kind: stopping early gets the line That counted too.
• History is kept only in the browser.

How it came together

1. Defined four real breathing patterns as data.
2. Built one render loop driving shape, colour, word, count and sound.
3. Tested a full session with scripted clicks.

How it works

A single requestAnimationFrame loop derives everything from elapsed time, so the display cannot drift from the count. The shape is a polar curve, and stops wobbling when reduced motion is set.