Colophon
Made by hand, built with agents.
This site is a working example of how I work now. Every decision on it is mine: the positioning, the line, the type, the palette, the room, the way the work is shown and the way it moves. What's different is the build crew. Agents did the engineering and the grunt work from my briefs, and every change still ships through a preview I review as pixels. It's a handmade site with a faster pair of hands behind it, not a prompt with a domain on the end.
How the studio was made
The room started as a picture. I wrote the brief and art directed a still of the studio: the desk, the chair, the shelving, the plants, the lamp and the mark on the red wall. That still was the first hero, cut out from its background and drawn through a depth map so it moved with the pointer.
Then I had it rebuilt as a real scene, with Codex doing the modelling. Every object is geometry. Architectural light and ambient occlusion are baked ahead of time, reflections and shadows are cached, and the enamel wall and the frosted floor are materials rather than a texture. I directed the proportions, the finishes, the lighting and the small details through dozens of local previews, the way I'd direct a 3D artist, except the turnaround was minutes rather than days.
The opening is a build. The room's edges draw first, then the surfaces and lighting arrive behind a moving front, and after that it's yours: drag to orbit, the slider looks closer, the lamp switches the whole site between paper and ink. Reduced motion gets a still, and the room stops drawing the moment it settles or leaves the screen. The screens on the desk and the proofs pinned to the wall are pieces from this portfolio.
How the site was made
I designed the site the way I'd design anything: positioning first, then the line, the type, the palette, the grid and the behaviour of every interactive element. Claude Code built it to that design from written briefs, page by page, and I reviewed every build as pixels, cut what didn't earn its place and signed off the copy. The discovery work was real: an audit of my old site and the portfolios I admire, an inventory of six months of work across local drives, Drive, Slack and Asana, and first drafts of the case studies from that evidence, which I then edited into my own words.
How the repository works
Content lives in typed files, not in components. A schema validates every case study at build time, so a bad edit fails the build instead of shipping a broken page. The studio is its own Three.js scene with a small adapter connecting it to the opening sequence and the theme switch. Skills describe the routine jobs: add a case study, edit copy, tune the hero, check the screens, publish. Every branch gets a preview deployment with before-and-after screenshots on the pull request. Production only changes when I say so.
The mark
One polygon, three equal strokes, pointing off the page. It appears on the room’s red wall and as a small metal sculpture on the shelf. Its shape comes from the original vector artwork.
Type and colour
One typeface, Overused Grotesk, at sizes smaller than most portfolios dare, because the work should be the loud part. Anything that is a fact is set small, in capitals, tracked: indices, counts, sources, the build date. Paper, black and one warm red, used only where something is interactive or live; ink instead of paper if you ask for it with the switch in the nav. The lab is always the ink room. Crop marks remain around selected work; the studio hero is open and unframed.
Build log
The last commits to this site, from git. 21 commits since 21 September 2026.
- 21/09, 15:2431d295fHero: the opening plays on every load, and the copy hangs from the room
- 21/09, 15:13cac93d5Hero: returning visitors see the room and the line from the first paint
- 21/09, 14:5556132dfMedia: embedded players fill their frame after a click
- 21/09, 14:463d3a199CV: drop the selected work section and regenerate the PDF
- 21/09, 14:228123b2eHero: the controls keep their space from first paint and fade in, so the line no longer jumps on reload
- 21/09, 14:176b1f5b1Contents list always open; colophon retold around the hero; CV prints without a frame
- 21/09, 13:17f526ee2Round two: one strip for every project, RSN-1 public, demand generation, Artie rounded out, lab retold
- 21/09, 03:13d11e2ebThe studio: a modelled room as the hero, with a wireframe-to-material opening
- 20/09, 07:50d94d154The room as a depth-mapped still: the render itself, moving in space
- 20/09, 07:35c26a530The room: the studio as a 3D hero, with the mark on its orange wall
- 20/09, 07:17b0a253dStrip: the block break follows the visitor's velocity and stops with the band
- 20/09, 02:28ae2ddeaAnnotate: the site shows its own making. Brief lines, files and commits per element; build log on the colophon
- 20/09, 02:219d357f2Render opening: streamed mirror, flat registered mark, delayed nav, contact-sheet index, small contact plate
- 20/09, 01:49c11e507Critique pass 1: exhibits, four featured cases, gated block, click-to-play embeds, wide media, draft flag off in production, mobile nav, machine.md
- 20/09, 01:30d7ffb42Add PRODUCT.md from impeccable init; point AGENTS.md at it
Stack
Astro, Three.js, GSAP and Lenis, deployed on Vercel. Gated work is protected server-side with a signed cookie. Analytics are cookieless. A plain-text mirror of every page lives at /machine for agents and for people who prefer it raw.