skills.rest
pisithrps
pisithrpsCOMMUNITY
Explore all skills by this author →
𝕏@pisithrpsGitHub

prototype

Convert PRDs, napkin sketches, and feature briefs into tool-specific prototype prompts and interactive artifacts.

Updated Mar 11, 2026
Search Tags:#figma#prototyping#prototype#prd#prompt-generation#v0.dev#lovable.dev
One-click install
npx skills add https://github.com/pisithrps/yapzee --skill prototype-pisithrps
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: prototype
Source: https://github.com/pisithrps/yapzee/tree/main/.claude/skills/prototype
Command: npx skills add https://github.com/pisithrps/yapzee --skill prototype-pisithrps

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Product teams and PMs frequently need runnable prototypes and precise prototype prompts but lack a fast, repeatable way to convert PRDs, napkin sketches, and research into shareable artifacts. This Skill centralizes context checks, recommends the right prototyping tool, and generates deployable prompts, interactive artifacts, or Figma handoffs so engineering and design can act without ambiguity.

Core Features & Use Cases

  • Automated context routing: reads PRDs, prior prototypes, research, and napkin sketches to assemble requirements and edge cases before designing.
  • Tool-specific prompt generation: creates ready-to-paste prompts for v0.dev, Lovable.dev, Bolt.new, Claude Artifacts, or detailed Figma handoff specs.
  • Prototype outputs & verification: includes state coverage, requirement verification checklists, naming/versioning conventions, and saves outputs to outputs/prototypes for iteration and handoff.
  • Use cases: quickly validate a single UI component, deliver a multi-page app mock with sample data for user testing, or produce Figma-ready specs for designer handoff.

Quick Start

Type /prototype and paste your PRD or a short feature brief to get a recommended prototype type and a ready-to-use prompt or interactive artifact.

Frequently Asked Questions about prototype

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

FAQPage Schema
How do I convert a PRD into an interactive prototype?▼

You can convert a PRD into an interactive prototype by pasting the document to automatically assemble requirements, generate deployable tool-specific prompts, and produce interactive artifacts for immediate user testing and stakeholder review.

What is the best way to generate v0.dev prompts from feature briefs?▼

Generating v0.dev prompts from feature briefs is best done by using automated context routing to read requirements and output ready-to-paste prompts with state coverage and requirement verification checklists.

Can I create Figma handoff specs from napkin sketches?▼

You can create Figma handoff specs from napkin sketches by inputting the sketches to assemble edge cases and generate detailed handoff specifications for designer handoff without ambiguity.

Does prototype generation work with Lovable.dev and Bolt.new?▼

Prototype generation works with Lovable.dev and Bolt.new by producing tool-specific prompts and saved prototype files compatible with these platforms alongside Claude Artifacts and Figma.

How do I validate a single UI component during product design?▼

To validate a single UI component during product design, input a short feature brief to quickly generate interactive HTML or React artifacts with sample data for immediate testing.

What limitations exist when turning PRDs into full-stack mockups?▼

When turning PRDs into full-stack mockups, limitations include relying on the clarity of initial context routing for edge case assembly, making comprehensive requirement verification checklists essential before generating interactive artifacts.

Related Skills

Explore More Product & Management Skills→
ramybarsoumramybarsoum

prototype

Generate interactive prototype prompts from PRDs, sketches, or feature descriptions.

Community
Advanced
cccnam5158cccnam5158
13

web-artifacts-builder

Bundle React and TypeScript frontend projects into a single portable HTML file.

Community
Intermediate
pisithrpspisithrps

generate-ai-prototype

Generate tool-specific prototype prompts from PRDs for v0.dev, Lovable, and Bolt.new workflows.

Community
Intermediate
coltonbattscoltonbatts
22

vcr-figma-workflow

Convert Figma designs and prompts into VCR-compatible scene manifests.

Community
Advanced