mohitagw15856
60 lines
2.0 KiB
Markdown
60 lines
2.0 KiB
Markdown
---
|
|
name: design-handoff-brief
|
|
description: Transform feature briefs into structured design briefs that give designers the context they need
|
|
tool_integration: Figma, Notion
|
|
---
|
|
# 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
|
|
1. Read the feature brief or PRD provided
|
|
2. Extract user goal (reframe from feature language to user outcome language)
|
|
3. Identify constraints — technical limitations, brand guidelines, accessibility requirements
|
|
4. List edge cases the design must handle
|
|
5. Define success criteria the design should be evaluated against
|
|
6. 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]
|