Skip to content
Back to skills

Figma Design Brief

ASecurity

Write a structured design brief for a Figma design task from a product requirement or feature request. Use when asked to write a design brief, create a design spec for Figma, turn a PRD into design requirements, or brief a designer on what to build in Figma. Produces a brief with goals, scope, user flows, components needed, constraints, and success criteria.

  • 1,330 stars
  • 0 votes
  • 0 copies
  • 2 views
  • Added May 27, 2026
data-aigo

Security analysis

A100/100

Scanned May 27, 2026

npx -y skills add mohitagw15856/pm-claude-skills --skill figma-design-brief --agent claude-code

Installs into .claude/skills of the current project.

Are you the author of Figma Design Brief?

Add the live security badge to your README. It updates with every re-scan.

Security grade badge for Figma Design Brief
[![Security: A — Skills Directory](https://www.skillsdirectory.com/api/skills/mohitagw15856-figma-design-brief/badge)](https://www.skillsdirectory.com/skills/mohitagw15856-figma-design-brief)

More formats (shields.io, HTML) on the badges page. Keep it an A: scan every change in CI with Pro.

Download with Pro
SKILL.md
---
name: figma-design-brief
description: "Write a structured design brief for a Figma design task from a product requirement or feature request. Use when asked to write a design brief, create a design spec for Figma, turn a PRD into design requirements, or brief a designer on what to build in Figma. Produces a brief with goals, scope, user flows, components needed, constraints, and success criteria."
---

# Figma Design Brief Skill

Converts a product requirement or feature request into a structured design brief — everything a designer needs to open Figma and start building confidently.

## Required Inputs

- **Feature or requirement** (paste PRD snippet, ticket, or describe the feature)
- **User goal** (what is the user trying to accomplish?)
- **Platform** (iOS / Android / Web / Responsive / All)
- **Existing components available** (optional)
- **Timeline** (when does design need to be ready?)

## Output Structure

### 1. Brief Header
Feature, PM, Designer, Platform, Design due, Dev handoff dates.

### 2. What We Are Designing and Why
- **The goal:** [One sentence — user problem being solved]
- **Context:** [2-3 sentences. Why now? What triggers this?]
- **Success looks like:** [Specific observable outcome]

### 3. User Flows to Design

**Flow N: [Flow name]**
- Entry point: [Where user starts]
- Steps: [Numbered key steps]
- Exit point: [Where flow ends]
- Edge cases: [empty state, error state, loading state]

### 4. Screens Required

| Screen | New / Update | Notes |
|---|---|---|
| [Screen] | New | [Key requirement] |

### 5. Components Needed

| Component | In library? | Action |
|---|---|---|
| [Component] | Yes/No/Needs variant | Use/Create/Extend |

### 6. Constraints and Requirements
- Must haves: [Non-negotiable constraints]
- Must avoid: [Design patterns to not use]
- Accessibility: [WCAG level, touch target sizes]

### 7. Open Questions
- [ ] [Question — with owner]

## Quality Checks
- [ ] Goal is outcome-focused (not "design the feature")
- [ ] All flows include edge cases
- [ ] Components table identifies create vs reuse
- [ ] Constraints include accessibility requirements
- [ ] Open questions have owners

## Example Trigger Phrases
- "Write a design brief for [feature]"
- "Turn this PRD into a Figma design brief"
- "Brief the designer on what to build for [requirement]"
- "Create a design spec for [feature] for Figma"
- "What does the designer need to know to design [feature]?"

Attribution

Is this your skill, or is something wrong with this listing? Request removal or report an issue. Author removals are honored within 72 hours.

Comments

Loading comments…

Newsletter

Get the weekly list of safe new skills, and the ones we pulled.