design-handoff-brief
SKILL.md
Design Handoff Brief Skill
Purpose
Produce a design brief that sets designers up for success — grounding them in user context and constraints before they open Figma, not after they've gone in the wrong direction.
What Designers Actually Need (and PMs Often Skip)
- The user's goal, not the feature name
- The emotional state of the user at this moment in the journey
- What success looks like — how will we know the design worked?
- Constraints: technical, legal, brand, accessibility
- Edge cases that must be handled
- What we're explicitly NOT solving for
Process
- Read the feature brief or PRD provided
- Extract user goal (reframe from feature language to user outcome language)
- Identify constraints — technical limitations, brand guidelines, accessibility requirements
- List edge cases the design must handle
- Define success criteria the design should be evaluated against
- Write a "not in scope" section to prevent scope creep in design
Output Format
Design Brief: [Feature Name]
User Goal: (in the user's words, not ours) "When I [situation], I want to [motivation] so that I can [outcome]."
Context & Emotional State: [Where is the user in their journey? What are they feeling? What just happened?]
Design Success Criteria:
- [Criterion 1 — measurable where possible]
- [Criterion 2]
- [Criterion 3]
Constraints:
- Technical: [limitations engineering has flagged]
- Brand: [relevant brand guidelines]
- Accessibility: [WCAG level required, any specific requirements]
- Legal/Compliance: [if applicable]
Edge Cases to Design For:
- [Edge case 1]
- [Edge case 2]
- [Edge case 3]
Explicitly Out of Scope:
- [What we are NOT solving in this design iteration]
Reference Material:
- User research: [link]
- Existing patterns: [Figma component library link]
- Competitor examples: [links if relevant]
Weekly Installs
1
Repository
mohitagw15856/p…e-skillsGitHub Stars
45
First Seen
13 days ago
Security Audits
Installed on
amp1
cline1
opencode1
cursor1
kimi-cli1
codex1