Floorplan

See how your app actually fits together.

Claude reads your codebase and draws an interactive map of it. Every part, file and web request gets a plain-English name, and every connection between them is shown.

Watch the video · Install · Quick start · Features · See it in action · How it works · Docs · FAQ

Why Floorplan?

You built an app, probably with a lot of help from AI, and it works. But ask "what happens when someone checks out?" or "what breaks if I change this?" and the honest answer is no idea.

Floorplan gives you the diagram nobody drew. Ask Claude for a floorplan and a few minutes later you have a map you can explore, ask questions on, and keep up to date as you work.

• For builders: understand the app you made, in your own words, without reading the code.
• For teams: onboard someone in minutes, from the big picture down to the exact file.
• For working with Claude: after every change, see exactly which parts it touched and why.

Features

🗺️ A map at every zoom Start with the whole app, then double-click into a part, a group of files, a file, and its endpoints. Each view shows what it's used by and what it uses.

💬 Plain English everywhere "Takes card payments at checkout", not "Stripe API wrapper". Technical terms are explained on hover, and one switch shows the developer view.

🔌 Real connections, across repos It follows imports, and matches each web request in your frontend to the server endpoint that answers it, even across separate repos.

🖥️ Start from a screen Pick a page you know and see everything behind it: its parts, the requests it makes, the server code, the data, and outside services.

🧭 Ask the map "How does a refund reach the customer's card?" comes back as an answer plus a mini-map of just the pieces involved, with a step-by-step walkthrough.

🩺 Health check Finds passwords in code, endpoints anyone can use without signing in, unused files and files too big to edit safely. Each comes with a ready-to-paste fix.

🟢 Recent work The cards Claude just changed light up green, each with a note on how the change serves what you asked for.

⚡ Stays current, stays yours Updates re-read only what changed, and an open map reloads itself. Everything runs on your machine, and nothing is committed to git.

Plus guided flows you can request in plain words, a one-minute Start here tour, search, keyboard shortcuts, and right-click actions on every card.

See it in action

Install

You need Claude Code (the desktop app's Code tab or the CLI) and Node.js 18+.

claude plugin marketplace add haydenschmitty/floorplan
claude plugin install floorplan@floorplan

Start a new session and it's ready. Installing the Claude Code CLI is recommended even if you use the desktop app, because it lets the map's Ask bar read your real code. More in Getting started.

Quick start

1. Open your project in Claude Code. For a frontend and backend in separate repos, open the folder that holds both.
2. Ask:

   Make me a floorplan of this app.

3. Explore. The map opens on its own, starting with a short tour.

When you've done more work, ask:

Update the floorplan.

Only what changed is re-read, and what you just worked on lights up under Recent work.

Things to try

How it works

flowchart LR
    code["Your codebase<br/>one repo or several"] --> scan["Scan<br/>files, imports, routes, requests"]
    scan --> claude["Claude<br/>names the parts, describes every file"]
    claude --> build["Build<br/>map, health, screens, recent work"]
    build --> map["floorplan/index.html<br/>opens in your browser"]
    map -. "update the floorplan" .-> scan

Scripts do the mechanical work: finding repos, parsing code in a dozen languages, matching web requests to endpoints, laying out the map. They're plain Node with no dependencies. Claude does the part only a reader can: deciding what the parts of your app are, and saying so plainly. Details in How it works.

Languages: TypeScript, JavaScript, Python, Go, Rust, Java, Kotlin, Scala, plus Vue, Svelte and Astro files, with lighter support for others. Endpoints: Express, Koa, Hono, Next.js, Flask, FastAPI, Django, Go's net/http, Gin, Echo and chi, Actix, Axum, Spring. Screens: Next.js, React Router, Vue, SvelteKit, Remix, Nuxt, Astro, Expo, Angular, TanStack.

What it adds to your project

A floorplan/ folder holding the map, plus a short section in CLAUDE.local.md so future Claude sessions know the map is there. Neither is committed: the folder ignores itself in git, and CLAUDE.local.md goes in your clone's private ignore list. Your .gitignore and other tracked files are never touched. See What's in your project.

Privacy

• The scan, the map and its small local server all run on your computer. The server only accepts connections from your own machine.
• No dependencies or install scripts, and the map works offline: its layout engine and fonts are built in.
• Questions on the map go to your own Claude account, through the Claude Code CLI.
• The Health check never stores or shows secret values, only where they are.
• No analytics or tracking. The map may ask once whether you'd like an email when Floorplan Cloud launches. Nothing is sent unless you sign up, and then only your email and "just me" or "with my team".

More in Privacy and security.

Documentation