Skip to content
Film photograph — redwood canopy, a living system that grows from the ground up

Library

Process

How this website was built, from the inside. A case study written during the work, not after it.

Living document

How This Website Was Built

This website is not a project the operating system produced. It is the operating system, expressed as a surface.

The same architecture that governs client work governs this site. The same design tokens. The same content pipeline. The same audit machinery. The same philosophical foundation that every decision traces back to. What you are reading right now was built by the system it describes.

This is the story of how that happened.


The Problem

A creative practice needs a website. But the practice is also its own infrastructure: one person, amplified by machines, doing the work of a department. The website has to hold the work, the thinking, and the process without explaining all of it. It has to feel like the practice, not describe the practice.

The usual approach separates research, strategy, design, and development into sequential handoffs. Each handoff loses signal. The brief gets interpreted. The design gets interpreted. The code gets interpreted. By launch, the original intent has been translated three times.

The approach taken here collapses those handoffs entirely. The same mind that writes the positioning also chooses the type, writes the code, and curates the photography. The machines handle execution. The human handles intellect, judgment, and taste.


Phase 1: Positioning

Before anything was designed, twenty reference sites were studied. Not to find trends, but to find structural patterns. The question was not "what do sites in this space look like?" but "who is solving the same problem (broad practice, single voice, high craft) and what choices did they make?"

Seven patterns emerged across the majority of the reference set. Extreme typographic restraint. Navigation as architecture. A single positioning statement in the first viewport. No credibility listed, only woven in. Progressive disclosure. These are not trends. They are baseline expectations at this level of practice.

Three gaps emerged where nobody in the reference set currently lives. Generative art alongside client work without hierarchy. An AI-native workflow visible through the site itself. Photography and systems thinking in the same practice. The site was designed to occupy those gaps.

Twelve explicit design decisions were documented before a single pixel was drawn. Ground colors, type direction, navigation behavior, motion philosophy, photography treatment. Each decision traced back to the research. Nothing was intuitive. Everything was earned.


Phase 2: Designing Through Code

The site bypassed static design entirely. There were no mockups, no comps, no review cycles. The creative director designed through code, iterating live in the browser.

This was not a shortcut. It was the method. When the person making the decisions is also the person writing the code, static artifacts become overhead. The feedback loop is immediate: change the type scale, see it in the browser, decide in real time whether the decision holds. No waiting. No interpretation. No signal loss.

The design decisions from the research phase were implemented directly, tested immediately, revised in the same session they were conceived.


Phase 3: The System Builds the Site

This is where the operating system becomes visible.

Content flows from a single source of truth. The same documents that govern the practice internally are rendered for the public through a pipeline that transforms them automatically. One source. Multiple surfaces. When the internal document changes, the public version updates on the next build.

The network graph grows on its own. The interactive visualization on the homepage reads from the operating system's own registries. When a new capability is added to the practice, it appears on the graph on the next deploy. The surface was built first. The things that attach to it arrive when they arrive.

Images carry provenance. Every photograph published to the site has copyright and creator metadata embedded in the file itself. Not as a policy. As infrastructure. A single command processes an image or an entire directory.

The design system governs itself. A token pipeline flows from design variables through CSS custom properties into every component. Change a value at the source and it propagates through the entire site. The same pipeline governs client projects. This site is one expression of a system that serves many.

Accessibility, privacy, and metadata are not afterthoughts. They are checkpoints in a documented process that every site passes through before it ships. The checklist was written during the construction of this site and now governs every project that follows.


Phase 4: Emergence as Interaction

The site reveals itself as you engage with it.

Content materializes as the viewer scrolls and dissolves as they leave. This is not decorative animation. It is emergence: the site appears when you arrive and recedes when you move on. The right people find themselves inside without being invited.

The network graph on the homepage can be explored node by node. Click a branch and its children orbit into view. Scrub the timeline and watch the system disassemble backwards in time, then reassemble in the actual sequence it was built. The scrubber is not decorative. It is evidence.

The homepage is sequenced as an argument, not arranged as a layout. Each section earns the next. The pacing varies deliberately: arrest, then introduction, then thesis, then a stop that changes the rhythm entirely, then the invitation. Uniform pacing is the anti-pattern.


What This Demonstrates

The conventional model builds a website and moves on. This site is never finished because the system that produces it is never finished. When the operating system evolves, the site evolves. When a new document is written internally, it can surface publicly through the same pipeline. When a new capability is built, it appears on the graph.

The website is an artifact of the operating system. The process of building it is documented from inside the process. The case study you are reading is itself governed by the same system it describes.

That recursive quality is not cleverness. It is architecture. When you build on a living system, everything it produces is alive.