namht-design-reviewlisted

# namht-design-review — UI/UX + accessibility review Catch design problems an LLM-built UI tends to have. Works on a **live URL** (preferred — real screenshots) or on **frontend code/components**. ## Inputs - A **URL** (local/staging) and/or the **frontend code** (components/pages). For a URL, use the **Claude-in-Chrome MCP** to navigate + **screenshot** each key screen (desktop + a mobile width). - Any **design system / UX rules** in the KB (`12-conventions`, a `design`/`ui` doc, tokens) — use as the standard; otherwise apply general heuristics. ## Review dimensions (cite the screen/component + screenshot/file) 1. **Visual consistency** — spacing scale, alignment, typography hierarchy, color/token use; does it match the design system or look like inconsistent "AI slop"? 2. **Layout & hierarchy** — is the primary action obvious? clutter? grouping? empty/loading/error states present? 3. **Responsive** — does it hold at mobile width (overflow, tap targets, wrapping)? 4. **Accessibility** — color contrast (WCAG AA), image `alt`, form labels, focus order, keyboard operability, ARIA roles, semantic HTML, motion/reduced-motion. 5. **Microcopy** — clear, consistent, not placeholder/lorem; error messages helpful. 6. **Interaction** — hover/focus/disabled states; destructive actions confirmed; feedback on action. ## Output (dual-audience; save `namht-sessions/design/<app>-<date>.md`; render HTML; keep screenshots) Resolve this skill's `references/` dir first (call it `$S