New Rendered: wireframes become final designs

Describe it. Sketch it.
Then press Play.

Builderii is one infinite canvas for flowcharts, mind maps, wireframes and clickable prototypes, with an AI that builds right alongside you and your whole team live on the same board.

Example prompt: a dog-walking app with booking, a live map and payments
App screens Flowchart Mind map Sequence Sitemap Roadmap
Build it

Works in your browser · No card · Plugins for Claude and ChatGPT

The Builderii editor: the component library on the left, four linked phone screens of a planner app on the canvas, and the inspector with fidelity, brand colour and theme fonts on the right.

Works with

  • Claude
  • ChatGPT
  • Claude Code
  • Mermaid
  • Excalidraw
  • draw.io
  • PowerPoint
  • Google Fonts
  • Mobbin
  • YouTube
  • Figma embeds
  • Loom
  • SQL & Prisma
  • CSV
  • Jira & Linear CSV

01 The canvas

Every kind of diagram, one infinite board.

Flowcharts, mind maps, app screens, sequence diagrams, sitemaps, database diagrams, roadmaps and workshops sit side by side, on as many pages as you like. Every picture below is a real Builderii board.

ROD shapes ⌥→ quick-add Tab mind map ⇧W fidelity / AI ⌘K commands ⌘↵ play

02 AI

An AI that builds alongside you.

Ask for app screens, a flowchart, a mind map, a sequence or database diagram, a sitemap or a roadmap. The AI plans it, layout engines place it, and you keep editing. Ask again and it changes what’s there instead of starting over.

From a prompt to a board

One sentence becomes 1–8 linked screens with a start screen, ready to play. Or a flowchart, a mind map, a brainstorm in columns, or any other diagram.

Phone screens for a dog-walking app that Builderii's AI built from one prompt.

Change it by asking

Select part of a diagram and say what to change. It’s edited in place, as one undo step.

Add a review step after Payment, and rename Cart to Bag
Changed “Checkout”1 step added · 1 renamed · 2 arrows
Editing 3 shapes

Review AI changes

Turn it on and every change waits for you: accept or reject each one, or all of them.

  • Added Review orderAccept
  • Changed PaymentAccept
  • Removed Coupon stepReject

Screenshot or sketch → wireframe

Drop in a screenshot or a photo of a whiteboard, or draw with the pen. It comes back as editable components.

Make it real

Turn a screen into a live HTML preview beside it, plus a React and Tailwind component to hand off.

export function SignIn() {
  return (
    <form className="space-y-4">
      <Input label="Email" />
      <Button>Sign in</Button>
    </form>

Specs from your screens

The spec writer reads a flow and writes the goals, user stories with Given / When / Then for every screen and branch, edge cases and open questions. Copy Markdown, or a CSV for Jira or Linear.

User story · Checkout

As a shopper, I want to pay with a saved card so I can check out in one tap.

Given a saved card When I tap Pay Then I see the confirmation

MarkdownCSV for JiraCSV for Linear

A partner for workshops

Group stickies by theme with a preview before anything moves, summarise a board into key points and next steps, rewrite text in any tone or language, or expand an idea with ⌘.

Runs on Claude through Amazon Bedrock · 500 AI jobs a month per person, counted in your profile · Your prompts and boards are never logged.

03 Wireframes

Low-fi, high-fi, Rendered.

Switch the whole board between a sketchy low fidelity and a polished high fidelity in your brand colour with ⇧W. Then let Rendered redraw your screens as final designs.

Rendered Discover screen: search, category chips, and product cards with real photos of trail runners and a striped canvas tote. Rendered product screen for the Ridgeline Trail Runner: a large photo, star rating, size picker, Add to cart button, shipping and returns. Rendered cart: the trail runner and the tote with quantity steppers, a total of $218 and a Checkout button. Rendered checkout: name, address and card fields, a Pay $218 button and an order summary with product photos.
Rendered Real product photos, in our violet Apply
Rendered redraws your screens as final designs, styled after similar real apps on Mobbin and filled with real photos. Steer it in chat (“darker”, “more photos”), then Apply: each render becomes editable layers in a new screen below its wireframe, with the prototype links moved over.
  • 46 componentsIn six groups: basics, inputs, navigation, content, overlays and website sections
  • Responsive variantsThe selected screens again for phone, tablet or web, links kept, no AI needed
  • Accessibility checkContrast, tap targets, labels and headings, pinned on the canvas with one-click fixes
  • Plays both waysThe prototype player runs the wireframes or the Rendered version

04 Brand & type

Your brand, read straight from your website.

Paste a web address and Builderii reads the page and its stylesheets: the colours it uses most, its heading and body fonts, its corner radius and its tone. Every screen on the board takes them.

https://northwind.exampleUse brand
Accent
HeadingsRecoleta on the site Fraunces closest Google font
BodyInter the site’s own, on Google Fonts
Rounding12 px on high-fidelity screens
Tone“Warm, crafted, unhurried”

1,631 Google font families

Aa

PrimaryLarger text, headings

Aa

SecondarySmall print, under 14 px

Give a board two theme fonts from the whole Google Fonts catalogue; they load only when used. Any element can still pick its own.

Components take your colours

Every UI component has its own fill, stroke and text colour: accent controls take the fill, everything else its background.

05 Prototypes & tests

Press Play. Then watch people use it.

Link buttons, cards or anything else to a screen and the board plays full screen in a device frame. Share a test link and see where people tap, where they get stuck and how far they get.

Today ▾Click anywhere to reveal hotspots · ← back · R restart
The prototype player showing the Today screen of a planner app.

Test results example

18sessions
72%reached the end
0:48average length
5missed taps
  • Taps on links
  • Taps that missed
  1. Welcome18
  2. Sign in17
  3. Today13
  • Click and hover triggers
  • Dissolve, slide and push
  • Back stack and restart
  • Hotspot hints
  • Test links with ?test=1
  • Heatmaps per screen
  • Time on screen and drop-off
  • Results kept 180 days
  • Present frames as slides
  • Presenter view with notes

06 Collaboration

Your whole team, live on one board.

Cursors, selections and edits stream every frame, as in Figma. Comment, mention, follow someone’s view, and share with exactly the access each person needs.

2CommentResolve
MA
Maya 2m

@Leo can invited people skip the verification code?

LE
Leo now

Good call, adding a branch for invites.

Leo was notified and emailed a link to this comment

Live cursors and edits

Named cursors, others’ selections, text as it’s typed. Guests on a share link join live too.

Follow and spotlight

Click an avatar to follow someone’s view, or ask everyone to follow yours.

Cursor chat and reactions

Press ; to talk at your cursor, 1–6 to send a reaction floating up.

Comments and @mentions

Pinned threads with replies. A mention sends a notification and an email straight to the comment.

Roles in sharing

Invite by email as editor, commenter or viewer and change it later. Link access from none to edit.

Teams and projects

Team boards everyone can edit, and shared project folders that include every board inside.

Undo that’s yours

On a shared board, undo takes back only your own changes. What others did stays.

Voting and timer

Dot-vote with cursors hidden, and keep a workshop on time with a countdown.

07 And the rest

The details that save your afternoon.

Embeds on any site

Put a live, view-only board in your docs or site with an iframe, optionally starting in the prototype.

Link previews

Paste a link for a card with its image and title. YouTube, Loom, Vimeo and Figma play in place.

Your own templates

Save any board as a template for everyone who can open it, or for your whole team. 18 built in.

Version history

Automatic versions as you work, named versions when it matters, and restore in a click.

Import anything

Excalidraw, draw.io, Mermaid, CSV (as a table or an org chart), SQL and Prisma. Paste from a spreadsheet.

Export everywhere

PNG, SVG, PDF, PowerPoint with speaker notes, draw.io, Mermaid, SQL and Builderii JSON.

Diagram as code

A two-way Mermaid pane: edit the code or the shapes, and each follows the other.

Present

Frames become slides, with speaker notes and a presenter view that keeps time.

My components

Save a selection as a component and drop a fresh copy on any board.

Find and replace

Every page’s text, labels, frame names and table cells, one undo step per page.

On your phone

Open any board to look, comment and play its prototype, with pinch to zoom.

Light and dark

A calm studio canvas either way, with shapes and stickies tuned for both.

08 Claude & ChatGPT

Build boards from Claude and ChatGPT.

Builderii’s MCP server gives your assistant 37 tools that work as you: generate any diagram from a prompt or a screenshot, change one by name, read boards, add pages and comments. Results land on the board live, with a picture in the chat and an Open in Builderii button.

Claude

Claude plugin

The connection plus six skills: builderii, app-screens, diagram, brainstorm, feedback and summarize. In Claude Code, one command:

claude plugin install builderii --marketplace https://app.builderii.com/plugins/claude/marketplace.json
ChatGPT

ChatGPT app and plugin

Connect Builderii in ChatGPT and sign in with OAuth: you see who’s asking and what it can do, then Allow.

MCP

Any MCP client

Cursor and other agents connect to the same server with OAuth 2.1, or a personal access token you can revoke.

https://app.builderii.com/mcp
New chat
Draw our checkout as a flowchart in Builderii, with the payment-failed path.
Builderiicreate_flowchartdone
Checkout flow9 steps · 2 decisions
Open in Builderii
Done. It’s on your board with a branch for failed payments that loops back to the card form. Want screens for each step too?

09 Who it’s for

From the first idea to the working prototype.

Founders & PMs

“Show the idea to investors or engineers this afternoon.”

Prompt → linked screens → Play → share link

Designers

“Explore flows fast, before the polish.”

Low-fi kit, flows, Rendered, code handoff

Engineers

“Diagram the system and keep it current.”

Sequence, architecture, SQL, two-way Mermaid

Facilitators

“Run a retro or a brainstorm.”

Stickies, voting, timer, AI grouping and summaries

Students & writers

“Think it through.”

Mind maps with AI expand, and docs

Coming from another tool? See Builderii as a Figma alternative, a Whimsical alternative, a FigJam alternative or a Miro alternative, or read Figma vs Whimsical.

10 Pricing

Start free. Everything’s included.

Builderii is free while it’s new, with every feature on. Join by November 13 and it stays free for you, for life. Paid plans will come with their AI allowances published, and viewers and commenters stay free.

Free Now

$0for everyone

Join by Nov 13: free for life

  • Unlimited boards and pages
  • Every diagram, wireframe and prototype
  • 500 AI jobs a month per person
  • Live collaboration, comments and sharing
  • Claude and ChatGPT plugins, MCP
  • Every import and export
Start building

Pro Planned

Per editorviewers always free

  • More AI each month
  • Password-protected share links
  • 90 days of version history
Coming later

Team Planned

Per editorAI pooled across the team

  • Team folders and pooled AI
  • Custom domain for share links
  • Unlimited version history
  • SSO and an audit log
Coming later

11 Questions

Good questions.

What can I make in Builderii?

Flowcharts, mind maps, app and website wireframes in low or high fidelity, clickable prototypes, sequence diagrams, sitemaps, database diagrams, roadmaps, org charts, architecture diagrams, workshops with sticky notes, and docs, all on one board with as many pages as you need.

Which AI does it use?

Claude, through Amazon Bedrock. Every AI action runs as a job with strict schemas, and the result is laid out by Builderii’s own layout engines, so diagrams stay tidy and editable. Your prompts and boards are never logged.

What does Rendered need?

Rendered finds similar real app screens on Mobbin to style your designs after, so it asks you to sign in to Mobbin once. Renders are temporary until you press Apply, which turns them into editable screens on the board.

How do Claude and ChatGPT connect?

Through Builderii’s MCP server. Add it in Claude, Claude Code or ChatGPT (or install the plugin), sign in, and allow access. You can see and disconnect connected apps in Settings, and make personal access tokens for agents that can’t sign in.

Can I bring my existing diagrams?

Yes. Import or paste Excalidraw, draw.io and Mermaid, paste cells from a spreadsheet as a table or an org chart, and paste SQL or Prisma to draw a database. Export goes to PNG, SVG, PDF, PowerPoint, draw.io, Mermaid, SQL and JSON.

Does it work on my phone?

On a phone, boards open for looking: pan, pinch to zoom, read and open comments, copy the link and play the prototype. Making and editing boards is for a computer or a tablet.

Is Builderii an alternative to Figma or Whimsical?

For early product work, yes: Builderii has Whimsical’s keyboard speed for flowcharts, mind maps and wireframes, and Figma-style screens and clickable prototypes, on one board with AI. For final, pixel-perfect UI and design systems, Figma is still the tool. See every comparison.

Can the AI make wireframes and flowcharts from a prompt?

Yes. Describe what you need and the AI draws linked app screens, flowcharts, mind maps, sequence diagrams, sitemaps, roadmaps or database diagrams, laid out by Builderii and editable like anything else. Ask again and it changes them in place.

Who can see my boards?

Only the people you share them with, at the role you choose: editor, commenter or viewer. Link access is off until you turn it on, and roles are enforced on the server.

What do you want to build?

Start with a prompt, a template or a blank board. It’s free.