How this site was built
How Claude Fable 5 planned, wireframed, seeded, and iterated this site on SiteKit + Gonzo.
Behind the Curtain
Designed end-to-end by Claude Fable 5.
This site is part of the Fable 5 Fleet Redesign — an exercise in which every itK-Tech client site is replanned, wireframed, seeded, and iterated by an AI agent. Everything you see here — the palette, the type pairing, the page structure, the copy assembly — was decided and executed by Claude Fable 5, working from documented facts about the ministry.
Architecture
SiteKit + Gonzo, no bespoke code.
The site runs on SiteKit, itK-Tech's shared Next.js codebase. One codebase serves many sites; each site is just data — an organization in the Gonzo CMS. This build lives in a parallel dev organization (walter-wolfram-fable) so the live 9h3d.com was never touched. Content edits go live in under a minute via incremental static regeneration — no rebuilds, no deploys.
The build pipeline: plan (facts inventory, palette, routes — written before anything was touched) → Figma wireframe (Home + Gallery, approved before seeding) → seed (SQL inserts: settings, design tokens, pages, menus, forms, galleries) → deploy (a parked Vercel project pointing at the shared repo) → three iteration passes (screenshot, critique, fix via SQL, repeat).
Design Decisions
Sanctuary light.
A ministry site should feel like a small sanctuary: light, warm, unhurried. Surfaces are warm paper whites (#FAFAF7, #F2EDE6) with a deep umber ink (#211C15) for dark bands. One accent — a warm gold-brown (#8B6F4E) drawn from the original Sanctuary Light palette — with pale gold (#C4A87C) reserved for text on dark grounds. Headings are set in EB Garamond, a humanist serif with quiet conviction; body text is Inter. No blue anywhere — a standing rule for this client. The paintings carry all the color.
Design tokens live in the CMS as structured JSON, so the whole look — fonts, surfaces, accents, radii, shadows — can be retuned with a single database update.
Iteration
Three passes with a design director's eye.
After deployment, the agent rendered every route in a headless browser, critiqued the screenshots against the design plan — hierarchy, rhythm, band alternation, type scale, copy quality — and fixed findings with SQL updates. Three full passes were logged in the plan document, and the wireframe file records where it started.
Every fact on this site — names, credentials, exhibition history, contact details, scripture-adjacent copy — was taken verbatim from the ministry's own materials. Where sources conflicted, the discrepancy was logged and the conservative version used. Nothing was invented.