System
Tokens, components and the rules between them. One definition for every surface, so a change in one place moves all of them.
Delivered as code, plus a documented PDF your team can read.
For SaaS and developer tools
Three products wearing one logo.
You have a marketing site, a docs site and a dashboard. They were built at different times by different people against different deadlines, and they disagree about what a button is, what an error sounds like, and whether a table row is clickable. Your buyer crosses all three in the first ten minutes.
The expensive version of this problem is not the inconsistency. It is that the dashboard, the part people pay for, is the surface nobody has ever designed, because every screen in it arrived as a ticket. Forty columns, no empty state, and an API key dialog somebody built in an afternoon.
Patterns a devtool actually needs
- Dense tables: sorting, filtering, 40 columns, 400k rows
- The state before there is any data to show
- Roles and permissions, and what a viewer sees instead
- API keys: created once, shown once, revoked loudly
- Errors that name the exit code and the fix
- Usage meters, quotas, and the mail before the overage
- Parity between what the CLI says and what the dashboard says
- The path from signup to first successful call
One system, three surfaces
The tokens are the same on the marketing page, in the docs and inside the product. Change one, and all three follow.
Where the work lands
- Marketing
- The cheapest surface to settle the system on
- Docs
- The same tokens, so the code blocks stop being a third brand
- Dashboard
- Tables, permissions, keys, quotas, empty states
- Shipped as
- Production components and a documented system
- Build rate
- $6,000 to $5,100 when the system is the studio’s
- Accessibility
- WCAG 2.1 AA in every build. Not a line item.
Most of you already have all three
Replacing surfaces costs more than building them: there is an audit first, a redirect map, and a brand somebody already signed off on to unpick. Replacements are priced separately.
What it costs
Every line item, pricedLaunch
$5,800composed line by line$5,300
You save $500
Brand core, marketing site and social kit.
Product
$11,300composed line by line$10,500
You save $800
Everything in Launch, plus the design system at the standard tier.
Everything
$16,400composed line by line$14,900
You save $1,500
Everything in Product, plus the build at the system-owner rate.
Start by finding out what’s wrong.
$500, five business days, a recorded walkthrough, a written action plan and a competitor table, and it comes off the project if you book one.