Skip to content

README.md

Latest commit

 

History

History
49 lines (33 loc) · 1.85 KB

README.md

File metadata and controls

49 lines (33 loc) · 1.85 KB
Raw

figma-plan-review

A Claude Code skill that gate-reviews Figma implementation plans before canvas work begins, then learns from outcomes after.

What it does

  • Phase A (Pre-Build): Audits your design system, checks component selection, variable bindings, structure, and project-specific lessons before you write a single use_figma call
  • Phase B (Post-Build): Captures what went wrong, writes project lessons to CLAUDE.md, and evolves cross-project rules in the skill itself

Why

The #1 cause of Figma MCP rework is planning from assumption instead of audited inventory. This skill forces an inspection pass that catches:

  • Building from primitives when a component exists
  • Hardcoding colors/spacing when variables exist
  • Wrong layout structure (3 columns vs 4 columns = full rebuild)
  • Oversized DS components used where custom builds are needed
  • Duplicated components (composite components that already contain sub-components)

Install

Copy to your Claude Code skills directory:

cp -r figma-plan-review ~/.claude/skills/

Or as a user-level skill in any Claude Code project.

Usage

The skill triggers on:

  • "review the plan", "check this approach", "plan review"
  • Before any multi-step figma-use / figma-generate-design work
  • Post-build: "how did that go", "what did we learn"

Files

figma-plan-review/
  SKILL.md                      # Main skill definition
  references/
    review-checklist.md          # Detailed sub-checks for Phase A
  README.md                      # This file

Learned Rules

The skill accumulates cross-project rules in the ## Learned Review Rules section of SKILL.md. These are written by the skill itself during Phase B, gated by a strict filter: each rule must prevent a real rebuild, not be redundant, fit in one sentence, and not be something a competent agent would figure out anyway.