Master the art of distributed system flows.
Most architecture diagrams die on the whiteboard.
Boxes, arrows, maybe a fancy tool export — but once the meeting ends, they just sit there, static and lifeless.
What happens when real traffic starts to flow? Where will queues back up, which services will choke, and how will errors spread through the system?
That’s exactly why I built Flowmancer: a place where diagrams don’t stop at pretty lines.
Here, they move. Requests flow across services, load balancers split traffic, caches either save the day or let bottlenecks creep in.
In seconds, you see the behavior of your architecture as if you had X-ray vision.
☕ Sip a coffee…
I wanted a sandbox for my own work — a place where I could drop in the diagrams I draw every day, hit “play,” and watch them breathe.
Flowmancer gives me exactly that: a safe way to experiment with topologies, simulate bottlenecks, and learn before real systems get expensive.
Think of it as a playground for architects and engineers.
It’s not a replacement for enterprise monitoring; it’s the step before.
When you want to test “what if we add another cache?” or “what if this queue fills up?”, Flowmancer lets you see it instantly.
✨ What it can do
While the soul of Flowmancer is experimentation, there are plenty of tools under the hood:
- Visual Graph Editor – draw your system with drag-and-drop, and let ELK.js handle automatic layouts.
- Real-time traffic simulation – requests move smoothly at 60 FPS, showing throughput, latency, and error propagation.
- Advanced metrics dashboard – explore bottlenecks, utilization, path analysis, and boundary group stats.
- Interactive console – type commands to reconfigure nodes, change error rates, or disable services mid-simulation.
- Import/export – start from PlantUML, Draw.io, or JSON; export results to share with your team.
- Customization – adjust node capacities, latency distributions, hit ratios, even routing weights.
All of this runs directly in the browser, no backend required.
🏢 Why it matters at work
In professional life, we often discover system weaknesses too late — during load testing, or worse, in production.
Flowmancer makes it easy to anticipate those issues earlier.
You can:
- Stress-test architectural decisions without spinning up infrastructure.
- Show teammates visually why a bottleneck matters.
- Teach juniors how distributed systems behave under pressure.
- Prototype new designs and compare scenarios side by side.
It’s not a silver bullet, but it’s a powerful companion for anyone who wants to understand their systems beyond the whiteboard.
👨💻 Under the hood
Flowmancer is built with Vue 3, TypeScript, and Vite, using ELK.js for graph layouts.
The simulation engine is deterministic and reproducible, so results are stable and not just pretty animations.
Everything runs locally in the browser — clean, fast, and fully open source.
🚀 Try it
Curious to see your diagrams come alive?
👉 Live demo
👉 Source code on GitHub