figma-design-qa

Generate a structured pre-handoff QA checklist for Figma designs.

1|Updated May 22, 2026
One-click install
npx skills add https://github.com/spontus-reach/spontus --skill figma-design-qa
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: figma-design-qa
Source: https://github.com/spontus-reach/spontus/tree/main/.agents/skills/figma-design-qa
Command: npx skills add https://github.com/spontus-reach/spontus --skill figma-design-qa

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It prevents costly handoff churn by systematically validating a Figma design for hygiene, component correctness, accessibility, and build readiness before it reaches engineering.

Core Features & Use Cases

  • Pre-handoff QA checklist: Produces a structured, sectioned report with pass/fail outcomes across file hygiene, component usage, content quality, state coverage, accessibility, and handoff readiness.
  • Targeted review prompts: Works when you need to QA a specific feature/screen, validate a design against platform needs (iOS/Android/Web), or confirm readiness for a chosen handoff tool (Figma Inspect, Zeplin, Storybook, or direct link).
  • Actionable issue breakdown: Converts findings into “what to fix” items with owner guidance and an explicit handoff decision (Ready / Minor fixes needed / Not ready).

Quick Start

Run a pre-handoff check on the Figma design for “Checkout flow” on Web with the Material design system using Figma Inspect at standard QA depth.

Frequently Asked Questions about figma-design-qa

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
What is a pre-handoff design QA checklist for Figma?

A pre-handoff design QA checklist validates Figma file hygiene, component usage, content quality, state coverage, and accessibility to ensure build readiness before engineering teams receive the assets.

How do I run a design QA check before handing off Figma files to engineering?

Run a design QA check by reviewing your Figma feature against file hygiene, component validation, states, and accessibility rules to generate an actionable blocking vs non-blocking issue list and an explicit handoff decision.

Can I validate Figma component states and accessibility for platform-specific builds?

Yes, you can validate Figma component states and accessibility for iOS, Android, or Web builds by applying platform-specific QA rules to catch missing states and accessibility gaps before engineering handoff.

Does Figma design QA work with Zeplin, Storybook, or Figma Inspect handoffs?

Figma design QA supports handoff readiness validation for Figma Inspect, Zeplin, Storybook, or direct prototype links by confirming the design meets the specific requirements of your chosen handoff method.

What is the best way to prevent handoff churn from Figma design issues?

The best way to prevent handoff churn is to systematically validate Figma designs for component correctness, accessibility, and hygiene using a structured QA checklist that produces a clear ready or not ready handoff decision.

Why does my engineering team find missing states and component issues after Figma handoff?

Engineering teams find missing states and component issues after Figma handoff because the design was not validated against a structured QA checklist covering state coverage, component usage, and accessibility before the build phase.