choose-uilisted

Select and justify UI interaction patterns from user intent, real constraints, accessibility, and product context. Use proactively while planning, designing, implementing, or reviewing an end-to-end service, app, website, dashboard, admin, ecommerce, SaaS, or frontend—even when the user only asks to build the service and does not name components—whenever the work will introduce or choose interactive UI for input, selection, filtering, view switching, actions, navigation, or settings. Also use for explicit control comparisons and behavioral UX audits where replacement is allowed. Do not use for backend-only, API-only, or database-only work; visual-only styling or token changes; or implementation where the interaction pattern is already fixed and review is explicitly out of scope.
ProgWon/choose-ui · ★ 0 · Web & Frontend · score 68

Install: claude install-skill ProgWon/choose-ui

# Choose UI Choose the smallest interaction that truthfully represents the user's task. Treat component choice as a product decision, not a styling preference. For a broad end-to-end product build, apply this workflow during planning before committing to interactive components. Do not wait for the user to name a dropdown, tab, filter, or other control. ## Workflow 1. Classify intent before naming a component: - **input**: collect a value for later submission - **filter**: change the visible dataset - **view switch**: change how the same content is presented - **action**: execute a command - **navigation**: move to another destination - **setting**: persist a product or account preference 2. Capture decision-changing constraints: - option count now and the credible maximum - single or multiple selection; Boolean or selection value - immediate or submit-time effect - comparison need, frequency, search, custom values, and rich descriptions - mobile, desktop, or cross-platform context - reversibility and cost of a wrong choice 3. Inspect the project's existing design-system inventory, component imports, and local usage. Read [references/design-system-adapter.md](references/design-system-adapter.md). If a suitable component exists, recommend its product name rather than inventing a generic primitive. 4. Apply the hard rules below and read the generated [references/selection-controls.md](references/selection-controls.md). Read [references/dec