prototype-orchestrator-pro

Convert informal notes into a product spec and single-file HTML prototype.

16|2|Updated Mar 12, 2026
One-click install
npx skills add https://github.com/Nanford/Nanford-skills --skill prototype-orchestrator-pro
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: prototype-orchestrator-pro
Source: https://github.com/Nanford/Nanford-skills/tree/main/skills/prototype-orchestrator-pro
Command: npx skills add https://github.com/Nanford/Nanford-skills --skill prototype-orchestrator-pro

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

Converts informal inputs (spoken notes, meeting minutes, chat transcripts) into a precise product specification and a self-contained HTML prototype, enabling fast review and iteration.

Core Features & Use Cases

  • Input normalization: unify diverse notes into a consistent set of requirements and user stories.
  • Product spec generation: produce a succinct ProductSpec with roles, pages, entities, and flows.
  • Prototype rendering plan: outline a 1-file HTML prototype with hash routing, design presets, and mock data for rapid visualization.
  • Use case example: transform a project kickoff chat into an overview page, a task list, and a prototype render prompt.

Quick Start

Provide a concise product spec and an initial single-file HTML prototype plan based on the provided notes.

Frequently Asked Questions about prototype-orchestrator-pro

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

FAQPage Schema
How do I convert meeting notes into an HTML prototype?

To convert meeting notes into an HTML prototype, the Skill normalizes informal inputs like chat transcripts into product specs, then renders a single-file HTML prototype with hash routing and mock data.

What is the best way to generate mock-data scaffolding for a frontend design prototype?

Generating mock-data scaffolding for a frontend design prototype is handled automatically during the rendering handoff, embedding industrial design presets and mock data directly within a self-contained HTML file.

Can I use chat transcripts to generate a product spec for B2B workflows?

Yes, you can use chat transcripts to generate a product spec for B2B workflows by unifying diverse notes into consistent requirements, user stories, and a precise model with roles, pages, entities, and flows.

How to plan page rendering for a single-file HTML prototype?

Planning page rendering for a single-file HTML prototype involves outlining a step-by-step rendering handoff to frontend-design, enforcing hash-routing and restricting interactions to navigation, tabs, filters, drawers, and toasts.

Does the prototype rendering support complex interactions like custom forms?

No, prototype rendering does not support custom forms; it explicitly restricts prototype-level interactions to navigation, tabs, filters, drawers, and toasts for PC-first B2B workflows.

What do I need to create a single-file HTML prototype from spoken notes?

To create a single-file HTML prototype from spoken notes, you only need informal requirements like meeting minutes; the Skill handles input normalization, product modeling, and page planning without external dependencies.