Making UI changes
The playbook your agent reads before it touches any UI.
What it does
A coding agent will change one button and reflow a page it never opened. This is the discipline that stops it: reuse before you create, add the story or capture in the same change, check the blast radius on anything shared, and prove the change with a visual test before calling it done. Wire it into your AGENTS.md / CLAUDE.md so the agent reads it on every UI change.
- Reuse before you create, so a near-duplicate component never drifts from its twin.
- Every state owes a story/capture in the same change, and the agent writes it, not you.
- Checks the blast radius on shared components, then proves the result with a visual test.
Install and run
npx skills add uiverify/uiverify --skill making-ui-changes# then invoke it
/making-ui-changesInstall these alongside it
Making UI changes runs these skills, so grab them too - or just install the whole bundle below.
Or install the whole bundle
npx skills add uiverify/uiverify
One command, any agent - Cursor, Codex, Copilot, Claude Code. Run npx skills update to pull the latest.
View on GitHubAutomate this skill end to end
UI Verify captures every screen on every pull request and lets an AI judge, or your agent, review the diffs. See how it works.