← All work

Nova design system · Aug – Oct 2026

Nova: one system for prototypes and production

The company's design system was abandoned except in one admin area; designers worked in Figma and engineers rebuilt from screenshots. I rebuilt it to parity in Lit and React and turned it into the shared repository where designers' prototypes become production code.

Role
Design-system lead
Period
Aug – Oct 2026
Stack
LitReactdesign tokens (light-dark())StorybookLucideVitestPlaywright
components
126
components
parity specs
120
parity specs
layers: Lit + typed React
2
layers: Lit + typed React
commits in 16 days
332
commits in 16 days

The platform shipped three separate component libraries and the design system used by none of them. In August I brought Nova to full parity with a modern base set, 63 components in both Lit web components and typed React wrappers, with semantic tokens as light-dark() pairs, a theme factory, Lucide icons, a shared overlay primitive with focus management, and a Storybook where every component has a parity story across variant, size and state in light and dark.

From components to patterns

In October the program widened: Nova must cover every component of the standalone AI app, the service-management extension, the platform and AI Studio. Four waves closed the gaps to zero in every product; then came the app-shell patterns, list views with folds that collapse into stacked rows, data grids, a graph canvas and flow editor, record forms from schema, and a floating chat panel. Each wave was built, reviewed by a second model, fixed and re-reviewed before it merged.

List view pattern: saved filters, bulk actions, status, pagination.
List with preview: approve without leaving the list.
Graph canvas: AI step, switch, loop, error path.

Designers in the repo

The point was never the components. Designers now open the same repository with Claude Code, build living prototypes on Nova, and send small production changes through engineer review; PMs can prototype in the same place. The sessions I ran started with the basics, Git, branches, commits, then Claude Code practice. Convergence between what is mocked and what ships is now a path rather than a wish.