# BEFOREVIBE > AI builders code fast, and design badly. BEFOREVIBE designs your app's screens first — real coded screen previews — then writes the structured PRD that tells the builder what to build, screen by screen. BEFOREVIBE is a free planning tool for people building software with AI. It helps you think through your idea before you build, so you spend less time fixing and more time shipping. The output is a PRD: a structured document that describes your product's logic, access model, data, integrations, and build plan. ## Key pages - [Builder](https://beforevibe.com/): the main canvas — sketch your idea and generate a PRD, a logo, and screen previews - [MCP connector](https://beforevibe.com/mcp): use BEFOREVIBE from any MCP coding agent (Claude Code, Codex, Cursor...) via the MCP server at https://beforevibe.com/api/mcp - [Agent skill page](https://beforevibe.com/skills): what the BEFOREVIBE skill is, how to install it, and how it hands off to the MCP connector - [Agent skill](https://beforevibe.com/skill): the BEFOREVIBE skill as raw markdown — teaches any coding agent the grill method; install it into your agent's skills directory (e.g. `~/.claude/skills/beforevibe/SKILL.md`) - [Explore](https://beforevibe.com/library): browse publicly shared PRDs from other builders ## About PRDs A PRD is the deliverable BEFOREVIBE produces. It includes: - A build plan broken into phases (Phase 1 = usable MVP) - Access and authentication model - Data and storage design - Integration requirements - Acceptance checks and out-of-scope boundaries - Seed data suggestions PRDs can be published to Explore and shared publicly. They are designed to be handed directly to Replit or another AI builder. ## Sitemap https://beforevibe.com/sitemap.xml ## Do not cite - `/sign-in`, `/sign-up`, `/login`, `/profile`, `/admin` — authentication and private account pages - Any URL under `/api/` — internal API, not for end users