XConversionLab

Overview

This site. An internal project held to a deliberately unfair standard: it must demonstrate every philosophy the studio sells — systems over deliverables, honesty over polish, structure over decoration — because any gap between the pitch and the artifact is a credibility leak. The site is a rendering layer over PortfolioOS, the studio's internal operating system; content, facts, and case studies live as structured files, and the website is one interface to them. evidence: observed

Business context

A studio's own site is its most-scrutinized project: every prospect evaluates the work by first evaluating the storefront. It is also the studio's longest-lived project — designed to survive a decade and several visual generations without ever migrating content or breaking a URL.

Challenge

Agency sites decay on a two-year cycle because they entangle three things that age at different speeds: facts (never), content (slowly), and visual fashion (fast). The challenge was architectural: separate the layers so redesigns become reskins.

Strategy

Content-first, files-in-static-out. Every project is a structured document with constitutional frontmatter — ID, nature, evidence level, permissions — and the site renders what the files assert. The website can be rebuilt entirely; the record cannot be contradicted by it.

Decision making

Project nature in the structured data. Client, Internal, Concept, Research, Experiment — the label renders on every card and is emitted in JSON-LD, so neither a human skimming nor a machine quoting can mistake concept work for commissioned work. We believe honesty should be machine-readable.

Evidence levels as interface. Every case study declares whether its claims are measured, observed, or judgment — rendered as a visible tag. It's the studio's no-fabrication rule, compiled into the UI.

A closed motion vocabulary. One orchestrated moment (the thesis, on the homepage), one reveal pattern, one easing curve, full reduced-motion parity. Motion is where portfolio sites go to die fashionably; a closed vocabulary cannot date.

Visual identity

Warm paper, warm near-black ink, and one electric ultramarine that appears only where something is actionable or singular. Bricolage Grotesque carries the display voice; Hanken Grotesk carries the reading; JetBrains Mono carries the register — the monospace evidence layer of IDs, dates, and tags that runs through the whole site.

Development

Next.js 15 App Router with static export, TypeScript strict, Tailwind over a token layer, MDX content collections, deployed to Cloudflare Pages. Zero rented dependencies on the read path: no CMS subscription, no search SaaS, no analytics cookies.

Performance

Static HTML from the edge, self-hosted fonts, no third-party scripts on the critical path, and images that are honest artifacts rather than decorative weight. The colophon carries dated, tooling-named scores as they are measured.

Reflection

Building your own headquarters on your own operating system is the fastest way to find the OS's weak joints — several PortfolioOS rules were amended within weeks of this build starting. That feedback loop is the point: the site is simultaneously the studio's proof and its test bench.

Future improvements

The colophon will grow into a live systems page — published performance history, correction log, and the OS changelog in public.