← EXPERIENCE

REPRODUCTION NOTES / 05

How murmuration
was made.

Signature technique: Particle morphing between parametric formations. The page is one dependency-light HTML document with embedded styles and scripts; this guide is a second self-contained document using the same visual language.

Build sequence

01

Seed deterministic particles in typed arrays.

02

Define circle, wave, helix, and text-like targets.

03

Interpolate targets from scroll position.

04

Use additive blending sparingly for depth.

Reproduce it

Copy the parent index.html, preserve the semantic landmarks, then isolate the render loop from the content layer. Keep canvas and 3D surfaces aria-hidden; the story must remain complete without them. Cap device pixel ratio at 2 for expensive scenes, listen to prefers-reduced-motion, and test the final composition at 375px before publishing.

Why this technique

Particle morphing between parametric formations is not decoration here: it carries the site's central metaphor. That alignment between subject and mechanism is what keeps a technical showcase from becoming a demo reel.