← appaday

Regulators, a pocket of calm

It started on 28 June with one message:

let's make a mobile app. Expo Go... or better let's just start the PWA route. The idea is an app with techniques for (emotional) regulation techniques and instructions / links to videos. instructions could also be interactive with simple visualizations like the wim hof technique videos...

A technique here is anything you can do in a few minutes to bring yourself down or back: a breathing pattern, naming five things you can see, a cold splash on the face, writing the worry down. The app collects them, explains each in a few steps, links a video where there is a good one, and for the breathing ones runs a guided session.

Regulators home screen on a phone, dark slate background. Good afternoon. One minute to calm. Box Breathing, 2 to 5 minutes. Concentric rings around a dot, a Begin button, and at the bottom Explore 117 techniques and a search field
The home screen of the web version: one technique to start with, the rest below the fold.

Design by deleting

The look came out of the design playbook: a batch of directions, one picked (004 klein is the pick... colors should be even more designer-y and less signal / neon), then rounds on fonts and palettes until Hanken Grotesk on slate stuck. After that most of my messages were about taking things away. On 18 August:

for the breathing exercises it's fine to have a detailed details screen but for the others it's overkill... e.g. steps: numbers are redundant, everyone reads top to bottom in English. the duration is already indicated in the list, so no need to show it again here, same with category

And on lean code, when it felt just a tiiiny bit sluggish:

I personally always try to do everything as lean as possible, little non-basic state. little to no external dependencies

Collections, like playlists

The night of 18 to 19 August is the one this entry is dated to, the busiest of the whole project. It opened with this:

an idea I have now for the explore tab is next to categories to have collections... like playlists in apple music, basically collecting techniques that match certain problems [...] the collections could have exactly those names describing how you might be feeling right now or what they do...

A few messages later the names flipped: the title says what the collection does for you, the line under it says what it is for. Back to calm, when panic spikes. Drift off, when a racing mind won't let you sleep. There are eleven now.

Scrolled down: a row of coloured collection cards, Back to calm in teal and Take the edge off in blue, a Spotlight card for Gratitude Letter, then the Breathing list with line icons: Box Breathing, Physiological Sigh, Extended Exhale, 4-7-8 Breathing, each with a one-line description and a duration
Collections in a sideways row, a spotlight pick, then the techniques by category, each with its own line icon.

The same message carried an idea that only landed two months later: the same exercise, worded for a different person, because "gratitude practice" for example can feel very female and offputting and perhaps formulated differently would be more fun for men. That is now a collection called Straight talk, eight exercises from elsewhere in the app rewritten in plain, practical words.

Slower, and a second ring

Later that same night:

the breathing exercises feel a bit too fast paced... I think when in doubt it's always a good idea to make it slower breathing right? so let's do that... also with things like physiological sigh: why not extend the circle to that second ring? it would fit the technique perfectly to show that second level of in-breathing

A guided session of the physiological sigh. Cycle 1 of 3. A large white orb inside two thin rings, with the words Sip more air and a count of 1. Pause and End buttons at the bottom
The physiological sigh: a full breath in, then Sip more air, the short second inhale, before the long exhale.
techniques
117 in seven categories: breathing, grounding, body, thoughts, mindfulness, movement, connection
guided
all 15 breathing techniques run as sessions, Wim Hof as rounds with an open-ended hold
collections
11, named for what they do
built
28 June to 28 August, busiest on 18 and 19 August; agent rounds added icons, sessions and techniques in October
stack
Vite, React and TypeScript as an installable PWA; a separate Expo app shares the same technique file
Regulatorsweb version, best on a phone, installable

Still rough

There are two apps. The one I tested on my own phone through Expo Go has more on it: a swipeable deck on the home screen that learns which techniques you skip, a bright Pop theme where every card is one bold colour pair, a frosted floating nav bar, hiding techniques you never want to see. None of that is public; the link above is the web version, which has the content and the sessions but the quieter slate look. The screenshots are that web version at phone size. The newest techniques were written by an agent and nobody has reviewed them yet; I said early on that I will at some point need to review them all perhaps for quality, and that is still ahead.