30 Jun 2026 · 7 min read

How I Built This Site With AI (I'm Not a Designer)

I can't kern, I don't know what a French curve is, and my last design decision was "Bootstrap, I guess". This site looks like an agency built it. Here's exactly how, and what it says about the job of an architect now.

aisveltekitmeta

Let’s get the confession out of the way: I am not a designer. My aesthetic history is Bootstrap defaults, a brief flirtation with Material UI, and one internal dashboard so grey that a colleague asked if it was in mourning.

And yet — look around. Editorial typography, a coherent palette, charts that animate in from the page margins. If this site landed in your inbox from a design agency, you’d pay the invoice. The whole thing took me a handful of evenings, pairing with an AI coding agent.

That gap — between what I can design and what I can now direct — is the most interesting thing happening to my profession. This post is the build story, kept honest.

The stack, for the curious

SvelteKit with static prerendering, mdsvex so I can write posts in Markdown but drop live Svelte components into them, D3 for chart math with Svelte owning the DOM, and hand-rolled CSS on a token system. No component library, no Tailwind, no template. Every chart on this site is an SVG built from scratch — which sounds like showing off until you realise I didn’t build them alone.

This is a live component. The artwork is deterministic — seeded by the text. Try your own name.

The thumbnail art on the writing index? Generated from each post’s slug — same seed, same constellation, forever. That margin visual is the actual component with an input wired to it. This is what mdsvex buys you: a blog post that can hand the reader the controls.

What the collaboration actually looked like

The useful mental model: I hired an infinitely patient design-literate pair programmer, and I behaved exactly the way I do with human engineers.

  • I owned the brief. “Dark, editorial, typography-led, inspired by wattenberger.com, must feel like data is the decoration” — that sentence did more for the outcome than any prompt engineering trick.
  • I reviewed everything. First draft of the palette had four accents fighting for attention. I said what a design reviewer would say — “too loud, pick a hierarchy” — without knowing how to fix it myself. Knowing what’s wrong turns out to be a separable skill from knowing how to fix it.
  • I asked for reps. Three hero options, two chart animation styles, dial the grain down, again, again. Iteration is free now. Taste is the bottleneck.

Here’s the effort curve across the build, and the annotation is the honest part:

05101520ev 1ev 2ev 3ev 4ev 5ev 6ev 7taste kicked in
my hours what shipped (components)

Evening three is where it stopped being “generate me a website” and became a design review loop. My hours went down while output went up — not because the AI got better, but because my feedback got sharper. Which is precisely what happens when a good mid-level engineer and a decent coach find their rhythm. I’ve run that loop forty-odd times with humans. The skills transferred completely.

The part that matters for hiring

If you’re a recruiter or a hiring manager, here’s the transferable claim, stated plainly:

The job of an architect was never “knows the most”. It was always “can direct capability toward an outcome, and can tell good from plausible.” AI just raised the stakes on both halves.

Every failure mode I’ve watched in AI-assisted engineering is an old failure mode wearing a new badge. Accepting plausible-but-wrong output? That’s rubber-stamping a design review. Prompting without context? That’s the architect who emails requirements and skips the whiteboard. The teams that thrive with these tools are the ones that already knew how to brief, review, and coach — and that is learnable, because it’s what I teach.

<!-- The reveal-from-the-margin trick, reduced to its essence.
     I reviewed this code the way I review a junior's PR —
     and it got better for the same reasons. -->
<div use:inview={{ onchange: (v) => (visible = v) }}
     class="reveal" class:visible>
  <LineChart {series} />
</div>

The honest ledger

What the AI brought: fluency in CSS I’ll never have, a thousand small design conventions, tireless iteration. What I brought: the brief, the taste, the “no”, the domain content, and eighteen years of knowing what production-grade looks like. Neither of us ships this site alone.

I’m not a designer. But I am, apparently, a design director now — the same way I’ve been an engineering director-of-sorts from inside the codebase for years. The tools changed. The job, gloriously, didn’t.


Site source will be on my GitHub once I’ve stopped fiddling with the grain opacity. So, never.