design-verification-loop

Automate ticket verification against Figma designs with subagent coordination.

Updated Jan 30, 2026
One-click install
npx skills add https://github.com/ChoiHyunjin/ai_skills --skill design-verification-loop
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-verification-loop
Source: https://github.com/ChoiHyunjin/ai_skills/tree/main/skills/design-verification-loop
Command: npx skills add https://github.com/ChoiHyunjin/ai_skills --skill design-verification-loop

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill ensures that implemented code accurately matches the intended design specifications in Figma, preventing visual discrepancies and improving product quality.

Core Features & Use Cases

  • Automated Design Review: Compares UI components against Figma designs.
  • Discrepancy Reporting: Identifies and details specific visual differences.
  • Use Case: After a developer completes a ticket for a new modal window, this Skill automatically verifies that the implemented modal's spacing, colors, and layout precisely match the approved Figma design.

Quick Start

Run the design verification loop for all completed tickets.

Frequently Asked Questions about design-verification-loop

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

FAQPage Schema
How do I automate design verification to check UI components against Figma designs?

Automated design verification compares completed ticket implementations against Figma mockups by coordinating subagents to assign reviewers, analyze visual discrepancies, and aggregate feedback on spacing, colors, and layout mismatches.

How do I compare implemented code with Figma mockups after a ticket is completed?

Comparing implemented code with Figma mockups involves assigning completed tickets to subagent reviewers that analyze UI components and report specific visual differences, ensuring the implementation precisely matches the approved design specifications.

Can I use design verification subagents to review UI components for visual consistency?

Yes, design verification subagents coordinate to review UI components by assigning tickets to reviewers and aggregating feedback on discrepancies, ensuring visual consistency and adherence to design specifications across all development tickets.

What is the best way to prevent visual discrepancies between Figma designs and implemented code?

Preventing visual discrepancies between Figma designs and implemented code requires an automated verification loop that compares UI components against design mockups and aggregates detailed feedback on any spacing, color, or layout differences.

When do I need to run a design verification loop for completed development tickets?

You need to run a design verification loop after developers complete tickets implementing new UI components like modal windows, ensuring that the implemented spacing, colors, and layout precisely match the approved Figma design specifications.

Does design verification work with Figma designs to identify spacing and layout differences?

Yes, design verification works with Figma designs by comparing implemented UI components against mockups and aggregating feedback on specific visual differences including spacing, colors, and layout discrepancies across development tickets.