The Problem
The Substrate
The System
Signal
Case Study · Meta · HS-CS-002

Building this portfolio.

A working showcase of how I think, what I'm working on, and how I create. This is the case study of building it.

Domain
Agentic Build
Year
2026
Status
In Progress
Type
Workflow Design
FIG. 01 — The Problem

When the artifact is easy, what's worth showing?

Anyone can build a personal site with AI. So the site itself isn't the differentiator anymore — the method is. I wanted this one to show what I've built and the way I built it: how I think, and how I work with AI.

My experience with AI, the way I think through a system, and the kind of challenge I actually like — none of that sits on a project tile. So the site is the proof.

FIG. 02 — The Substrate

What the build runs on.

The staged workflow on the next page doesn't run on nothing. It runs on three layers I'd already built — a personal infrastructure for memory and knowledge, a locked design system for visual and writing register, and a Claude Code runtime for orchestration and tool use. Each one is documented elsewhere; this is the short version of what they are and why the build needs them.

Substrate · Three layers
Personal infrastructure
Open Brain (memory), the had9000 vault (knowledge), MCP (connective tissue), and locked skills like voice and glyph-creator. The agents draw context, samples, and patterns from here — they don't start from scratch each session.
HS-CS-001 · Open Brain →
Design system
HS-SYS-000 (stylesheet, v1.1), HS-SYS-003 (8 node glyphs), HS-SYS-005 (20 utility glyphs), and the voice skill (10 locked writing samples). The agents pick from these; they don't invent visual or voice patterns on the fly.
system.html →
Agent runtime
Claude Code as orchestrator, named subagents with bounded tool grants, CLAUDE.md as standing instructions, custom slash commands as repeatable moves. The next section is what runs on it.

Every move pulls from approved voice and design. Improve a pattern once, and every future artifact gets the upgrade. The substrate compounds with use.

FIG. 03 — The System

A staged workflow with named subagents.

The build runs as seven stages, each with entry/exit criteria and a written artifact in decisions/. No drifting into "let's just code something." Inside Stage 4 (Build), five subagents take bounded roles — the main thread orchestrates, the workers do the research, the code, and the audits.

Stages · Operating manual
00
Setup
01
Discover
02
Architect
03
Design
04
Build
05
Polish
06
Ship

Five subagents, each with a single job.

The Build stage runs as a tight loop — spec one chunk, spawn a worker to implement, spawn a reviewer to audit, eyeball it, merge. The subagents are not free-roaming assistants; they have descriptions, tool grants, and one thing to do.

Narrative
Voice & content
Drafts copy. Keeps the patent-document register. Refuses marketing puffery.
Design
Design system
Owns the locked design system. Reviews any new pattern against it before it merges.
Engineering
Implementation
Writes the HTML, CSS, and SVG. Vanilla, no framework. Each page deploys as a static file.
QA
Accessibility & polish
Runs a11y audits, checks responsive layouts, verifies contrast, watches for design-token drift.
Security
Surface review
Checks anything that touches external systems, embedded analytics, or third-party assets.
FIG. 04 — Signal

The demo is the page you're reading.

The stylesheet is shippable on its own. It's already running a second project. The case study you're reading was built by the workflow it describes.

Stages
7
Explicit, with entry/exit and named artifacts.
Subagents
5
Single-purpose: Narrative, Design, Engineering, QA, Security.
Stylesheet
1
One source of truth. v1.1 deployed; second adopter exists.
Build
v0
Linkable from active applications. v1 in flight.

The portfolio isn't a description of the work. It is the work — staged, drawn, and assembled by the same practice it documents.