Flow-field particles · granite-4.1-8b
Output generated Cost / run $0.0003 Runtime 10.6s
Prompt for this run
Using the pre-provided p5.min.js (global p5, instance or global mode), create a full-screen flow-field particle animation: thousands of particles advected by Perlin-noise vectors, leaving fading trails, with colors shifting over time.
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
METRICS
Transcript · 4 messages
Using the pre-provided p5.min.js (global p5, instance or global mode), create a full-screen flow-field particle animation: thousands of particles advected by Perlin-noise vectors, leaving fading trails, with colors shifting over time.
index.html (3087 bytes)Successfully wrote 3087 bytes to index.html
The single‑file web app **index.html** has been created in the current directory (`/tmp/ws`). It contains: * **CSS** in a `<style>` block to set a full‑screen layout. * **JavaScript** (using the global `p5` instance provided by `p5.min.js`) that: * Spawns **2,000** particles. * Generates a **flow‑field** via Perlin noise, storing vector directions for each field cell. * Advects each particle toward its nearest field point, wrapping around the screen. * Renders particles with fading trails and continuously shifting hue/saturation based on `trailColorShift`. The file also loads the pre‑provided `p5.min.js` with `<script src="p5.min.js"></script>` and uses it in **global mode**. **File location:** `/tmp/ws/index.html` Open this file in a browser to view the full‑screen flow‑field particle animation.