# Product Prototype > Use when building the interactive HTML prototype — shared CSS, design system, screen manifest, per-screen files, navigation hub. Triggers on "build the prototype", "clickable prototype", "prototype screens". - Skill: `tomevault-io/product-prototype` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/product-prototype` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/product-prototype/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Design & Media - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/product-prototype --- # Interactive Prototype Authoritative guide: `prompts/Prototype Creation Guide.md` (build order, interactivity, Step 9.5 post-build + syntax gate). Shared standards: `prompts/Shared Standards.md`. Build order (strict): shared `[product-slug].css` → `DesignSystem_*.html` → Design Token Contract → screen manifest + sidebar shell + Content Link Map → `Screen_*.html` (one per screen) → `ScreenIndex_*.html`. Chart libraries: download at build time into gitignored `documents/lib/`, then run the integrity gate (Step 9.5 check 4.5). Every screen: dependency-load guard + global error banner. Run the syntax gate before declaring any screen done. For parallel screen work, dispatch the `screen-builder` subagent (one per screen). --- > Source: [aws-samples/sample-kiro-cli-prompts-for-product-teams](https://github.com/aws-samples/sample-kiro-cli-prompts-for-product-teams) — distributed by [TomeVault](https://tomevault.io).