Skip to content
Development
Skill

/prototype

HTML/CSS прототип для проверки user stories ДО реального кода. Запускает prototype-builder (Sonnet). Один главный flow, mock data, кликабельно. FULL этап 9. Триггеры — "/prototype", "клик прототип", "html макет".

From plugin
vibe-dev
529 skills24 agents7 hooks

Claude Code

$ npx -y skills add andrewcigan/vibe-dev-plugin --skill prototype --agent claude-code

SKILL.md

prototype.SKILL.md
name: prototype
description: HTML/CSS прототип для проверки user stories ДО реального кода. Запускает prototype-builder (Sonnet). Один главный flow, mock data, кликабельно. FULL этап 9. Триггеры — "/prototype", "клик прототип", "html макет".
when_to_use: FULL только, после /architecture. Дешёвая UX-валидация — пользователь подтверждает концепцию до того как пишем production-код.

/prototype

HTML-прототип через prototype-builder agent.

Что происходит

1. Subagent `prototype-builder` (Sonnet) читает PRODUCT.md, user-stories, ARCHITECTURE.md 2. Identify главный user flow (один!) 3. Build `prototype/index.html` (HTML + Tailwind CDN + inline mock data) 4. 1-3 экрана связанных, главный flow работает 5. Пользователь открывает в браузере и тестирует

Output

  • `prototype/index.html`
  • (опц.) `prototype/screen-2.html`, `screen-3.html`

НЕ делаем

  • Финальный дизайн (для этого /design-handoff → Claude Design)
  • Реальный backend (это не MVP)
  • Все экраны (один flow)

Дальше

После confirm пользователя — `/choose-stack`.

Cost

$1.50. Без external API.

@andrewcigan
Ships withvibe-dev

🌐 English: this file · Русский: README.ru.md A harness-first plugin that turns a business idea into a shipped product — for founders who build with Codex and Claude Code.

529 skills24 agents
Get the whole plugin

Stars on GitHub

Momentum

stars in total
5
Star history of andrewcigan/vibe-dev-plugin on GitHub, a chart by star-history.com

Other skills on vibe-dev.

architecture

architecture

V0 архитектура с TOC bottleneck-анализом. Запускает architect (Fable 5.1). ≤10 компонентов, Mermaid диаграмма, invariants как…

audit

audit

7-tuple оценка здоровья проекта (Instructions / State / Verification / Scope / Lifecycle / Learning / Cost-Safety) через ВНЕШНЕГО…

checkpoint

checkpoint

Управляемый чекпоинт состояния в файлы посреди работы — вместо авто-сжатия («рулетки»). Перезаписывает Current State,…

choose-stack

choose-stack

Выбор стека под bottleneck архитектуры. Запускает stack-advisor (Fable 5.1). Использует 2026 tech-updates (opendataloader-pdf,…

critique

critique

FULL этап 5 — автономный critique long-list идей. Запускает idea-critic (Sonnet), который отсеивает hard-filters и оставляет…

design-handoff

design-handoff

Бриф для Claude Design (claude.ai/design) по формуле C.R.O.P. Плагин не рисует UI сам — готовит handoff. Запускает…

More skills from other plugins.

brainstorming
Auto-invoked

brainstorming

You MUST use this before any creative work - creating features, building components, adding functionality, modifying behavior, or…

@obra@obraInstall Skill
ask-matt

ask-matt

Ask which skill or flow fits your situation. A router over the skills in this repo.

skills13d309k
@mattpocock@mattpocockInstall Skill
accessibility
Auto-invoked

accessibility

Design, implement, and audit accessible UI to WCAG 2.2 Level AA across Web, iOS, and Android — semantic ARIA roles and labels,…

ecc2w293k
@affaan-m@affaan-mInstall Skill
compiler-commit

compiler-commit

Use when you want to verify compiler changes and commit with the correct convention. Runs tests, lint, and format, then commits…

react4d252k
@facebook@facebookInstall Skill

Questions about prototype.

Which coding agents can use prototype?
prototype installs in Claude Code, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode and Windsurf with the skills CLI, using each agent's flag shown on this page. Flowy's auto-invocation, which fires a skill when your prompt matches, runs in Claude Code only.