skills/ui-ux-design/iterating-ui-improvements/SKILL.md
Iteratively audit and improve an existing web interface with Chrome DevTools by planning, implementing, validating, and locally committing one evidence-backed UI/UX improvement at a time. Use only when the user explicitly invokes `$iterating-ui-improvements` or names it to request an autonomous audit-fix-commit loop.
npx skillsauth add narumiruna/agent-skills iterating-ui-improvementsInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
Use only after explicit invocation. That invocation authorizes an audit-fix-commit loop with in-scope local edits, validation, and local commits; it does not authorize remote or destructive actions.
Accept an optional URL, user flow, page scope, stopping mode, and iteration limit. Prefer invocation details. Otherwise inspect repository instructions, application documentation, configuration, existing start commands, tests, and design-system conventions to infer one local site and primary flow. Ask one question only when multiple targets remain plausible.
Require all of the following before changing files:
Stop and report the blocker when a prerequisite fails. Do not substitute another browser tool silently, guess credentials or product intent, or alter data to gain access.
Determine whether the target is already running. If this run starts it, record process or job ownership needed to stop its server and child watchers later; do not claim ownership of a pre-existing target.
substantial (default threshold): continue while there is an evidence-backed, medium- or high-value problem affecting task completion, usability, or accessibility. Stop rather than pursue low-impact polish or subjective taste.exhaustive: also address low-impact UI problems when they are concrete, evidence-backed, and verifiable. Do not pursue unsupported subjective preferences.fixed N: apply the specified positive iteration cap to the active finding threshold. If no threshold is named, use substantial. Stop earlier only when no finding meets the active threshold, and report known remaining findings when the cap is reached.There is no iteration limit by default. A user may set a positive limit with either threshold; the limit applies to the active finding threshold. Never interpret an omitted limit as five or another implicit cap.
If successful hooks changed the tree, treat their committed result as unverified and rerun affected checks and Chrome DevTools verification against the committed content. Accept it only if those checks pass. If they fail, restore the recorded validated tree, revalidate it, and create a clearly labeled recovery commit without rewriting history; verify that recovery commit's tree, then stop and report both commit IDs. If restoration or the recovery commit cannot be completed safely, stop and report the exact branch, index, and worktree state.
If commit creation fails, preserve the hook or error output and re-inspect the index and worktree. Do not bypass hooks with --no-verify. Correct only an in-scope cause, rerun affected checks and Chrome DevTools verification when files changed, then retry. If a valid commit still cannot be created safely, unstage the exact iteration paths and apply the failure recovery below.
Repeat from the observed post-commit interface rather than reusing stale findings.
If implementation cannot pass its checks within the current coherent scope, or a valid commit cannot be created, unstage the exact iteration paths, restore only the current iteration's uncommitted tracked changes, and remove only files created during that iteration. Preserve every earlier successful commit. Do not reset, amend, rebase, or otherwise rewrite prior commits. If safe restoration cannot be proved or completed, stop and report the exact index and worktree state.
Stop when the active finding threshold is empty, a fixed or explicit limit is reached, Chrome DevTools or tests are blocked, commit creation fails without a safe in-scope correction, a required product decision is missing, safe work would expand scope, or restoration fails. Do not push, open a pull request, deploy, mutate remote services, perform destructive data operations, or broaden the target without separate explicit authorization.
Before every exit, including success and blocked or failed paths, terminate and wait only for target processes started by this run and their child watchers. Preserve a target that was already running. If owned-process cleanup fails, report the remaining process and port evidence rather than stopping unrelated processes.
Report each iteration's plan, commit ID, and validation evidence, followed by the stopping reason, cleanup result, and any known unaddressed findings. Distinguish verified outcomes from untested states or assumptions.
development
Score or compare one or more agent skills across trigger clarity, workflow actionability, safety boundaries, verification rigor, incremental knowledge value, and leanness. Use only when the user explicitly asks for ratings, numerical quality scores, rubric-based scorecards, or scored comparisons; use creating-agent-skills for unscored reviews or revisions.
development
Assess or improve an existing codebase's architecture when the user asks about module boundaries, coupling, scattered ownership, testability, change locality, deep modules, seams, or behavior-preserving structural refactoring. Use for cross-module design rather than ordinary diff review or a confirmed edge-case bug fix.
development
Perform read-only security audits, vulnerability assessments, or threat-focused reviews of diffs, pull requests, code paths, or explicitly scoped repositories when security is the primary objective or acceptance criterion. Use reviewing-code for ordinary review with baseline security coverage and hardening-code-paths for fixing confirmed findings.
development
Run iterative multi-reviewer panels over a code diff, verify their findings, apply explicitly authorized fixes, and re-review the updated change until it passes or reaches a stopping condition. Use when the user asks for a panel loop, multi-model code-review consensus, or a review-fix-re-review cycle.