What is VibeMap?
On this page
What is VibeMap?
VibeMap turns a plain-language product idea into a complete, build-ready specification — then hands it to your own AI coding agent. · Recommended
Read this first if you're new. It explains what VibeMap produces, the four-phase journey the whole app is organised around, and where to go next. If you already know the product and just want to build, skip to Creating your first project.
What VibeMap is
VibeMap is an AI-powered project specification generator. Describe your product in plain language and VibeMap produces the artifacts that normally take a team weeks to write by hand — personas, features, user stories, acceptance criteria, pages, and a database schema — all cross-referenced into a single coherent spec.
It doesn't stop at documents. Once the spec is ready, VibeMap hands the work to your own AI coding agent (Cursor, Claude Code, Windsurf, VS Code Copilot) over the Model Context Protocol (MCP), so your agent implements the spec one acceptance criterion at a time, directly in your codebase. Prefer to stay in-app? The App Builder can compile the spec into a running Next.js + Supabase app instead.
Who it's for
| Role | How VibeMap helps |
|---|---|
| Product managers | Generate PRDs, user stories, and acceptance criteria in minutes instead of weeks |
| Developers & technical leads | Get a database schema, page structure, and sequenced backlog before writing a line of code |
| Founders & solo builders | Go from idea to a structured spec without a full product team |
| Agencies & freelancers | Produce professional project documentation for proposals and kickoffs |
The four-phase journey
The project editor — and this documentation — are organised as one continuous journey. Every screen in the app belongs to one of these four phases:
- Research — validate the idea before you spec anything: an AI-generated project summary, a live-web-research business case, and an optional financial analysis.
- Plan — author the spec in order: personas → features → user stories → acceptance criteria → pages → schema. Pages come before schema on purpose: page layouts give the schema generator richer context.
- Prepare — consolidate everything into a build-ready blueprint: a coverage check, a foundation proposal, and a review queue.
- Develop — hand off to your IDE agent via MCP, or build in-app with the App Builder.
It's a loop, not a line. Acceptance criteria derive from features and stories, and you can later cross-check them against your generated pages to close gaps. Green dots in the sidebar and the progress strip on the project Overview show which steps already have content, and the strip always points at the recommended next action.
💡 Tip: The Progression Map is the single map of this whole journey — what each step produces, what feeds it, and when you can safely skip it. Keep it open in a second tab while you work.
How the AI pipeline works
VibeMap uses a multi-step pipeline rather than a single prompt-and-response:
- Project summary — the AI reads your description and produces a structured overview: goals, audience, value proposition, and scope.
- Sequential generation — each deliverable is generated in order, with every step receiving the full context of the steps before it.
- Multi-provider intelligence — different generation tasks are routed to the model best suited to the job (Anthropic, OpenAI, Google), combining providers for the best result.
- Refinement — edit, regenerate, or extend any deliverable. Changes cascade context to everything downstream.
Because each step sees the full picture, the output is far more coherent than a single prompt could produce.
💡 Tip: You don't have to drive the pipeline by hand. The built-in conversational agent can run any generation, edit your spec by natural request, and answer questions about it — all versioned, so you can revert anything.
⚡ Power-user hints
- Skip straight to build. Have a codebase already? Choose Start from existing code when creating a project and your agent reverse-engineers it into specs via MCP — no prompt needed. See Creating your first project.
- Start from a template. For a common app shape (SaaS, marketplace, e-commerce), a prebuilt template drops a full foundation into your account in one click, so you customise instead of generating from scratch.
- Reference anything by its code. Every entity has a short code (persona P-001, page PG-002, table/field T-001.email). The agent understands them, so you can say "combine PG-002 and PG-003" precisely.
↔ The traditional way
Without VibeMap, a team assembles this by hand: a PM drafts a PRD and user stories, a designer sketches the page inventory, an architect draws the ERD, and a lead breaks it all into tickets — days to weeks of work that drifts out of sync the moment anything changes. VibeMap generates the same artifacts in minutes, keeps them cross-referenced so a change in one propagates to the rest, and then feeds your coding agent a clean, sequenced backlog instead of a static document.
What's next
- Creating an account — sign up and reach the dashboard.
- The Progression Map — the map of the entire journey, step by step.