← ClaudeAtlas

frontend-design-intelligencelisted

Review inspected designs or briefs for product-flow gaps and ask evidence-based user questions. Ground UI direction in audience, patterns, and UX risks; excludes code and tool setup.
ytvee-dev/webdev-agent-kit · ★ 5 · Web & Frontend · score 78
Install: claude install-skill ytvee-dev/webdev-agent-kit
# Frontend Design Intelligence ## Purpose Create a compact design intelligence brief before visual direction when a UI task needs product-category grounding, page-pattern choice, density decisions, or domain-specific anti-pattern checks. This skill adapts design-system reasoning into the WebDev Agent Kit model without becoming a UI framework, CLI generator, or package installer. ## When To Use Use after prompt intent routing when the task is `Standard Workflow` or `Deep Workflow` and one or more are true: - product type, page type, audience, or user job is vague; - the user asks for visual style, landing structure, dashboard structure, or distinctive UI direction; - the page needs visual variance, motion, or density decisions; - inspected designs leave transitions, forms, states, or product behavior unclear; - `frontend-design-director` needs better grounding before writing a Design Direction Contract. ## When Not To Use Do not use for Fast Lookup, tiny edits, purely technical bugfixes, code implementation, live Figma inspection, package installation, or new styling systems. ## Required Context 1. Read `AGENTS.md`. 2. Read `common/prompt-intent-routing-rules.md` when workflow level is unclear. 3. Read relevant project overlays when present. 4. Read only relevant references from this skill: - `references/product-pattern-matrix.md`; - `references/design-dials.md`; - `references/product-anti-patterns.md`. 5. Read supplied screenshots, briefs, inspect notes, or