MCP-native

Visual plan board
for AI coding agents

See your agent's plan before it executes. Catch mistakes early, manage context efficiently, and ship with confidence. Visual plans are easier to read and debug than walls of text.

FlowPlan interface showing plan board with card details and feedback
Works with

Everything you need to manage
AI agent workflows

FlowPlan gives you visibility and control over what your AI coding agents plan to do, before they do it.

Interactive Flow Diagrams

Cards automatically lay out as a dependency graph. Drag to reposition, zoom, pan. Connect cards by dragging between handles.

File Change Previews

Each card lists affected files with proposed code changes. Click any file to open a full code viewer with syntax highlighting.

Two-Way Feedback

Ask questions, give directives, or report issues directly on cards. The agent reads and responds through the same MCP connection.

History Timeline

Every change is recorded. Scrub through history to see what was added, modified, or removed. Visual diff highlights on the canvas.

5 Card Types

Research, Planning, Create, Edit, Test. Color-coded and tagged so you can see the shape of work at a glance.

Export & Import

Export plans as SVG for documentation or JSON for backup. Import JSON plans to restore or share between machines.

Card with file changes and directives Issue feedback and state machine card

Stop reading walls of text.
Start seeing the plan.

AI agents dump execution plans as plain text in your terminal. FlowPlan turns that into something you can actually read, review, and fix.

Catch Errors Before Execution

Review every proposed file change, dependency, and step before the agent touches your codebase. Spot wrong approaches, missing files, or broken dependencies at a glance.

Manage Token Usage

Instead of letting the agent burn tokens executing a flawed plan, review it visually first. Give directives to fix the approach — saving time, tokens, and frustration.

Visual > Text

A flow diagram with color-coded cards, dependency arrows, and file lists is instantly scannable. Text plans buried in a terminal scroll are not. You can debug what you can see.

Intervene, Don't Just Watch

Leave directives on specific cards to correct the agent's approach. Ask questions about unclear steps. Report issues before they become bugs in your code.


Three steps to visual plans

FlowPlan runs as a local desktop app with a built-in MCP server. Your AI agent connects and pushes plans in real-time.

01

Launch FlowPlan

Download the latest desktop release and launch the app. The MCP server boots automatically on port 3100, ready to accept connections.

Download v1.2.1
// MCP server is ready as soon as the app opens
http://localhost:3100/mcp
02

Connect Your Agent

Add FlowPlan as an MCP server in your agent's config. Works with any client that supports Streamable HTTP transport.

{
  "mcpServers": {
    "flowplan": {
      "type": "http",
      "url": "http://localhost:3100/mcp"
    }
  }
}
03

Ask the Agent to Plan

Tell your agent to create a plan. It calls FlowPlan's MCP tools to populate cards, files, and dependencies. You see it all live.

"Create a FlowPlan for refactoring
the database layer. Include proposed
code changes for each step."

How teams use FlowPlan

From solo developers to engineering teams, FlowPlan adds structure and visibility to AI-assisted coding.

Feature Development

Break down complex features into planning, implementation, and testing cards. Preview every file change before the agent writes a single line.

create planning

Large-Scale Refactoring

Visualize refactoring steps as a dependency graph. Ensure the agent tackles files in the right order and nothing falls through the cracks.

edit test

Migration Planning

Plan database migrations, framework upgrades, or API version bumps step by step. See every affected file and dependency before executing.

planning edit

Code Review Prep

Before submitting, have the agent lay out all changes in a FlowPlan. Review the proposed diff card by card, leave directives for adjustments.

planning edit

Bug Fix Planning

Plan bug fixes with clear steps: identify affected files, outline the fix, and add test cards for verification. All before touching the code.

edit test

Team Onboarding

New team members can read exported plans to understand how features were built. The history timeline shows the evolution of decisions.

planning create
Tip: Use AI to edit your plans

FlowPlan supports manual card editing, but we recommend making changes through your AI agent instead. The agent retains full context of the plan, dependencies, and file changes — resulting in more consistent updates and better context management across your entire workflow.


How you interact with the plan

FlowPlan is a two-way bridge between you and your AI agent. Here's how the communication works in practice.

01

Copy references, paste to agent

Every plan and card has a "Copy ref" button. Click it to copy a structured reference to your clipboard, then paste it directly into your agent's chat. The agent parses the plan and card IDs to target the exact card.

Card reference
[FlowPlan] "Auth Refactor" (plan-123) > "Add JWT middleware" (card-456)
What you tell the agent
"Update this card: [FlowPlan] ... (card-456) — add error handling for expired tokens."
02

Leave feedback on cards

Right-click any card to add feedback. Three types, each with a different agent response:

03

Tell the agent to process feedback

After leaving feedback on cards, tell the agent to pick it up. The agent calls get_all_feedback, processes each item, and responds or updates the plan accordingly.

What you tell the agent
"Check FlowPlan for any pending feedback. Answer the questions and follow the directives."
04

Iterative plan updates

Plans evolve. Tell the agent to read the current board and make changes. It calls get_cards to see the current state, then update_card or add_cards to modify. Every change is tracked in the history timeline.

What you tell the agent
"Look at the current FlowPlan board. Update card X to include the new middleware file, and add a testing step that depends on it."

12 tools, one connection

FlowPlan exposes a complete set of MCP tools over Streamable HTTP. Any compatible agent can drive the board programmatically.

create_plan
Create a new plan board with title, icon, and description.
add_cards
Add one or more cards with type, files, dependencies, and code changes.
update_card
Update any card field: title, description, type, files, dependencies.
remove_card
Remove a card by ID. Dependencies are cleaned up automatically.
get_cards
Retrieve cards with pagination. Returns summaries without file change content.
get_plan
Get full plan with all cards and metadata.
list_plans
List all plans with IDs, titles, and card counts.
clear_plan
Remove all cards from a plan, keeping the plan itself.
reorder_cards
Set display order for cards on the canvas.
get_all_feedback
Retrieve pending feedback items: questions, directives, issues.
answer_feedback
Respond to a question feedback with an answer.
acknowledge_feedback
Mark directive or issue feedback as processed.
Research
Investigation & analysis
Planning
Architecture & design
Create
New files & features
Edit
Modify existing code
Test
Testing & validation

Up and running in minutes

FlowPlan is a desktop app built with Tauri. Download the latest Ubuntu or macOS release, launch it, and connect your agent.

1

Download & launch

release
// FlowPlan resolves the current release from latest.json https://github.com/Bariskau/flowplan/releases/latest/download/latest.json // Use the download menu below for direct installers
Download v1.2.1

Latest release: v1.2.1. Download links are resolved from the updater feed and mapped to direct GitHub installer assets.

2

Connect Claude Code

.mcp.json
{ "mcpServers": { "flowplan": { "type": "http", "url": "http://localhost:3100/mcp" } } }
3

Or via CLI

terminal
$ claude mcp add flowplan --transport http http://localhost:3100/mcp

See your plan before it runs

Stop guessing. Start visualizing. Catch errors before execution, save tokens, and ship with confidence.