Case study · Design system · Sprinto 2025–26
A design system is an organizational decision system
You can't build an AI-native product on an inconsistent platform. Before the intelligence came the foundations, and the rules about who decides what.
Results
What changed, labelled by how it was verified.
The real problem
NPS analysis, support tickets, customer calls and session recordings all said the same three things.
- The product's strength was invisible. Sprinto's monitoring and GRC model was genuinely advanced, but customers couldn't see how risk, policy, monitoring and evidence connected.
- It didn't look enterprise-ready. Against much older platforms, our answer couldn't be more flexibility. It had to look and work simpler while solving the harder case.
- UX problems were information-architecture problems. The People area alone had seven tabs, row clicks that behaved differently from button clicks, and drawers stacking on drawers. Not bugs. Design debt.
Underneath sat a second problem. Most design-system arguments look like taste and are actually about jurisdiction. Two designers disagree about a button colour. Neither is wrong. What's missing is a rule about which layer gets to decide.
The stack
Five layers, each with a clear job and an honest status.
| Layer | What it decides | Status |
|---|---|---|
| Constitution | Which layer decides what, and the order for settling conflicts | Written, version 0.1 In progress |
| NeoGrid | Tokens, components and accessibility contracts | 92% coverage Shipped |
| RedPill | How people do complex work, including agentic patterns | Framework written, prototype built In progress |
| Datum | Proves the architecture in code before asking a team to adopt it | Reference build, not shipped In progress |
| Forge | Where ideas get tested without leaking into the system | Defined, nothing shipped Target |
One rule governs all of it: a lower layer may specialise a higher layer, but must never silently contradict it. The word doing the work is "silently." Contradiction is how systems evolve. Contradiction without a marked, reasoned deviation is how they rot.
Three decisions
Write down the order for settling conflicts
The Constitution ranks five things: safety and accessibility, then usability, then consistency, then brand coherence, then local preference. With the order written down, "what do we prefer?" becomes "which layer decides?", and that question has an answer.
It comes with a companion rule: when a brand expression weakens usability, translate the brand's intent instead of copying its visual treatment. Brand colours enter the system as raw values only. Product behaviour resolves through meaning-based tokens, so brand presence is never a reason to colour an interactive element.
Trade-off: the brand team gives up some direct control, in exchange for a rebrand that the product can survive.
Specify AI UX as behaviour, not a visual style
For a compliance product, trust is the product. So RedPill defines how an agentic action behaves across nine stages, and the last four are where trust is decided:
- Signal
- Analysis
- Recommendation
- Action
- Approval
- Execution
- Verification
- Evidence
- Recovery
Every AI surface also declares one of five automation classes (informational, suggested, auto-executable, approval-required or blocked), and the class decides the interface. Every pattern must document its trust model: evidence, source, timestamp, confidence, history and whether it can be undone.
Trade-off: slower pattern work, and some exciting demos ruled out. We refused the sparkle, the glow and the magic button.
Prove the architecture in code before proposing it
Datum is a reference build of the architecture I'm proposing for NeoGrid. One file per component generates five artifacts: the registry entry, the human docs, the docs for AI agents, the contract for UI an agent assembles live, and the tool manifest. The build fails on drift, on raw colour values, and on text that fails contrast.
Next to it, Forge was designed together with its containment. An internal design studio tends to grow a second, undocumented design language. Four promotion gates, each defaulting to no, stop that from happening.
Trade-off: time spent building something that isn't the shipped product. A proposal can be argued with. A failing build can't.
What changed
NeoGrid reached 92% coverage against a 90% target, with 51+ components and a 25% faster implementation time. 12+ AI patterns now live in the system as components, not conventions. And the People area was rebuilt around one rule: reduce the number of decisions a user has to make.
| Area | Before | After |
|---|---|---|
| Navigation | 7 tabs in one area | 3 tabs |
| Editing | Drawers stacking on drawers | One template modal for every edit |
| Bulk work | Row by row only | Bulk actions in tables |
| Monitors | Scattered across the area | Consolidated into member detail |
| Support | Recurring tickets | Tickets resolved without code changes |
What didn't work yet
Coverage is not the same as reuse. The real test is whether an independent team can apply a pattern in a second workflow without us in the room. That review runs in January 2027.
The Constitution has the same gap. A constitution with no record of settling a real dispute is a PDF. The measurement that matters next is the first time its conflict order settles an argument in one meeting instead of three.