skills.rest
yamk12nfu
yamk12nfuCOMMUNITY
Explore all skills by this author →
GitHub

figma-make-spec

Generate a formal SPEC.md from Figma Make prototype URLs through guided interviews.

Updated Mar 25, 2026
Search Tags:#workflow#specification#requirements#product-management#interactive-interview#spec-template#figma-make
One-click install
npx skills add https://github.com/yamk12nfu/claude-skills --skill figma-make-spec
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: figma-make-spec
Source: https://github.com/yamk12nfu/claude-skills/tree/main/figma-make-spec
Command: npx skills add https://github.com/yamk12nfu/claude-skills --skill figma-make-spec

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Figma MakeのプロトタイプURLから、実装レベルの要件定義書（SPEC.md）を対話を通じて自動生成します。設計と開発の間の認識差を減らし、要件の取りこぼしを防ぎます。

Core Features & Use Cases

  • 対話型ヒアリングを通じて、プロトタイプの要件と制約を明確化します。
  • SPEC.mdのテンプレートに沿って、概要・ゴール・技術スタック・アーキテクチャ・データモデル・API設計・非機能要件・未確定事項を網羅的に生成します。
  • 未確定事項を明示し、後続のレビューと修正を容易にします。

Quick Start

Figma Make URLを提供すると、対話形式でSPEC.mdの作成を開始します。

Frequently Asked Questions about figma-make-spec

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

FAQPage Schema
How do I generate a SPEC.md from a Figma Make prototype?▼

To generate a SPEC.md from a Figma Make prototype, provide the figma.com/make/ URL. The Skill initiates an interactive interview to extract UI flows, data models, and technical requirements into a formal specification document.

What is the best way to document UI flows and technical architecture for product management workshops?▼

Documenting UI flows and technical architecture is best handled by converting Figma Make prototypes into a structured SPEC.md. This ensures comprehensive coverage of goals, scope, API design, and non-functional requirements through guided interviews.

Can I create a complete requirements specification from just a Figma Make URL?▼

Yes, you can create a complete requirements specification from a Figma Make URL. The Skill conducts an interactive interview to clarify constraints and unresolved items, populating a detailed SPEC.md template covering the full technical stack.

Does generating a specification this way cover non-functional requirements and unresolved items?▼

Generating a specification this way explicitly covers non-functional requirements and unresolved items. The output SPEC.md template systematically includes sections for architecture, data models, API design, and any pending decisions for iterative review.

Why use interactive interviews for converting prototypes into requirement specifications?▼

Interactive interviews for converting prototypes into requirement specifications clarify design and development constraints. This guided process prevents missing requirements and explicitly highlights unresolved items for subsequent team review and modification.

Related Skills

Explore More Product & Management Skills→
easingthemeseasingthemes
6

dx-figma-extract

Extract design context, tokens, and screenshots from a Figma URL.

Community
Advanced
ahgraberahgraber
5

spec-kit-clarify

Resolve high-impact ambiguities in a feature specification and update spec.md.

Community
Advanced
hffmnnjhffmnnj
39

daemon-context

Orchestrate multi-project GoopSpec workflows via a local daemon and SQLite.

Community
Intermediate
clovernguyen1010-ship-itclovernguyen1010-ship-it

ba-ui-function-gen

Generate Mermaid user flows and HTML prototypes from brand guidelines and data models.

Community
Intermediate