ui-designlisted
Install: claude install-skill idaibin/skills
# UI Design
## Overview
Design a concrete product surface from verified facts and hand it to `dev-frontend`. Default to the smallest **Feature UI** profile for one page or flow. Activate the **Design System** profile only when shared tokens, component semantics, variants, or the product-wide visual language must change.
## Workflow
1. Read effective repository guidance and run `git status --short` before planning an authorized artifact write.
2. Fix the target page or flow, audience, user job, facts, available actions, required states, platform, existing UI owners, evidence gaps, and forbidden inventions.
3. Select one profile:
- **Feature UI (default):** produce the visual and interaction solution for one page or flow, including relevant wireframes, high-fidelity views, interaction states, responsive behavior, and a bounded `dev-frontend` handoff.
- **Design System (conditional):** load shared-system artifacts only when the requested surface changes reusable tokens, component semantics, variants, or the overall visual language. Keep one accepted owner and preserve rollback when changing it.
4. Inspect only the current screenshots, routes, components, tokens, DTO-shaped product facts, and scoped references needed for the selected profile. Mark missing evidence `Not found` or `Not verified`.
5. Give every external reference explicit source, rights status, `use`, and `ignore` constraints. A reference never authorizes copying brand, content, or functionality.
6. Define