Niblet × Any coding agentThe coding agent UI checklist
The gate every agent-built surface should pass before you call it done.
Agents produce plausible UI at a remarkable rate. Plausible is not shipped. This is the checklist the niblet skill enforces — keep it next to every frontend task, whatever agent you use.
Set up
Grounded, not generic
The surface follows the product’s brief, tokens, and components — and real screens were consulted for the pattern. No card-grid default, no filler metrics, no fake activity.
Every state exists
Loading, empty, error, success, validation, and narrow/wide are implemented for states that can actually occur. Unreachable states are omitted.
Every control works
If a button is visible, it does the thing it says. No inert controls, no dead filters.
Rendered, not assumed
The changed surface was actually rendered at phone and desktop widths, interactions were exercised, and focus is visible. A passing build is not a rendered pass.
Evidence over taste
Review happens against the cited reference screens. Disagreements are settled by evidence from real products, not preferences.
The workflow
- Before
- Brief the job; pull references from the catalogue.
- During
- Implement hierarchy and states from the evidence.
- After
- Run this checklist; fix what fails; re-render.
The free local niblet skill bundles this workflow for your agent — install instructions in the docs.
Read the docsQuestions? Contact the project. Legal: Terms · Privacy