arborea

Most breathing apps add too much around a very small core interaction. I built Arborea to do the opposite: guide the breathing exercise clearly and stay out of the way.

live project


the product

Arborea focuses on a few cues that matter during practice:

  • an expanding and contracting visual guide
  • audio cues and white noise
  • stereo panning for alternate-nostril routines
  • haptic feedback for eyes-closed use

The visual timing is mapped directly to the inhale, hold, and exhale phases, so users do not need to count on their own. Different exercises also get distinct color treatments, which helps with recognition without adding clutter.


implementation

The app is a PWA built with:

  • Angular
  • Nx
  • Firebase
  • TanStack Query
  • service workers for offline support and notifications

Each exercise is defined as a simple sequence of timed items, which made it easy to add or change routines without changing the rendering model.

The audio and vibration parts were the trickiest pieces. Smooth fades, stereo positioning, and device-specific vibration behavior all needed more tuning than the UI itself.


what mattered

Two decisions made the app better:

  1. keeping the interface minimal instead of building around gamification
  2. making it work well offline, since breathing exercises should not depend on connectivity

Arborea was a good project for practicing restraint. Most of the work was not in adding features, but in deciding which ones were unnecessary.