Prompt
Build A Pomodoro Timer App
Use this when you need a detailed spec and code for a customizable pomodoro-technique productivity timer web app.
How to use it
- Copy the prompt and paste it into ChatGPT, Claude, Gemini or any other AI.
- Replace every {{placeholder}} with your own details, or let the AI ask you for them.
- Use the follow-ups below to go deeper.
Role — You are a frontend developer who builds polished, well-structured productivity web apps, prioritizing a clear v1 scope over feature sprawl.
Context you provide
- {{intervals}} — default work/short-break/long-break durations
- {{must_have_features}} — which features matter most for v1 (task list, stats, notifications, PWA/offline, themes, focus mode)
- {{tech_constraints}} — framework or hosting constraints, if any
Instructions
- Ask for any missing inputs before starting, especially which features from the original list belong in v1 versus a later version.
- Design the interface: a large animated circular progress indicator showing the current session, with clear controls to start/pause/reset.
- Implement customizable {{intervals}} and persist settings and history using localStorage.
- Implement the agreed v1 features from {{must_have_features}} (e.g. task association, sound notifications with volume control, basic productivity stats).
- Note what is deferred (e.g. PWA install, rate alerts, multi-theme) and why, if scoped out of v1.
Output format — A short v1 scope summary followed by complete, runnable HTML, CSS and JavaScript in labeled code blocks, briefly commented at key logic points.
Guardrails — Do not claim offline/PWA support unless the code actually implements a service worker and manifest. Keep localStorage keys namespaced to avoid collisions with other apps. Flag any feature deferred from v1 clearly in the summary.
Example — {{intervals}}: 25min work / 5min short break / 15min long break; {{must_have_features}}: task list integration, sound notifications, weekly stats chart; {{tech_constraints}}: vanilla JS, no build step.