Floorplan: the AI-powered app map that found all seven bugs we planted ✅ yoDEV Tested

Floorplan is a free and open-source plugin for Claude Code and Codex that reads your code, draws an interactive architecture diagram of your app, and reviews typical security flaws in AI-built apps. We planted seven in a test app: it found all seven and flagged none of the four secure configurations we placed alongside them.

The map that Codex built of our test app when we asked it, in Spanish, “Make me a floorplan of this app”: screens, main server, payments, access and data, plus the three external services (OpenAI, Stripe, and Supabase), all named and described in Spanish.

:white_check_mark: yoDEV Tested · November 2, 2026
Floorplan 0.6.2 in the Codex app on macOS and as scripts on Linux, with a two-repository test app. The results we report as ours come from that test.

What is Floorplan and how does it differ from an architecture diagram?

Floorplan converts your code into a zoomable map that works like a living architecture diagram: each part of the app, each file, and each endpoint gets a clear-language name and a one-line description, connected by the imports and HTTP requests between them. Unlike a hand-drawn architecture diagram, you don’t have to maintain it: it regenerates from your code every time you ask. It’s the work of Hayden Smith, MIT-licensed, and designed for people who build with AI and don’t read every line the AI wrote. The README states it bluntly: if someone asks you “what breaks if I change this?”, the honest answer often is no idea.

The work is split in two. Some Node scripts, with no dependencies, do the mechanical part: they find the repositories, analyze the code, match each frontend request with the server endpoint that answers it, and arrange the map. Claude or Codex do the part only a reader can do: decide what your app’s pieces are and name them. The result is a single floorplan/index.html that opens in your browser.

Beyond the map, it adds:

  • Health check: secrets in the code or sent to the browser, Supabase tables without row-level security, open Firebase rules, Stripe webhooks without signature verification, endpoints that modify data without login, and overly permissive CORS. Each problem comes with a correction prompt ready to paste.
  • Recent work: when Claude or Codex change something, the affected cards light up in green with a note about why the change was needed.
  • Ask the map: a question bar that answers using your own Claude Code CLI or Codex session, in read-only mode, with a mini-map of the pieces involved.
  • Screens, guided tours, a “Start here” tour, and Export to a single HTML file you can send to someone who doesn’t use either tool.

Version 0.6.2 came out on November 2, 2026, and the Health check arrived in 0.6.0, two days earlier, so expect the rules to keep changing.

How do you install Floorplan in Claude Code or Codex?

You need Node.js 18 or higher and Claude Code or Codex. No API keys: it works with the Claude or ChatGPT plan you already have.

In Claude Code (CLI or the Code tab of the desktop app):

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

In Codex, from a terminal:

codex plugin marketplace add haydenschmitty/floorplan
codex plugin add floorplan@floorplan

Or in the Codex app: Plugins → Add a marketplace, type haydenschmitty/floorplan as the source, and install Floorplan.

Open a new session in your project and ask:

Make me a floorplan of this app.

In Codex you can also type $floorplan. If your frontend and backend live in separate repositories, open the folder containing both: Floorplan finds each repository and connects them. After you keep working, ask “Update the floorplan” and it only re-reads what changed.

Does it work in Spanish?

Yes: if you talk to it in Spanish, everything the AI writes comes out in Spanish. We installed Floorplan in the Codex app on a Mac as the README indicates (Plugins → Add → Add a marketplace, source haydenschmitty/floorplan, and then the + next to Floorplan), which took less than a minute with no terminal. Then we opened the test app folder and typed a single line: Make me a floorplan of this app.

Codex answered in Spanish, activated the Floorplan skill on its own, and had the map ready 1 minute and 49 seconds later. The project summary, the names of the parts (“Main Server”, “Subscriptions and Payments”, “Access and Administration”), each file and endpoint description, and three guided tours it chose without us asking (Create a subscription, Record a payment, and Check my orders) came out in Spanish. Its final report, also in Spanish, listed the important Health check problems in plain language.

What doesn’t translate, at the time this note was published: the interface and Health check titles are still in English, so you get mixed lines like “Anyone could fake a Stripe payment in Receive payment notifications”. It’s understandable, but keep it in mind if you plan to share the map with a non-technical Spanish-speaking client.

The three guided tours Codex added on its own, with Spanish names.

What security flaws does it find in an AI-built app?

It finds the classic vibe-coding errors, and in our test it missed none. We built a small coffee subscription app split across two repositories (a React and Vite frontend, and an Express backend using Stripe and Supabase) and planted seven errors that show up over and over in AI-generated code:

  1. A Stripe secret key in live format written directly in a routes file
  2. An OpenAI key in a VITE_ variable, used from the browser
  3. A Supabase orders table created without row-level security
  4. A Stripe webhook acting on checkout.session.completed without signature verification
  5. An admin DELETE endpoint with no login check
  6. cors({ origin: true, credentials: true }) on the server
  7. A .env file saved in git

Alongside them we put four controls that should not be flagged: a Stripe publishable key in a VITE_ variable, a bcrypt hash in ADMIN_PASSWORD_HASH, a profiles table with RLS and a policy, and two routes behind a requireAuth middleware.

Result: six “important” issues and one “to fix”: all seven errors and none of the controls. We got exactly the same list twice: running Floorplan’s scripts directly on Linux and in the full Codex execution on the Mac.

The Health panel from the Codex run, topped by the Stripe key written in the code and the OpenAI key exposed to the browser. Each problem has “Show on map”, “Fix with Codex” (“Fix with Claude” in Claude Code), and “Not a problem”.

Some details that matter in practice:

  • It never shows the secret. The Stripe key appeared as “starts sk_l…, 72 characters” and nothing more.
  • It understands environment variables. The notice explains that anything starting with NEXT_PUBLIC_, VITE_, and similar gets copied into code every visitor receives, and leaves public keys alone, like Stripe’s publishable key.
  • RLS review reads your migrations in order, so a table protected in a later migration doesn’t count as open. The message itself acknowledges that if only your server talks to the database, the risk is lower.
  • The repository matching worked: the three frontend requests, built with a ${BASE} template read from an environment variable, got wired to the correct Express endpoints in the other repository.
  • It’s fast. The scan took 0.24 seconds and building the map 0.27 seconds on our test app; the full Codex run, with AI reading and describing the 13 files, took less than two minutes. On large code, time goes into the descriptions.

We also ran the project’s test suite: 190 of 191 tests pass, one is skipped, and none fail. The checksum tool included in the repository confirmed all 54 files match version 0.6.2.

Does it detect when you fix a flaw?

Yes. In the Linux run we added requireAuth to the admin endpoint and launched the update. The refresh took 0.57 seconds, detected the single edited file, and the Health check dropped from six important issues to five. Then Recent work highlighted the changed card with a note explaining what problem it closed.

Recent work after the fix: what was asked, what was done, and the modified file card highlighted.

What limitations does it have?

Three showed up, and it’s good to know them before you trust the count.

Being logged in isn’t having permission. As soon as the admin endpoint had some login check, the Health check marked it fixed, even though any logged-in client could still delete any account, because nothing checks for admin role. The README says it openly: the Health check is “a check, not an audit”. Use it as a net for obvious errors, not as a security review.

Route detection depends on names. Our first version declared Express routes on a router called r (const r = Router()) and Floorplan found zero endpoints. Detection is based on conventional variable names like app, router, or anything ending in Router. When we renamed it to router, everything appeared. If your map shows a server with no endpoints, check this first.

The question bar needs its local server. In our Codex app test, the map opened in the preview panel of the app itself at 127.0.0.1:4378, but the tab didn’t show, and retrying left the Codex window blank. If you open floorplan/index.html directly you see the full map, with the question bar disabled and a note to run node floorplan/serve.mjs from the project root. Floorplan’s own instructions say that in Codex, the map server must run outside the sandbox; if the preview fails, that command is the fix.

Is it safe to install Floorplan?

According to its documentation, Floorplan has no hooks, no MCP servers, no dependencies, doesn’t download anything, and its local server only accepts connections from your own machine. It creates a floorplan/ folder that excludes itself from git and, in Claude Code, only if you say yes, a brief section in your personal CLAUDE.local.md. Its only outbound request is an optional waitlist signup by email for a future hosted version. The code your AI reads goes through your own Claude or ChatGPT account, like any other task.

Floorplan or Archify for a software architecture diagram?

It depends on what you want it for: Archify is for explaining a system to others, Floorplan for understanding and reviewing the app that’s yours. Floorplan’s README compares itself directly with Archify and Understand Anything. Archify draws polished diagrams (architecture, sequence, ERD) for a document, a talk, or a decision; Floorplan maps your app, tells you what’s risky, and what your AI just changed. They go well together: map the app with Floorplan and then draw a flow with Archify for a presentation. We covered Archify here: Archify: cómo hacer diagramas de arquitectura con Claude Code y comparar dos versiones

What didn’t we test?

We ran Floorplan two ways: its scripts directly on Linux and the full plugin inside the Codex app on macOS. We didn’t run it inside Claude Code, we couldn’t get the question bar working, and we didn’t test blueprints from a PRD, large real-world code, or Windows.


And you? What’s the first thing you check in an app you built with AI before putting it in production?

How do you understand the architecture of an app you built with AI today?
  • I read the code myself
  • I ask the AI to explain it to me
  • I use a diagram or a tool that maps it
  • I prefer another option (tell us which)
0 votantes

Comment below or, if this article reached you by email, reply directly to the email: your response gets published here.

Related: How to audit your code’s security with AI using the skill Cloudflare released