05 / Playground
Take itapart
The interactive pieces this site is made of, lifted off the pages they work on and handed over with their controls. Each one is the component the site actually ships — turn something and you are turning the real thing.
01 / Specimen
The sculpture
A few thousand particles carrying their position in all six forms at once. One shader blends between them, so a morph is one draw call rather than six models. The flat canvas runs the same morph, lift and sway on the CPU for phones and reduced motion, and never downloads three.js.
Controls
Form
Renderer
Drag to turn · click to scatter
02 / Specimen
The name field
The letterforms are sampled from the real display face — every cell of ink becomes one code symbol with a home to return to. Type your own and it re-samples as you go. Move across it and the symbols part; press it and the whole thing blows apart.
Controls
03 / Specimen
Symbol topography
A height field contoured by marching squares, where the lines are never stroked: each cell a contour passes through gets one symbol at the crossing. Because the grid pitch matches the symbol spacing, they fall into runs that read as lines from across the room and as code up close.
Controls
04 / Specimen
The uplink
Two canvases fed by one tiny store: a carrier that carries a pulse for every key pressed, and a dish that catches a packet per character and rings as each lands. Neither re-renders React — the form writes to the store, the canvases read it.
Controls
Carrier · packets · dish