Light, computed.
Five studies on WebGPU, built on vgpu. Three cut the mark from one distance field: a card, a table, a part. Two leave the mark alone: a drawing and a sea. Nothing here is on the site yet. This sheet is where we decide.
This study needs a browser with WebGPU.
The pass.
A graphite card that stays dark until light grazes it. The engraving is the mark, cut as machining passes taken from its own distance field, and the foil around it is the same field running outward like an alert’s echo.
| Kept | The tilted-plane ray hit, the diffraction grating model, the surface-locked grain, the light band that follows the pointer. |
|---|---|
| Changed | The engraving, the hue and the type. The triangle became the mark. The pearl is one colour, the LED’s cyan, and the grating’s rainbow is a whisper. Lettering is set live in Gilroy instead of a baked mask. |
| Could become | The supplier pass sent with an NDA. The Open Graph card. The cover of a case study. |
This study needs a browser with WebGPU.
The light table.
The system’s rule, made literal: the LED is the only thing that emits. Carry it around the mark and the shadow is computed, not drawn. Light leaks through the gaps between the bars. It beats three times, then rests: delivered, displayed, acknowledged.
| Kept | The whole lighting pipeline, untouched: jump-flood seeds, the distance field, six radiance cascades, the merge. |
|---|---|
| Changed | The scene and the last pass. Ten dots became three bars that emit nothing and one LED. The final pass redraws the mark from its field at display resolution, so the edges stay machined while the light stays soft. |
| Could become | The Reach hero: the alert as the only light in the room. A loading state that means something. |
This study needs a browser with WebGPU.
Machined.
No example underneath this one. The mark is extruded and bevelled from the same field and sphere-traced. The studio is a function: a softbox from the top left, a strip overhead, a cyan card low on the left. No mesh, no texture, no environment map. About a hundred and sixty lines.
| Against three.js | The site’s hero is a thousand lines and a 700 KB library. This is one shader. It loses the ten finishes and the assembly; it gains a part that is sharp at any size and renders the same in a browser and on a server. |
|---|---|
| Brushed | A fan of nine reflection taps spread along the brushing direction. That is the whole trick. |
| Could become | The still before WebGL loads. Every Open Graph image, rendered headless from the live shader. |
This study needs a browser with WebGPU.
The drawing.
Bolted, taken literally. One M12 hex bolt, drawn first angle the way a supplier would receive it, in hairlines that stay almost dark until a lamp passes. The lines catch the light and throw it across the sheet. Read the title block.
| Kept | All five passes: the mask, the rim lit by its distance from the lamp, two blurs, and the 48-step march toward the light with blue-noise jitter. The resize queue that swaps a new subject in only when it is still wanted. |
|---|---|
| Changed | The subject and the lamp. A logo decoded from an SVG became a sheet set out in millimetres and drawn live, in Gilroy, at the backing resolution. Tone is hierarchy: a dimension catches less light than an edge. The light is the LED’s cyan, and you can see the LED. |
| Could become | A Notes cover, one drawing per note. The Labs hero. A print. |
This study needs a browser with WebGPU.
Noise floor.
A quarter of a million points ride a computed sea: every other notification, the silent switch, the dead zone. One LED floats on it. When it sends, three fronts cross the field, and the noise bends them on the way. Press anywhere to send one.
| Kept | The whole simulation: a Phillips spectrum, an 18-pass inverse FFT at 512 squared, normals and foam, additive particles, five levels of bloom. Rebuild on resize, teardown target by target. |
|---|---|
| Changed | One emitter, and what it sends. A second draw floats an LED on the same displacement texture as the points. Eight ring slots in the particle uniforms lift and light whatever each front passes. White crests went cool grey, the camera came up and back, and the frame’s void sits under the field. |
| Could become | The Reach hero, behind the alert slab. The opening frame of a talk. A Labs piece with sound. |
| Support | WebGPU only. No fallback below it. Each study shows a plain line instead of a canvas when it is missing. |
|---|---|
| Cost | Only the study on screen runs. The light table computes its field at 720 pixels and thirty frames; the part is capped at one and a half times the display; the drawing runs at thirty. The sea is the heavy one: 22 simulation passes and 262,144 points a frame. |
| Motion | One per viewport, driven by the hand. With nobody at the pointer each has a slow idle. Under reduced motion the first four hold still; the sea slows to a fifth and sends only when pressed. |
| Source | experiments/vgpu in the repository. The pulled originals sit beside the studies, unmodified, for comparison. |