Typography, stack, and the method.
This site is an exhibit of its own methodology. It was planned, built, reviewed, and tested by the same five-agent pipeline described in Chapter 03.
Pipeline record: how this site was built
Our multi-agent framework runs every chapter through five roles. The Planner drafts an ordered ticket list; the Context-Fetcher pulls the catalog quotes each ticket will need; the Feature-Builder writes the TSX; the Code-Reviewer scores confidence; the Test-Writer runs builds and keyboard-only click-throughs. Below is the actual pipeline record for this build.
Read the approved plan file, broke the site into six chapter tickets (cover + 5 chapters + index + colophon) and one data-layer ticket.
Pulled quotes, revenue figures, and product descriptions from TOOL_CATALOG_AND_MARKET_ANALYSIS.md. Flagged the 41-product schema and the four-module platform consolidation.
Implemented the typed catalog layer (Zod), the FootnoteProvider, the chapter system, the 41 product pages, and this colophon.
Verified every footnote maps to a §-reference; checked WCAG 2.2 focus rings, prefers-reduced-motion gates, and semantic <aside>/<dialog> usage.
Ran pnpm build to confirm every /catalog/[slug] is statically generated; confirmed dev click-through and keyboard-only footnote activation.
Architecture: how the content flows
Everything on this site derives from a single typed source. The catalog is validated at module load; chapters read it at build time; product pages are pre-rendered; the A–Z index aggregates. No content lives in a CMS, a database, or a markdown blob outside this repo. The tradeoff is deliberate: every claim is traceable, every product is round-trippable, and a catalog update triggers a single rebuild that re-validates everything downstream.
Single source of truth. 41 products with Zod-validated frontmatter: code, title, tier, domain, readiness, utility, capabilities, stack, revenue projections, concept tags, chapter refs.
Server components call listProducts(), productsByTier(), or getProductBySlug() at build time. Claims in body prose cite the catalog by §-reference via <Footnote>.
/catalog/[slug]/page.tsx uses generateStaticParams() to pre-render all 41 products at build. Every product is a real HTML document, not a client shell.
pnpm build produces a fully-static output (except the footnote overlay, which is client-hydrated). Deploys in ~30s; no database, no runtime content fetch.
Deployment
Vercel, Next.js App Router, static generation for the cover, every chapter, and all 41 product pages. No database, no runtime content fetch; the catalog compiles in. The only client JavaScript is the footnote overlay; everything else is streamed HTML.
Technical Notes
- Serial naming: Every product in the catalog carries a WBI-### identifier assigned in order of first appearance in the source document. Client prefixes (present in the internal repository) have been retired from the public-facing catalog. Some archived items retain their internal codenames in body prose where historically useful; none appear in titles or URLs.
- Fonts: Literata and Inter substitute for the spec’s Tiempos / Neue Haas Grotesk because those are paid families. Literata was chosen over nearer neighbors (Fraunces, Newsreader, Source Serif 4) for its warmer, less-mannered letterforms at poster scale.
- MDX: Chapter bodies are authored in TSX with shared
<Footnote>/<Marginalia>/<PullQuote>components. An MDX loader is swappable as a single-file change; the semantics and component surface are identical. - Next.js major version: The build targets Next 16 because every 15.x release carries an unpatched advisory (CVE-2025-66478) that Vercel actively blocks at deploy time. The App Router APIs we use are stable across the major.
- Scroll-driven type: Implemented with CSS
animation-timeline: view(), which ships in evergreen Chromium and degrades gracefully in Safari/Firefox to a static display. - Catalog source: Every product, platform, technology, and concept on this site is validated against Chapter 02, which is itself sourced to a continuously updated TOOL_CATALOG_AND_MARKET_ANALYSIS.md.