systemix docs

For designers

How Systemix works for designers — rationale that survives handoff, a drift feed, and Figma as an optional bridge.

What Systemix does for you

Your design rationale becomes part of the system itself. Why the radius is 0.5rem, why the primary is a neutral charcoal — each is an MDX record next to the token's canonical value (see a real one), readable by engineers, agents, and future-you. Rationale stops dying in Figma comments and Slack threads.

And the system watches itself drift: a report scores how far the shipped product has diverged from the contract — hardcoded colors, off-scale spacing — and every audit lands in the memory feed with the top offenders named and the trend over time. Drift becomes a feed you review, not a surprise in next quarter's audit.

Your 10-minute start

  1. Read the contract. Open /contract — the records index is the design system as an object: tokens, components, decisions, memory.
  2. Clone a brand (session one). Systemix scrapes a live site and proposes a globals.css diff mapping its colors, type scale, and radius to tokens — a reviewable diff, not a redesign. This is the sprint's first hour.
  3. Run a drift audit. /drift-report in Claude Code, or press play on Drift Report in the Home dashboard — the score and offenders land in the memory feed.
  4. Figma, when you want it. Tokens are canonical in code, so nothing depends on design tooling — but /tokens and /sync-to-figma bridge Variables both ways when you're ready.

Your weekly loop

  • Review the drift feed: is the score trending the right way? Which offenders keep reappearing?
  • Drift resolutions queue as decision cards — approve the fix or record the exception, and the call is written down either way.
  • When an experiment touches a surface you own, its file names the variant and the reasoning — read it before redesigning.

Where next

On this page