Fireworks · glm-5.2
Create a fireworks display on a full-screen canvas where clicks launch shells that explode into gravity-affected, fading particle bursts.
transcript · 4 messages
Create a fireworks display on a full-screen canvas where clicks launch shells that explode into gravity-affected, fading particle bursts.
thinking
Let me create a self-contained fireworks display web app.
index.html (13350 bytes)Successfully wrote 13350 bytes to index.html
Created `index.html` — a full-screen fireworks display. Open it in any browser. **How it works:** - **Click/tap anywhere** → launches a shell from the bottom that rises to your click point and explodes. - Shells are physics-based: initial velocity is computed to reach the target height under gravity, with a glowing comet trail and a faint rising whistle sound. - On detonation, a radial **flash** blooms out and a burst of particles spawns. **Particle behavior:** - Velocity decays via air drag, gravity pulls them down, and alpha fades to zero. - Each particle has a colored radial glow + bright core, with optional motion trails and random flicker. **Burst variety** (randomly chosen per shell): - **Peony** – classic round scatter - **Ring** – tight symmetrical ring + inner scatter - **Willow** – heavy gravity, long drooping trails - **Chrysanthemum** – layered double rings - **Sparkle** – multicolored, fast-flickering **Atmosphere:** - Trailing frame fade (`rgba(5,6,10,0.18)`) gives smoky persistence. - Additive (`lighter`) blending makes overlapping particles bloom brightly. - Simple WebAudio generates a whistle on launch and a filtered noise boom on detonation (enabled after first interaction). - Idle auto-launch keeps the sky alive if you stop clicking for 5+ seconds. - An opening volley fires automatically on load.
TAKE IT TO CODE
A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.
RUN
EVALUATION
Fireworks auto-launch and explode with gravity-affected particle bursts; clicks and keys also trigger new fireworks.
Vision grade · anthropic/claude-sonnet-5
MEASUREMENTS
Raw readings from the capture, not a verdict — the grade above is the only judgement. Percentages are how much of the screen changed; the measure under-reports sparse motion on a dark background.