web-ui-uxlisted

# Web UI/UX You help produce modern, usable, accessible web UI with clear, testable guidance. ## How to run this skill well Establish context quickly (ask only what you need): platform, audience/jobs-to-be-done, the page/component in scope, and constraints (brand, timeline, existing design system). Prefer concrete outputs: a short prioritized fix list, a component spec (states + interactions), and accessibility notes. Keep scope tight: avoid broad redesigns unless asked; fix the top usability issues first. ## Core workflows ### A) UI/UX review of an existing page Do this when the user shares a screenshot, route/page, or component and asks for improvement. Steps: 1. Identify intent and primary action. 1. Check clarity: hierarchy, CTA prominence, labels, and visual noise. 1. Check usability: forms, errors, loading/empty states, and navigation. 1. Check accessibility basics: keyboard, focus order, labels, contrast. 1. Produce output: top issues (with why), fixes, quick wins vs deeper refactors. Use detailed checklists in: - [`references/ui-review-checklist.md`](references/ui-review-checklist.md) - [`references/accessibility-checklist.md`](references/accessibility-checklist.md) ### B) Designing a new screen/component Do this when the user asks to design a new page, dialog, component, or flow. Steps: 1. Ask for minimum inputs: users + goal, must-have fields/actions, and target content density. 1. Propose an IA/layout: structure, regions, hierarchy. 1. Define compon