What this prompt does
This prompt makes the model a senior mobile product designer and asks it to design a meditation timer screen, returning real component code rather than a mood-board description. The guiding principle is calm: wellness UIs fail the moment they feel busy or chime too loudly, so motion and sound serve the practice rather than decorate it. Three variables steer it: [stack] sets the framework (React Native with Expo by default), [tone] sets the visual and emotional feel like "calm, minimal, soft gradients," and [session_length] names the most common session, such as a 10-minute guided session.
The deliverables include a breath-rhythm animation that paces inhale and exhale without feeling busy, a session-length picker with presets and a custom option, soundscape selection with smooth switching and a quiet default, an interval-bells toggle, and an unobtrusive pause/resume control. A session log shows streaks, total minutes, and recent sessions. Crucially it asks for reduced-motion and audio-off fallbacks so the screen stays calm and accessible, plus a one-line note on the breathing-animation timing — because an app meant to calm people should never startle them. Because the prompt requires real component code rather than a mood-board description, the breath animation, soundscape switching, and session log all arrive as concrete pieces you can refine, and keeping motion and sound in service of the practice rather than as decoration is what separates a timer people actually use from one that feels busy and gets closed.
When to use it
- Building a meditation or breathing timer that must feel calm
- Designing a breath-rhythm animation that paces inhale and exhale
- Adding soundscapes with smooth switching and a quiet default
- Tracking streaks and total minutes in a session log
- Providing reduced-motion and audio-off fallbacks
- Generating timer screen code tuned to your
[tone]and[session_length]
Example output
You get the timer screen component code plus a one-line note on the breathing-animation timing: the breath-rhythm animation, the session-length picker with presets and a custom option, the soundscape selector with a quiet default, the interval-bells toggle, the pause/resume control, and the session log showing streaks, total minutes, and recent sessions, all with reduced-motion and audio-off fallbacks.
Pro tips
- Respect reduced-motion and let audio default to gentle; an app meant to calm people should never startle them.
- Set
[session_length]to your most common duration so the picker presets fit real usage. - Use
[tone]to keep the visuals quiet — calm, minimal, soft gradients rather than busy motion. - Keep the breath-rhythm animation simple; ask for the timing note so inhale and exhale pacing is explicit.
- Default the soundscape to quiet and make switching smooth so transitions never jar a session.
- If the screen feels crowded, ask the model to move the session log to a separate tab so the timer stays minimal.
