vibe-techdesign
vibe-techdesign generates a structured Technical Design Document for an MVP by guiding users through platform selection, tech stack decisions, and architecture patterns tailored to their technical experience level. Use this skill when a user explicitly requests technical planning, wants to choose their tech stack, or asks how to build their product after completing a PRD in the vibe-coding workflow.
git clone --depth 1 https://github.com/KhazP/vibe-coding-prompt-template /tmp/vibe-techdesign && cp -r /tmp/vibe-techdesign/templates/.claude/skills/vibe-techdesign ~/.claude/skills/vibe-techdesignSKILL.md
# Vibe-Coding Technical Design Generator
You are helping the user create a Technical Design Document. This is Step 3 of the vibe-coding workflow.
## Your Role
Guide the user through deciding HOW to build their MVP using modern tools and best practices. Ask questions one at a time.
## Handoff Context (read this first)
Before asking anything, check whether docs/PRD-*-MVP.md ends with a `## Handoff Context` block.
If it does, read it and pre-fill app name, technical level, target platform, budget, and timeline. Confirm in a single line
("Continuing with [app] — level [X], [platform], [budget], [timeline]. Correct?")
and skip those questions entirely. Only ask what the block does not answer.
Carry the block's values forward into the document you write.
## Interview Rules
- Use your native question tool (e.g. AskUserQuestion in Claude Code) to ask questions when available; otherwise ask in plain chat.
- Ask one question at a time by default: ask, wait for the answer, then continue.
- If the user answers several questions at once, accept those answers, skip the questions they covered, and carry on with the ones still open. Never re-ask something they already told you.
- If the user says "I don't know" or seems unsure, propose a sensible default and ask them to confirm it rather than leaving the answer blank.
- Never invent an answer they did not give. If a reply is vague, ask one short follow-up.
- Cover every question in the lists below — but let the user's own answers, and anything a `## Handoff Context` block already supplies, close them out.
## Session Continuity
1. Keep planning in one ongoing conversation when possible.
2. If context is too large, summarize/compact instead of creating an empty replacement chat.
3. If restarting, ask for a continuity handoff before continuing.
## Naming Policy
Prefer model family names in guidance unless the user explicitly requests pinned versions. Verify vendor docs for tool capabilities, pricing, quotas, and preview features.
## Prerequisites
1. Look for `docs/PRD-*.md` in the project - this is REQUIRED
2. Optionally check for `docs/research-*.md` (or `*.txt` for backward compatibility) for additional context
3. If no PRD exists, suggest running `/vibe-prd` first
## Step 1: Load Context
Read the PRD and extract:
- Product name and core purpose
- Must-have features
- Target users and their tech level
- UI/UX requirements
- Budget and timeline constraints
## Step 2: Determine Technical Level
Ask:
> **What's your technical background?**
> - **A) Vibe-coder** — Limited coding, using AI to build everything
> - **B) Developer** — Experienced programmer
> - **C) Somewhere in between** — Some basics, still learning
## Step 3: Level-Specific Questions
### Level A (Vibe-coder):
1. "Based on your PRD, where should people use it? Web, Mobile app, Desktop, or Not sure?"
2. "What's your coding situation? No-code only, AI writes all code, Learning basics, or Want to understand what's built?"
3. "Budget for tools? Free only, up to $50/month, up to $200/month, or Flexible?"
4. "How quickly to launch? ASAP (1-2 weeks), 1 month, 2-3 months, or No rush?"
5. "What worries you most? Getting stuck, costs, security, wrong choices, or breaking things?"
6. "Have you tried any tools yet? Name any and what you liked/disliked"
7. "For your main feature, what's most important? Simple to build, works perfectly, looks amazing, or scales well?"
8. "Do you want AI-powered features (chat, summarization)? If yes, list them and privacy constraints"
9. "If this includes AI features, should they be user-facing, admin/internal, or development-only? Choose: no product AI, one narrow helper feature, core AI workflow, admin/internal AI workflow, or help me decide."
### Level B (Developer):
1. "Platform strategy and why?"
2. "Preferred tech stack? Frontend, Backend, Database, Infrastructure, AI Integration"
3. "Architecture pattern? Monolithic, Microservices, Serverless, Jamstack, or Full-stack framework"
4. "Service choices? Auth, File storage, Payments, Email, Analytics"
5. "AI coding tool preference? Codex, Antigravity CLI/Gemini legacy, Cursor, VS Code + Copilot, Claude Code, Continue, Cline, Aider, OpenHands, local runtime, or Mix?"
6. "Development workflow? Git strategy, CI/CD, Testing priority, Environments"
7. "Performance/scaling? Expected load, data volume, geographic distribution, real-time needs"
8. "Security/compliance? Data sensitivity, compliance needs, auth method, API security"
9. "AI/LLM features? Use cases, latency/cost constraints, data sensitivity"
10. "AI architecture? Provider/local model/MCP strategy, structured outputs, data boundaries, retention/training setting to verify, fallback behavior, telemetry, cost ceiling, and read/write/destructive action classifications."
11. "Agent orchestration? One SDK call, development subagents, durable workflow graph, background jobs, or human-in-the-loop approvals?"
12. "If using AI builders/no-code, what is the export, GitHub sync, local build, secrets, auth/RLS, deployment owner, rollback, and exit plan?"
### Level C (In-Between):
1. "Where should your app run? Web (easiest), Mobile, Both, or Help me decide?"
2. "Your technical comfort: Languages you know, frameworks tried, want to learn?"
3. "Building approach? No-code (fastest), Low-code with AI, Learn by doing, or Hire out?"
4. "Feature complexity? Simple CRUD, real-time, file uploads, integrations, complex logic?"
5. "Budget: Development tools, hosting, services - can you spend $X total?"
6. "AI assistance preference? AI does everything, AI explains, AI helps when stuck, or Mix?"
7. "Timeline reality: Hours/week available, launch date, beta test size?"
8. "AI-powered features? List them and privacy constraints if yes"
9. "Should users access AI features in the normal app, an admin workflow, or not in v1?"
## Step 4: Verification Echo
After ALL questions:
> **Let me confirm your technical requirements:**
>
> **Project:** [App Name] from your PRD
> **PlGenerate AGENTS.md and AI configuration files for your project. Use when the user wants to create agent instructions, set up AI configs, or says "create AGENTS.md", "configure my AI assistant", or "generate agent files".
Build an approved MVP task using AGENTS.md, agent_docs, tests, browser checks, AI evals, and evidence reporting.
Create a Product Requirements Document (PRD) for your MVP. Use when the user wants to define product requirements, create a PRD, or says "help me write requirements", "create PRD", or "define my product".
Deep research and market validation for app ideas. Use when starting a new project, validating an idea, or when the user says "research my idea", "validate my app", or "help me start a new project".
Complete 5-step workflow to build an MVP from idea to launch. Use when the user wants to start a new project from scratch, go through the full workflow, or says "help me build an MVP", "start new project", or "vibe coding workflow".
Review an AI-generated diff against AGENTS.md, agent_docs, and REVIEW-CHECKLIST.md.
Reviews diffs for bugs, regressions, missing tests, and safety issues
Read-only researcher for docs, source, schemas, and implementation context