improve-ui

Audit a product surface against its design system and write implementation plans for verified UI problems.

1|Updated Aug 31, 2026
One-click install
npx skills add https://github.com/gagandeepgill/puzzle-game --skill improve-ui-gagandeepgill
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: improve-ui
Source: https://github.com/gagandeepgill/puzzle-game/tree/main/.claude/skills/improve-ui
Command: npx skills add https://github.com/gagandeepgill/puzzle-game --skill improve-ui-gagandeepgill

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? UI reviews often produce subjective opinions, unsupported nitpicks, or sweeping redesigns that ignore the existing design system. This Skill audits one coherent product surface against the design evidence that actually governs it, keeps only findings proven by contract, runtime path, and a deterministic correction, and turns selected findings into self-contained implementation plans another agent can execute. ## Core Features & Use Cases - Evidence-gated auditing: Traces the rendered path through routes, layouts, components, variants, and tokens, then requires contract, runtime, and correction proofs before any finding is reported. - Design-system reconstruction: Reads DESIGN.md and surface-local documentation, resolves token aliases and variants, and records governing owners and documented exceptions. - Plan generation for handoff: Writes one self-contained plan per selected change using a structured template covering evidence chain, reuse, scope, validation, and stop conditions, while never modifying product source. - Use Case: Ask it to review your app's settings surface; it reports at most three verified findings ranked by confidence and impact, then drafts an implementation-ready plan only for the finding you choose. ## Quick Start Use the improve-ui skill to audit the primary product surface, report supported UI problems, and recommend what to improve first without changing any code.

Frequently Asked Questions about improve-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit a UI against its design system with an AI agent?▼

Invoke the skill with a scope such as one deployable application and one surface family. It traces the rendered path through components, variants, and tokens, reconstructs the governing design rules, and reports only findings backed by contract, runtime, and correction evidence.

What kinds of UI problems does a design audit skill report?▼

It reports token, typography, color, spacing, layout, copy, component-variant, and responsive-presentation violations of documented design rules. It discards functional bugs, accessibility issues, performance, and code-quality findings unless you explicitly request them.

Does the skill modify my product source code?▼

No. The skill is strictly read-only on product source and never installs dependencies, runs formatters, commits, or pushes. It creates or edits files only under the design-plans directory, and another agent executes those plans.

When should I not use an evidence-gated UI audit?▼

Avoid it when you want a full redesign, a new visual identity, or functional bug fixes, since it preserves the existing identity and rejects behavior-level findings. It also requires rendered or user evidence for subjective judgments like hierarchy, density, or usability.

How many findings does the audit report and what happens next?▼

It reports at most three findings ranked by confidence, user impact, reach, and correction cost, then names the single highest-leverage improvement. After you select a finding, it writes one self-contained implementation plan per selected change using its plan template.