01 — Scroll-scrubbed canvas
ZOI Ice Tea
A can frozen in ice shatters into 58 procedural glass shards as you scroll, then a deck of cards fans open in 3D. Every value is read from scroll position, so it plays backwards correctly.
Canvas 2D · sticky sections · zero dependencies
02 — Real 3D, drag to rotate
Astrea GT‑R
A glTF model on a sticky canvas. Swipe spins it with inertia, scrolling walks the camera around and lifts all 51 panels apart, then puts them back. Swap in your own .glb and it still works.
three.js · glTF + Draco · needs a local server
04 — 3D with no model file
Arena
A loot crate that hinges open on four panels and a rifle that runs a full reload — both built from three.js primitives. No .glb, no download, no licence: ~15 KB of geometry instead of 2.5 MB of asset.
three.js · procedural geometry · phone-safe
05 — Raymarched, no geometry at all
Flux
A chrome blob with no vertices. The shape is a distance function marched per pixel on the GPU; scrolling pulls the seven spheres apart until the smooth-minimum can no longer hold them together and a droplet separates.
GLSL · signed distance fields · one triangle
06 — Water you can disturb
Mirror
A reflection sitting in water that runs the real damped wave equation on the GPU. Move the pointer and ripples spread at a finite speed, interfere, bounce off the edges and die out — none of which a scrolling noise texture does.
GLSL · ping-pong buffers · pointer-driven
03 — Hand-projected particles
RAW Pressery
540 particles on a tilted ring, projected by hand and depth-sorted into two canvases — one behind the bottle, one in front. That split is what makes the juice orbit rather than sit on top.
Canvas 2D · painter's algorithm · zero dependencies