🧩 Agent Architect

A visual canvas for designing multi-agent architectures. Draw your agents as boxes, wire them together, label every connection, and save each design as a project — a whiteboard purpose-built for planning agent systems before you build them.

Agent Architect is a small, fully local Electron app: no accounts, no network calls, no telemetry. Every design is a plain JSON file in data/ on your disk.

┌─ toolbar ────────────────────────────────────────────────────┐
│  + Agent   Fit   Templates          Untitled Project   Save  │
├──────────────────────────────────────────────────────────────┤
│                                                              │
│   ┌─ SCANNER ────────┐         feeds signals                 │
│   │ • polls source    │ ───────────────────► ┌─ JUDGE ─────┐ │
│   │ • filters noise   │                      │ • scores     │ │
│   └──────────────────┘                       │ • final gate │ │
│                                              └──────┬───────┘ │
│   ┌─ EXECUTOR ───────┐        approved only         │         │
│   │ • places action   │ ◄────────────────────────────┘         │
│   └──────────────────┘                                        │
│                                                              │
└──────────────── infinite canvas · pan · zoom ────────────────┘

What it does

• Agent boxes — named nodes with an outline color and bulleted notes (each note gets a colored dot, so a box reads like a mini spec card).
• Wires — drag connections between boxes; every wire can carry a text label describing what flows across it.
• Templates — save a reusable agent shape (name, color, default notes) and stamp copies onto any design.
• Projects — save/load/delete named designs from the built-in sidebar; each is one JSON file under data/.
• Canvas — pan, zoom, fit-to-window; dark theme.

Run it

npm install
npm start          # or start.bat on Windows

Requires Node.js. Electron is the only dependency.

Files

main.js       Electron main process — window + JSON project storage (IPC)
preload.js    context-isolated bridge between UI and storage
index.html    the UI shell: toolbar, canvas, sidebars, modals
app.js        all canvas logic — boxes, wires, drag, zoom, templates
styles.css    dark theme
data/         your saved designs (local only — gitignored)

Why

Agent systems are wiring problems: which agent talks to which, what crosses each wire, and where the gates are. Sketching that before writing code is the cheapest debugging you will ever do. This is the sketchpad.