Skills
.Work. You
Rest

figma-design-workflow

Official

Generate Figma mockups from specs

Design & Creative#automation#workflow#design#ui#specifications#figma#mockups
Authorbacchus-labs
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill automates the creation of Figma mockups directly from detailed specifications, bridging the gap between requirements and visual design.

Core Features & Use Cases

  • Automated Mockup Generation: Creates production-ready Figma mockups based on structured UI requirements extracted from wrangler specifications.
  • Design System Integration: Leverages existing design systems for consistent component usage and styling.
  • Hierarchical File Structure: Organizes designs into a master design system file and feature-specific child files.
  • Workflow Automation: Streamlines the design process from specification analysis to approval tracking.
  • Use Case: When a new feature specification is created, this skill can automatically generate the initial set of Figma screens, components, and user flows, ready for designer review and iteration.

Quick Start

Use the figma-design-workflow skill to generate Figma mockups for the specification with ID 'SPEC-123'.

Dependency Matrix

Required Modules

None required

Components

scriptsreferences

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: figma-design-workflow
Download link: https://github.com/bacchus-labs/wrangler/archive/main.zip#figma-design-workflow

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.