| name | frontend-brief |
| description | Use when a frontend request is vague, new, screenshot-based, Figma-based, or needs audience, workflow, constraints, acceptance criteria, and verification scope before implementation. |
Frontend Brief
Use this skill to turn a loose frontend request into an actionable brief before
designing, implementing, or delegating work.
Workflow
- Identify the product surface, user audience, main workflow, and success
criteria.
- Inspect relevant local UI, routes, components, styles, tests, and docs when
available.
- Determine source-of-truth inputs: existing UI, Figma context, Storybook,
design tokens, screenshots, product copy, or user instructions.
- List constraints: framework, component library, responsive breakpoints,
accessibility, performance, brand, data states, and browser support.
- Define acceptance criteria and verification: screenshots, browser checks,
tests, accessibility review, or AGY comparison when requested.
Output
Return a concise implementation brief:
- surface and audience
- source-of-truth inputs
- component and style constraints
- required states
- acceptance criteria
- verification plan
- open questions that materially affect implementation
Do not invent project-specific component APIs, design tokens, or Figma details.
