All work

Enterprise · In production at Questel

An agent-readabledesign systemin production

At Questel, I originated a direction for serving design-system knowledge to the agents writing frontend code, so their output starts on-system instead of being corrected into it.

AIM DS
Type
Enterprise design system
Owner
Questel
Role
Originated the direction
Context
Regulated enterprise
Stack
Vue 3 · MCP · Code Connect
Status
Public-safe draft

01The problem

Agents produce plausible UI, not on-system UI.

In a real enterprise design system the failure mode is specific. A frontend agent generates something that looks right, a card, a form, a dialog, but it is not the system’s card. A wrong token. A component the team retired. A pattern ruled out months ago. Plausible and off-system at the same time.

At enterprise scale that gap is expensive. Every off-system component is rework, a review comment, or a slow drift someone pays for later. The agent is not careless; it simply does not have the system’s decisions in a form it can use at the moment it writes the code.

02What I originated

An agent-readable design-system direction.

At Questel I originated the direction for AIM DS: treat the design system as something an agent can query, not just something a human can read.

AIM DS is Questel’s. What I originated is the direction, the architecture of how that design system is served to agents, and the human-in-the-loop workflow around it.

Serve the system as queryable context, not a wall of docs.

03The shift

From post-review correction toward correct by first draft.

The old loop corrects after the fact: the agent produces off-system UI, a reviewer catches it, someone fixes it. That loop is slow and scales badly.

The shift AIM DS aims at moves correctness earlier. If the agent can query the system before it writes, the first output starts closer to on-system, and review becomes governance rather than cleanup.

04The system shape

How it is put together, and governed.

AIM DS sits on a Vue 3 and Vuetify component system. The design system’s knowledge is served to agents through MCP, and Figma Code Connect ties the design source to the coded components so the same definitions hold across design and implementation.

The stack and gate

Vue 3 + Vuetify
The component system AIM DS sits on.
MCP
Serves design-system knowledge to agents as queryable context.
Figma Code Connect
Ties the design source to the coded components.
Human-in-the-loop review
Governance gate: a person owns what ships.

05Why it matters

The in-the-job proof.

When generation is cheap, the expensive part is keeping output on-system at scale. AIM DS is the proof that an agent-readable design system holds up inside a real, regulated enterprise, under real constraints, with real review and governance.

The payoff is less rework, frontend output that starts on-system, and a design system agents respect because they can query it.

Note

Public-safe draft. It describes direction, workflow, and intent at a level that avoids proprietary detail. Internal specifics, enterprise assets, and private screenshots are intentionally omitted pending review.

Next case studyFactGem