An Operational Dashboard, Not a Landing Page

coquina.studio has exactly one user. Me. It still ships focus traps on every modal, ARIA dialog semantics, and a keyboard path to every card, tile, and graph node on the page. I built a full accessibility layer for an audience of one — and I'd do it again.

But start with what the product isn't. There's no marketing landing page. No hero headline, no three-tier pricing table, no "Get started free." The login screen is the front door, and I decided that was the whole front door there needed to be.

The funnel is the thing you build first, and that's the trap

Every product has the same gravitational pull: build the funnel before you build the thing. Write the pitch, stage the screenshots, wire up the waitlist — all before the instrument that's supposed to justify any of it actually works.

Coquina is memory for AI agents. The dashboard's job is to tell me what that memory is doing right now — what's moving through, live, on the event stream. That's an operator's job-to-be-done, not a visitor's. "Convert this stranger" and "show this operator the truth, fast" are different products with different first screens. I built the instrument first. The funnel can wait until there's someone at the other end of it.

The user is an operator, not a visitor

For ten-plus years I shipped production interfaces for people who were on the clock — Wegmans, Walt Disney World, AB InBev, native iOS and Android. The user was never browsing. They were mid-task, often mid-shift, and the interface's only real job was to get out of the way of the work.

This is that same discipline, pointed inward at a tool I alone operate. The operator watching live infrastructure doesn't want to be delighted. They want to know what the system is doing this second. Every decision below falls out of that one sentence.

One file, because there's one hand on the wheel

The whole design system lives in a single file, primitives.tsx. Button and IconButton with responsive touch targets — 44px tall on mobile so a thumb can hit them, 32px on desktop where the cursor is precise and density matters more than reach. Card. Skeleton and SkeletonRows that shimmer while data loads. EmptyState for when there's nothing to show yet.

Nothing hardcodes a color or a size. Everything reads from tokens — --surface-2, --text-tertiary, a light theme I call Coquina Dawn; Fraunces for display, Inter for the UI, JetBrains Mono for numbers, because numbers you scan should line up in a column. One file is a decision, not laziness. One operator, one source of truth, no drift.

The bug only a designer-who-codes would catch

Here's the call I'm proudest of, and it's invisible. The layout responds to CSS container queries, not viewport media queries.

The reason is specific. Collapsing the sidebar changes the content area by about 160 pixels — but it never trips a viewport breakpoint, because the window didn't change size. A page wired to the viewport keeps rendering its wide layout into a space that's now narrow, and it looks broken. Container queries make every page respond to its own actual width, not the window's. The sidebar collapses, the content re-flows honestly, and nothing lies about how much room it has. You only catch this bug if you both design the thing and write the CSS.

Readability is a sweep, not a setting

The first pass used cramped, fixed-height grid rows, and dense data hated them — content got clipped, everything fought over the same few vertical pixels. So I tore them out for stacked layouts: a metadata row on top (id, type, project, time), then the actual content below on as many lines as it needs, with a line-clamp so nothing runs away. On mobile the grid headers hide entirely. Legibility over grid purity, every time.

Accessibility for an audience of one

Back to the focus traps. Modals trap focus and announce themselves as dialogs. Cards, KPI tiles, and graph nodes all get role="button", a tab stop, and keyboard handlers. Filters carry aria-pressed, nav carries aria-current, state changes get announced, focus-visible rings show up for anyone driving by keyboard. There's a Cmd+K command palette and an SSE feed pushing memory events in real time — all of it React, Vite, Tailwind, lazy-loaded, deployed on Vercel.

None of that accessibility work has an audience. I did it anyway, because craft is a habit, not a headcount. The day I ship sloppy work for myself is the day I start shipping it for everyone.

The hardest thing enterprise design taught me wasn't how to build the funnel. It was the restraint to build the instrument instead — and to build it as if someone were watching, even when the only someone is me.