11. Reviewing and improving design
When to use this flow
The two Skills answer different questions. Choose based on the question you are trying to answer.
| What you want to do | Question | Skill to use |
|---|---|---|
| Check whether a screen is easy to use | "Does this screen have any usability / accessibility issues?" | ywc-ui-ux-review |
| A screen feels bland or looks AI-generated | "Does this screen have distinctive character?" | ywc-design-renew |
| Build a completely new UI/component from scratch | Neither of the above - this is new creation | Use a UI creation Skill outside this Guidebook's scope |
ywc-ui-ux-review - Usability / Accessibility audit
Combines static code analysis with actual UI execution (Chrome DevTools MCP) to audit Information Architecture, Visual Design, Usability, and Accessibility (WCAG 2.2 AA). The result is a four-level report: Critical / High / Medium / Low.
ywc-ui-ux-review Check the usability of the payment screenywc-ui-ux-review Check the usability of the payment screenBecause live UI exploration is included, results are more accurate when a staging or preview URL is available.
ywc-design-renew - Visual De-slop & Renewal
Use this when an existing screen is ordinary or feels "AI-generated." It adds visual character or checks for AI-slop tells such as gradient text / cyan-on-dark / Inter / uniform card grids.
Code renewal (default mode)
ywc-design-renew --target setup-collection/default-project/docs/design/README.md --url http://localhost:3000ywc-design-renew --target setup-collection/default-project/docs/design/README.md --url http://localhost:3000Check only, without touching code
ywc-design-renew --mode check --target setup-collection/default-project/docs/design/README.md --fail-on highywc-design-renew --mode check --target setup-collection/default-project/docs/design/README.md --fail-on highIf you pass --url, Before/After screenshots are also provided. If omitted, it proceeds with code analysis only, which is less accurate. --fail-on is the gate threshold for check mode, and defaults to critical.
New creation is not what these Skills are for
ywc-design-renew is only for renewal of existing screens. UI/components built from scratch are better handled by a dedicated UI creation workflow, not the ywc-* review/renewal flow in this Guidebook. You cannot "de-slop" something that does not exist yet.
Previous: 10. E2E Test automation strategy - Next: 12. Debugging and incident postmortems