All work

Flagship · Open-source lab

Guardrails forAI-generatedUI

An open-source design-engineering lab for design-system contracts, governed generation, and deterministic reconciliation across Figma, code, and docs.

Aesthetic Function
Type
Open-source lab
Role
Sole author
Status
In active development
License
Apache 2.0
Patent
Filed, pending

01The shift

Generation is not the bottleneck. Alignment is.

AI can generate UI. It cannot keep it aligned. That sentence is the whole reason this lab exists.

Tools have made generation close to free. The expensive problem is keeping that UI in agreement with the system it belongs to, over time, while both sides keep changing.

02The thesis

Design systems need contracts, not just documentation.

A design system needs a machine-readable contract: a queryable description an agent can consult for the one decision in front of it, instead of being handed thousands of lines it cannot prioritize.

A queryable contract beats a documentation dump.

03The system

One contract, enforced at two moments.

The lab is an ecosystem of six open-source repositories built around a single design-system contract. A governance pipeline enforces it at the moment an agent generates UI; a reconciliation engine keeps every surface — Figma, code, and docs — aligned with it over time.

Concrete surfaces

npm install -g @aestheticfunction/ds-mcp
Install the reference MCP server (Node 20+).
ds-mcp --dspack ./your-system.dspack.json
Serve a design system to an agent as queryable tools.
af init --profile balanced
Generate config and choose a precedence profile.
af reconcile <file> / af status <file>
Reconcile a file or check its drift status.
af design drift --dspack <file>
Check every surface against a committed dspack contract.

04See it running

The whole pipeline, live in the browser.

dspack-studio is the reference application. An agent proposes an interface, the design system checks it, and invalid patterns are explained and repaired with the rule and its rationale on the record: dspack-gen governs the generation, dspack-emit compiles it to A2UI, AG-UI carries it, and Astryx renders it.

Every recording is a real run with its provenance attached. Rewind it, fork it, x-ray any element, and read the run’s receipt. Nothing there is staged.

dspack-studio replaying a governed run: the design-system gate checks S1, S2, and S3 pass, with the run scrubber, x-ray, and fork controls above the agent-generated recipe surface.

05The repositories

All six are open source under Apache 2.0, developed in the open.

Next case studyAIM DS