OrchestrateLive
The Idea
As modern software development shifts from manual programming to orchestrating autonomous AI coding CLI agents (such as Claude Code, Cursor CLI, and Kilo CLI), developers are forced to track complex tasks through noisy, unstructured walls of text in terminal windows. We were inspired to replace this exhausting "terminal babysitting" with a dedicated, visual "Control Room" that lets developers see and hear what their agents are doing in real time.
How It Works
OrchestrateLive acts as a decoupled, local-first observability layer. A lightweight local Node.js server ingests and serializes active CLI agent session streams, broadcasting updates via high-throughput WebSockets directly to an interactive frontend dashboard. The browser UI parses the telemetry in real time—tracking execution stages, computing token consumption, and synthesizing ambient audio notifications using native browser APIs.
Main Features
- Unified Multi-Agent Dashboard: Aggregates parallel agent executions in one place, allowing users to switch seamlessly between a global multi-agent overview and dedicated single-agent inspection tabs.
- Visual Lifecycle Tracking: Maps real-time agent execution across clear stages: Thought ➜ Planning ➜ Reading ➜ Writing ➜ Terminal ➜ MCP ➜ Done.
- Real-Time Performance Telemetry: Displays instantaneous pipeline latency (ms), generation speed (tokens/sec), token usage (input/output), and context window saturation (%).
- Synthesized Ambient Audio: Uses the browser's native Web Audio API to procedurally generate distinct sound cues for agent milestones (e.g., thinking pings, file edit clicks, completion chimes), enabling hands-off background monitoring.
- Instant Diagnostic Filters: Isolates runtime errors, tool calls, and planning steps from the live activity feed with a single click.
- Zero Repo Footprint & 100% Privacy: Runs standalone from any directory without requiring SDKs, dependencies, or configuration files inside your project repositories, keeping all code and logs strictly on
localhost.
Technology Stack
- Frontend: Vanilla HTML5, CSS3 (glassmorphic dark UI, CSS variables, hardware-accelerated animations), Native JavaScript (No heavy framework bloat).
- Audio Engine: Native Browser Web Audio API (procedural oscillator sound synthesis).
- Backend Broker: Node.js, Express, WebSockets (
ws). - Storage: Browser
localStorage(client-side state persistence).
Intended Audience
Software engineers, AI developers, indie hackers, and technical builders who run multiple AI coding CLI agents simultaneously and need a clear, non-intrusive way to monitor execution, token usage, and errors.
🛠️ Challenges & Technical Learnings
- Burst Token & Speed Computation: AI agents generate outputs in uneven bursts. We calibrated lightweight parsing logic to accurately calculate live token metrics and processing speeds without dropping events or spiking host CPU usage.
- Synchronizing Concurrent Streams: Multiplexing multiple independent agent streams without race conditions required implementing an event-driven serialization handler on the backend broker.
- Building Ultra-Lightweight Software: We avoided heavy UI frameworks and external audio assets, proving that native web standards can deliver instantaneous performance with near-zero resource consumption.
Log in or sign up for Devpost to join the conversation.