This demonstration includes loaded, loading, empty, and error states, keyboard focus, and mobile behavior.
Open source UI quality workshop
Your agent can build.
ADS runs inspection.
A design system your coding agent reads while it works. Put one screen through intent, context, rubric, evidence, and review until the pixels are ready to release.
The ADS line / 01–05
Watch the same screen
earn its release.
Scroll to advance the jobJob ticket / intent
Name the job before shaping the screen.
The first draft works, but it cannot tell urgent from ordinary. The job ticket locks one outcome: surface delayed orders before dispatch closes.
New on this screen
One job. One visible outcome.One user outcome · One operational priorityA working first draft. No priority, no recovery states, no mobile decision.
Fixture rack / baseline
Load context and every state.
Real nouns, constraints, references, and edge cases arrive before polish. Loading, empty, error, focus, and mobile become required.
New on this screen
Five required states before polish.Project context attached · Recovery states packedTolerance bench / rubric
Set the pass line for this screen.
The rubric turns taste into screen-specific thresholds: at-risk orders lead, targets stay generous, and the dispatch deadline remains visible.
New on this screen
A visible, measurable pass line.At-risk orders lead · 48px controls · 24px guttersLight table / evidence
Inspect pixels, not promises.
Phone, tablet, and desktop renders expose a failed mobile edge. ADS repairs and recaptures it before the artifact moves.
New on this screen
Three rendered viewports, one repaired failure.390 / 768 / 1280 captured · Axe · overflow · touch checkedRelease gate / review
Release it, or send it around again.
A separate review compares the rendered artifact with the job ticket. It clears release or sends the screen back.
New on this screen
A human verdict: release or revise.Human judgment stays in the loop · Revision remains a valid outcomeStart a run / MIT licensed