# Multi-Agent Visualization Landscape

**Research date:** 2026-05-26  
**Purpose:** Identify proven UI patterns for InfiniBot's Agent Activity dashboard, which shows multiple Claude Code sub-agents running in parallel with live cards, progress %, checkpoints, and status.

---

## Quick Comparison Table

| Tool | Category | Stars | OSS | Multi-agent view type | Best InfiniBot idea |
|------|----------|-------|-----|-----------------------|---------------------|
| **LangGraph Studio** | Orchestration IDE | ~langchain repo | Partial (LangSmith SaaS) | DAG graph + live node highlighting | Step-by-step debug mode per agent |
| **Langfuse** | Observability | 27.9k | Yes (Apache-2.0) | Trace tree + Agent Graph (beta) | Inferred agent graph from timing/nesting |
| **AgentOps** | Observability | 5.6k | Partial SDK | Session list + event timeline + chat replay | Session-level cost + event graph per agent |
| **Arize Phoenix** | Observability | 9.1k | ELv2 | OpenTelemetry trace spans + eval overlay | Eval scores pinned to agent card |
| **Helicone** | Observability | 5.7k | Apache-2.0 | Sessions view + cost/latency drilldown | Session-level latency + cost per agent |
| **Lunary** | Observability | ~1k | Apache-2.0 (core) | Trace logs + analytics dashboard | Cost + error-rate sparklines on cards |
| **AutoGen Studio** | Builder/Studio | ~autogen 58.4k | MIT | Task canvas + profiler charts | Profiler showing tool-use frequency |
| **Magentic-UI** | Builder/Studio | 9.9k | MIT | Plan editor + browser side-panel | Co-planning panel (show agent's own task list) |
| **CrewAI Studio** | Builder/Studio | ~crewai | Enterprise SaaS | Node-edge canvas + real-time trace | Node canvas for subagent dependency viz |
| **Flowise** | Builder/Studio | 53.1k | MIT | Flow canvas + execution animation | Animated flow edges during execution |
| **OpenHands** | Coding agent | 74.8k | MIT | Single-agent chat + action log | Action-by-action log stream per card |
| **Cursor (Cloud Agents)** | Coding IDE | closed | No | Sidebar list + per-agent drawer | Sidebar fleet list with per-agent status chip |
| **Devin** | Coding agent | closed | No | "Agents" tab: child sessions grid | Sub-task child sessions linked to parent |
| **vibe-kanban** | Agent Kanban | 26.5k | OSS | Kanban columns + log stream drawer | Review drawer with diff + inline comments |
| **KanBots** | Agent Kanban | small | OSS | Live Kanban + per-card cost accrual | Real-time cost counter per task card |
| **Claude Code Agent Monitor** | Agent Monitor | 398 | MIT | Kanban (4-col) + Timeline + Session tree | Timeline tab with tool-aware payload renderers |
| **Mission Control (builderz)** | Agent Dashboard | small | OSS | 31-panel HUD + 6-col Kanban + memory graph | Visual knowledge graph for agent memory |
| **AgentsView** | Usage analytics | 1.1k | OSS | Heatmap + cost/token drill-down | Activity heatmap showing parallel agent density |

---

## 1. Multi-Agent Observability Dashboards

These tools were designed first as logging/tracing layers; multi-agent views are a second-order feature built on top of the trace model.

### Langfuse
**Repo:** [langfuse/langfuse](https://github.com/langfuse/langfuse) · **Stars:** 27.9k · **License:** Apache-2.0  
**Demo:** https://langfuse.com (cloud), self-hostable via Docker  
**OSS:** Yes — all core features included in the open-source build

Langfuse's multi-agent view is anchored to its **Trace Tree**: every agent call, tool use, and LLM request nests under a root trace as expandable spans. The new **Agent Graphs** feature (GA as of late 2025) automatically infers the graph structure from observation timings and parent-child nesting — no instrumentation changes required — and renders it as an interactive DAG. A secondary **Trace Log View** concatenates every step into a single scrollable stream, useful for "loopy, verbose agents" where the tree becomes hard to skim.

**Per-agent data shown:** span name, duration, token count, cost, model, status (success/error), input/output preview.

**What they do well:**
- Inferred DAG from timing — no extra metadata required
- Trace Log View as a flat linear alternative to the tree
- LangGraph integration renders named graph nodes directly

**What's missing for InfiniBot:** Langfuse sees _post-hoc_ traces, not _live_ running agents. There is no "3 agents currently running" fleet view — you must already have session IDs to navigate to.

**Ideas to steal:** The Trace Log View pattern (flat linear stream alongside the tree view) is excellent for InfiniBot's checkpoint panel. The inferred-graph approach is elegant — InfiniBot could auto-draw a DAG of spawned subagents without requiring agents to emit structured metadata.

---

### Arize Phoenix
**Repo:** [Arize-ai/phoenix](https://github.com/Arize-ai/phoenix) · **Stars:** 9.1k · **License:** ELv2  
**Demo:** https://app.phoenix.arize.com (cloud), self-hostable  
**OSS:** Partial — ELv2 restricts competing SaaS; local self-hosting is unrestricted

Phoenix uses OpenTelemetry as its data model, making it the most standards-aligned option. The trace view shows nested spans with start/end timestamps rendered as a horizontal Gantt-style waterfall. An **Evals overlay** can annotate any span with evaluation scores (hallucination rate, relevance, etc.) which appear as colored badges on span rows.

**Per-agent data shown:** span name, latency bar, token cost, LLM model, eval scores, input/output payloads, error messages.

**What they do well:**
- Gantt waterfall for parallel span visualization — immediately shows overlap
- Eval scores _on_ the span rather than in a separate view
- Strong OpenTelemetry compatibility means InfiniBot could instrument existing Claude Code output without a new SDK

**What's missing:** Like Langfuse, no "currently running agents" live fleet view. Designed for post-run analysis.

**Ideas to steal:** The Gantt waterfall is the best visualization InfiniBot could add to its agent cards — a horizontal bar showing each tool call with its duration, overlapping when parallel subtasks run. Eval scores on individual checkpoint items would also be a premium differentiator.

---

### AgentOps
**Repo:** [AgentOps-AI/agentops](https://github.com/AgentOps-AI/agentops) · **Stars:** 5.6k · **License:** MIT (SDK), SaaS dashboard  
**Demo:** https://app.agentops.ai (requires login)  
**OSS:** SDK is MIT; dashboard is proprietary SaaS

The AgentOps dashboard centers on **Sessions**. Each session maps to one agent run and displays: total execution time, SDK version, framework (CrewAI/AutoGen/etc.), LLM calls as a chat-history view, and event graphs (bar charts of tool call frequency and timing). Multi-agent runs appear as linked sessions or nested spans. A **Step-by-step replay** feature lets you scrub through the event timeline like a video.

**Per-agent data shown:** start/end time, duration, total cost, model, framework, events count, error flags.

**What they do well:**
- Session list view with sortable columns — easy to compare N agent runs at a glance
- Step-by-step event replay with scrubbing
- Framework metadata (CrewAI vs AutoGen vs etc.) surfaced on session cards

**What's missing:** The multi-agent _simultaneous_ view is weak — you see a list of sessions, not a live parallel status overview.

**Ideas to steal:** The session list sortable by cost, duration, error count is a good inspiration for InfiniBot's "recently completed" feed. The step-by-step replay is worth considering for completed sessions.

---

### Helicone
**Repo:** [Helicone/helicone](https://github.com/Helicone/helicone) · **Stars:** 5.7k · **License:** Apache-2.0  
**Demo:** https://helicone.ai (cloud), Docker self-host  
**OSS:** Yes

Helicone is primarily an **AI Gateway** with observability bolted on. Its dashboard focuses on aggregate metrics (requests/hour, cost trends, latency percentiles) with drill-down to individual requests. The redesigned **Sessions view** (late 2025) groups related LLM calls by session ID, shows session-level metrics (total cost, average latency), and supports filtering/search. LangGraph integration adds named node visibility.

**Per-agent data shown:** session cost, latency, model distribution, request count, error rate.

**What they do well:**
- Cost and latency are first-class metrics on every row, not buried in a detail panel
- Time-series charts showing cost trends per session group
- Session-level aggregation is clean and fast to scan

**What's missing:** No live agent status — this is a request-level logging tool, not an agent orchestration monitor.

**Ideas to steal:** Cost displayed on every card as a running total (not just in a detail panel) is a pattern InfiniBot should adopt. Helicone's "smarter filters" UX — filter by model, error state, cost range — is worth replicating on InfiniBot's agent list.

---

### Lunary
**Repo:** [lunary-ai/lunary](https://github.com/lunary-ai/lunary) · **Stars:** ~1k · **License:** Apache-2.0 (core)  
**Demo:** https://lunary.ai (cloud), self-hostable  
**OSS:** Core is Apache-2.0; Enterprise features gated

Lunary is lightweight relative to Langfuse/Phoenix. Its strength is the **real-time analytics dashboard** with customizable charts: error rates, latency histograms, cost per user, and model distribution. Per-agent tracing is supported but the multi-agent view is a simple list of runs. The free tier (10k events/month) makes it accessible for small teams.

**Per-agent data shown:** latency, cost, model, error rate, user-level attribution.

**Ideas to steal:** Lunary's focus on _user_ and _project_ attribution within the same dashboard (showing "which project is consuming the most tokens") could inspire InfiniBot's multi-agent view to show which _workflow_ each agent belongs to.

---

## 2. Agent Orchestration Studios with UI

These tools ship a full builder interface — the multi-agent view is a first-class design target rather than an afterthought.

### LangGraph Studio
**Repo:** [langchain-ai/langgraph](https://github.com/langchain-ai/langgraph) · **Stars:** large (LangChain ecosystem) · **License:** MIT  
**Demo:** LangSmith cloud (requires login); local Desktop App (macOS)  
**OSS:** Framework is MIT; Studio UI requires LangSmith account for full features

LangGraph Studio is the closest thing to an "agent IDE." The UI splits into three panels: left shows a **flowchart DAG** with nodes (start → agent → tool → end) connected by labeled edges; center shows the **thread/conversation history** with state diffs at each step; right is the **input panel** for replaying or modifying state. During execution, the currently active node pulses/highlights in the DAG. A **debug mode** lets you pause after each graph step, modify state, and resume.

**Per-agent data shown:** which graph node is active, state snapshot at each step, tool name + arguments, error annotations on nodes.

**What they do well:**
- Live node highlighting during execution — shows _where_ in the graph you are
- State diff at each step — shows exactly what changed per step, not just the output
- One-click node rerun from any checkpoint

**What's missing:** Designed for single-graph visualization, not a fleet of simultaneous graphs. You cannot see 8 LangGraph instances running in parallel on one screen.

**Ideas to steal:** State diff visualization per checkpoint. The idea of showing "currently active node" as a pulsing highlight on InfiniBot's checkpoint list is directly applicable — highlight the _current_ checkpoint row.

---

### AutoGen Studio
**Repo:** [microsoft/autogen](https://github.com/microsoft/autogen) · **Stars:** 58.4k · **License:** MIT  
**Demo:** `autogenstudio ui --port 8081` (local)  
**OSS:** Yes (framework in maintenance mode; Microsoft Agent Framework is successor)

AutoGen Studio is explicitly a **prototyping tool**, not production-grade. Its UI has three views: Build (drag-and-drop agent + tool configuration), Playground (run a task and watch agent messages stream), and Gallery (saved workflows). The Playground shows a message-by-message agent stream in a chat-like interface with a side-panel profiler showing tool call frequency, code execution count, and agent interaction graph.

**Per-agent data shown:** messages between agents, tool calls, code execution outputs, per-agent token counts.

**Ideas to steal:** The **profiler panel** showing tool-call frequency as horizontal bars is a compact and useful addition to InfiniBot's session detail view. The "Gallery" concept — saved workflow templates that can be re-launched — maps to InfiniBot's workflow seeds.

---

### Magentic-UI (Microsoft)
**Repo:** [microsoft/magentic-ui](https://github.com/microsoft/magentic-ui) · **Stars:** 9.9k · **License:** MIT  
**Demo:** `pip install magentic-ui && magentic-ui` (local)  
**OSS:** Yes

Magentic-UI's defining feature is **co-planning**: before execution begins, the UI shows the agent's step-by-step plan as an editable list. Users can add, remove, or reorder steps. During execution, the left panel shows plan progress (checked off steps with status), while the right panel shows the browser the agent is controlling. An **Action Guard** mechanism pops a confirmation modal for high-risk actions (file delete, form submit).

**Per-agent data shown:** planned steps with completion status, current action, browser screenshot, risk level of pending action.

**What they do well:**
- Editable pre-execution plan — transparency before the agent does anything
- Human-in-the-loop approval gates surfaced inline, not in a separate settings panel
- Plan learning (remembered plans for repeated tasks)

**Ideas to steal:** The **editable plan displayed before execution** is something InfiniBot could show when a subagent is spawned — show the agent's proposed task list as a checklist users can approve or modify before the agent starts. The Action Guard confirmation modal pattern is directly relevant to InfiniBot's approval workflow.

---

### Flowise
**Repo:** [FlowiseAI/Flowise](https://github.com/FlowiseAI/Flowise) · **Stars:** 53.1k · **License:** MIT  
**Demo:** `npx flowise start` (local) or https://cloud.flowiseai.com  
**OSS:** Yes

Flowise's visual canvas shows agents as nodes with typed input/output edges. The Agentflow builder supports multi-agent systems as nested subgraph nodes. During execution, edges animate as data flows between nodes — a visual "pulse" travels along the connection. There is no fleet view for multiple simultaneous runs, but the execution trace panel shows per-node latency and output.

**Per-agent data shown:** node input/output at each step, per-node latency, error state highlighted in red.

**Ideas to steal:** Animated flow edges during execution are visually compelling and could be used in InfiniBot's subagent spawn visualization to show data flowing from the parent to child agents.

---

### Dify
**Repo:** [langgenius/dify](https://github.com/langgenius/dify) · **Stars:** 106k · **License:** Apache-2.0  
**Demo:** https://cloud.dify.ai (cloud), Docker self-host  
**OSS:** Yes

Dify combines a workflow canvas, prompt management, RAG pipelines, and observability in one product. The workflow canvas is the most polished of any open-source option — nodes are well-designed, context panels slide in from the right, and the execution log shows a per-node expandable output. The **Monitoring** tab integrates with Langfuse and Phoenix for external observability.

**Per-agent data shown:** node type, execution status (running/done/error), output preview, total workflow cost, per-step latency.

**Ideas to steal:** Dify's per-node output preview — a truncated one-line summary of what the node produced — would translate well to InfiniBot's checkpoint list. The slide-in context panel for node details (without navigating away from the canvas) is excellent UX.

---

## 3. Coding Agent Activity Surfaces

These tools are the closest match to InfiniBot's use case: visualizing _many parallel coding agents_ with task context and live progress.

### Cursor (Cloud Agents / Cursor 3)
**Status:** Closed source, requires Cursor Pro subscription  
**Demo:** https://cursor.com/agents (web monitor)

Cursor 3 is the most advanced public example of a **coding agent fleet UI**. The interface shows all running cloud agents in a **unified sidebar** — each agent as a list item with: task description, runtime duration, cloud/local indicator, and status chip. Clicking an agent opens a drawer with its full output log and action buttons (commit, push, open in local). Up to 8 agents can run in parallel, each in an isolated Ubuntu VM on a separate git branch. Agents automatically generate **demos, screenshots, and video walkthroughs** of their completed work.

**Per-agent data shown:** task name, duration, status, cloud/local environment, automated output demo, branch name.

**What they do well:**
- Sidebar fleet list is clean and scannable for 8+ agents
- Automatic demo/screenshot generation for completed work — agents document themselves
- Launch from Slack, GitHub, Linear, web, or mobile — agent is accessible from anywhere

**What's missing:** Sidebar is relatively low-information (no cost, no progress %, no checkpoint detail). The "new UI coming soon" note suggests even Cursor knows it needs more.

**Ideas to steal:** **Agent self-documentation** — triggering a screenshot or summary when an agent completes. The ability to launch agents from external surfaces (GitHub issue → spawn agent) is something InfiniBot's kanban-to-agent pipeline already partially does.

---

### Devin (Cognition)
**Status:** Closed source, requires Devin Pro subscription  
**Demo:** https://devin.ai

Devin 2.0 introduced a dedicated **"Agents" tab** that appears automatically when a session spawns child sessions. The tab shows a grid of child agent cards with: status badge, current todo items, and linked PRs. The parent agent acts as coordinator — scoping work, monitoring progress, resolving conflicts. This is functionally a supervisor-worker architecture made visible in the UI.

**Per-agent data shown:** session name, status, open todos, pull request links, execution environment.

**What they do well:**
- The "child sessions automatically appear under parent" model is elegant — no manual linking
- Todo list _per agent card_ creates a task-level view within each agent

**Ideas to steal:** The **parent-child session hierarchy** surfaced in the UI is directly applicable to InfiniBot's spawner/subagent model. Show the parent agent's card with expandable child sessions nested below it.

---

### OpenHands
**Repo:** [OpenHands/OpenHands](https://github.com/OpenHands/OpenHands) · **Stars:** 74.8k · **License:** MIT  
**Demo:** https://www.openhands.dev (cloud), local Docker  
**OSS:** Yes

OpenHands focuses on a single-agent interaction but the GUI exposes a rich **Action Log** alongside the conversation — every file read, terminal command, code edit, and browser navigation appears as a timestamped event with expandable detail. For multi-agent large-codebase tasks, OpenHands decomposes work by dependency tree and runs isolated agents per component, but the UI does not (yet) show a parallel fleet view.

**Per-agent data shown:** action type, target file/URL, command output, status (running/done/error).

**Ideas to steal:** The **action log with typed icons** (terminal icon for bash, file icon for reads, diff icon for edits) is highly applicable to InfiniBot's checkpoint stream. Each checkpoint entry should be visually typed, not just text.

---

### vibe-kanban (BloopAI)
**Repo:** [BloopAI/vibe-kanban](https://github.com/BloopAI/vibe-kanban) · **Stars:** 26.5k · **License:** OSS  
**Demo:** https://vibekanban.com  
**OSS:** Yes

vibe-kanban is the most directly relevant open-source project for InfiniBot's use case. It structures agent work as Kanban issues → Workspaces. Each workspace gives an agent a branch, terminal, and dev server in an isolated git worktree. The columns are: To Do → In Progress → Review → Done. When a card is In Progress, a **log stream drawer** opens showing the agent's live terminal output — thinking, files read, code generated. When work completes, the Review state shows a **line-by-line diff** with inline comment support and an "Open in IDE" button.

**Per-agent data shown:** task description, current column/status, agent type (Claude Code / Codex / Gemini / Amp / etc.), live log stream, diff on completion.

**What they do well:**
- Kanban is the right mental model for task lifecycle management
- Log stream drawer opens without leaving the board — no context switch
- Review diff with inline comments is exactly the right review UX
- 10+ agent backend support (multi-vendor)
- Git worktree isolation per agent — parallel without conflicts

**What's missing:** No cost tracking per card, no progress % estimate, no parent/child hierarchy, no sparkline analytics.

**Ideas to steal:** The **Review state with diff + inline comments** is the single best pattern InfiniBot should adopt. When a subagent completes, transition the card to Review and render the diff output inline. The log stream drawer opening on click (not navigation) should replace InfiniBot's current modal approach.

---

### Claude Code Agent Monitor
**Repo:** [hoangsonww/Claude-Code-Agent-Monitor](https://github.com/hoangsonww/Claude-Code-Agent-Monitor) · **Stars:** 398 · **License:** MIT  
**Demo:** localhost after install (Node + SQLite)  
**OSS:** Yes

The most feature-complete open-source Claude-specific monitoring dashboard. Navigation: Dashboard, Kanban, Sessions, Activity Feed, Analytics, Workflows, Settings. The **Kanban board** has two toggle views: Agents (Working/Waiting/Completed/Error) and Sessions (Active/Waiting/Completed/Error/Abandoned). Each card shows model, running cost, and current tool at a glance. The **Timeline tab** renders chronological tool events with Pre/Post grouping by tool_use_id and tool-aware renderers (terminal styling for Bash, diff view for Edit operations). WebSocket-driven so no polling lag.

**Per-agent data shown:** model, cost, current tool, status column, subagent hierarchy tree, token flow strips, tool usage bars.

**What they do well:**
- Tool-aware event renderers in Timeline (Bash looks like a terminal, Edit shows a diff) — not just plain text
- Composite health score ring on the Health tab is a compelling summary metric
- Subagent hierarchy tree in the session detail view — visual tree of spawned agents
- Two-toggle Kanban (agent view / session view) serves different audiences

**Ideas to steal:** The **tool-aware Timeline tab** is directly applicable to InfiniBot — instead of rendering every checkpoint as a text string, render bash outputs as terminal blocks and file edits as diffs. The **subagent hierarchy tree** in session detail is exactly what InfiniBot's parent/child session model needs.

---

### AgentsView
**Repo:** [kenn-io/agentsview](https://github.com/kenn-io/agentsview) · **Stars:** 1.1k · **License:** OSS  
**Demo:** local (Electron app)  
**OSS:** Yes

A usage analytics tool (not a live monitor) that aggregates session data from 25+ agents including Claude Code, Codex, Cursor, and Copilot CLI. Key features: token/cost breakdown per session and per model, daily spend charts, **activity heatmap** showing which hours and days see the most agent activity, full-text search across session transcripts, and live SSE updates for active sessions.

**Ideas to steal:** The **activity heatmap** (GitHub-style grid showing agent activity density over time) would be a compelling addition to InfiniBot's analytics view. Full-text search across past session transcripts is highly practical for a power user.

---

## 4. General "Live Activity Feed" Inspiration

### GitHub Actions Dashboard
The GitHub Actions runs view for a single repository is a masterclass in parallel job visualization: each workflow run is a row with a duration bar, status badge (queued/in-progress/success/failure), and trigger context (branch, actor, commit message). Within a run, parallel jobs render as a **swimlane layout** showing which jobs ran concurrently. Log output streams in real-time with collapsible step groups.

**Steal:** Swimlane layout for parallel subagents (horizontal time axis, each agent on its own row). Collapsible step groups within a log stream.

### Vercel Deployments Page
Vercel's deployment list uses a **card-per-deployment** layout with: project name, git branch, status pill (Building/Ready/Error), duration, ago-timestamp, and actor avatar. Clicking opens a build log that streams live. Cards are color-coded by status. A "promoted to production" banner appears on the most recent successful deploy.

**Steal:** Color-coded status pill that is immediately visible without reading text. Actor/trigger attribution on every card. "Promoted" / "Current Production" banner pattern for InfiniBot's "active workflow run."

### Linear's Project View
Linear added an **Agent Interaction SDK** (mid-2025) that lets external agents share structured status: `actively_working`, `waiting_for_input`, `completed`, `error`. The project timeline view shows tasks as horizontal bars on a date axis — the classic Gantt. Linear automatically renders agent-provided reasoning steps, tool usage, and final responses in the issue activity feed.

**Steal:** Structured status enum (`working` / `waiting` / `error` / `done`) rendered as distinct badge styles — not just color but icon. Reasoning steps exposed as expandable accordion rows within the issue/task activity feed.

---

## Shortlist: Top 3 and Concrete Next Steps

### #1 — vibe-kanban (closest model, steal the Review/diff UX)

vibe-kanban's lifecycle model (issue → in-progress → review → done) and the log stream drawer are the best direct match for InfiniBot's agent card paradigm. InfiniBot already has the kanban backend; the missing pieces are:

1. **Review state with inline diff.** When a subagent completes a coding task, transition its card to a Review column and render the git diff directly in the card's expanded view. Add a quick-approve/reject action.
2. **Log stream drawer (slide-in, not modal).** Replace the current modal approach for session detail with a side-drawer that opens on card click, showing the live log stream without navigating away from the agent activity page.
3. **Per-card agent type badge.** Show which agent backend (claude-code, codex, gemini-cli) handled the task — useful when InfiniBot runs mixed backends.

---

### #2 — Claude Code Agent Monitor (steal tool-aware timeline + subagent tree)

This project solves the exact same problem as InfiniBot's agent-activity view and has already solved several hard display problems. Key items to borrow:

1. **Tool-aware checkpoint renderers.** Bash tool calls → terminal-style block with monospace output. Edit/Write calls → diff view with +/- line highlighting. Read calls → file path with truncated preview. This makes the checkpoint stream scannable at a glance.
2. **Subagent hierarchy tree in session detail.** When InfiniBot's parent Claude Code session spawns sub-agents, render them as an expandable tree in the session detail panel — not just a flat list.
3. **Two-toggle Kanban.** Add an "Agents view" toggle alongside the current "Sessions view" so users can switch between task-centric and agent-centric perspectives of the same data.

---

### #3 — Arize Phoenix / Langfuse (steal Gantt waterfall + inferred agent graph)

For a power-user "dive deep" mode, InfiniBot should borrow:

1. **Gantt waterfall strip on each agent card.** A compact horizontal timeline bar on each card showing tool call durations as colored segments — immediately conveys whether an agent is spending time on bash, file reads, or LLM thinking.
2. **Inferred agent graph.** From parent/child session relationships and timing, auto-draw a DAG showing which sessions spawned which, with edges labeled by task type. This is Langfuse's "Agent Graphs" feature applied to InfiniBot's subagent registry.
3. **Eval badge on completed tasks.** After a task completes, run a lightweight eval (did the kanban task succeed? did tests pass?) and show a pass/fail badge on the completed card — a pattern Phoenix uses for LLM eval scores on spans.

---

## Summary of UI Patterns InfiniBot Should Adopt

| Pattern | Source | Priority |
|---------|--------|----------|
| Review column with inline diff + approve/reject | vibe-kanban | High |
| Log stream side-drawer (not modal) | vibe-kanban, Devin | High |
| Tool-aware checkpoint renderers (bash=terminal, edit=diff) | Claude Code Monitor | High |
| Parent–child session hierarchy tree | Devin, Claude Code Monitor | High |
| Cost running-total on every agent card | Helicone, KanBots, Claude Code Monitor | Medium |
| Compact Gantt strip per card (tool call timeline) | Arize Phoenix | Medium |
| Status badges with icons (not just color) | Linear, Vercel, GitHub Actions | Medium |
| Editable pre-execution plan checklist | Magentic-UI | Medium |
| Activity heatmap (analytics view) | AgentsView | Low |
| Inferred subagent DAG visualization | Langfuse Agent Graphs | Low |
| Self-documenting agents (auto screenshot/summary on complete) | Cursor Cloud Agents | Low |

---

## Sources

- [LangGraph Studio announcement](https://www.langchain.com/blog/langgraph-studio-the-first-agent-ide)
- [Langfuse Agent Graphs docs](https://langfuse.com/docs/observability/features/agent-graphs)
- [Langfuse GitHub (27.9k stars)](https://github.com/langfuse/langfuse)
- [Arize Phoenix GitHub (9.1k stars)](https://github.com/Arize-ai/phoenix)
- [AgentOps GitHub (5.6k stars)](https://github.com/AgentOps-AI/agentops)
- [AgentOps concurrent sessions](https://docs.agentops.ai/v1/usage/multiple-sessions)
- [Helicone GitHub (5.7k stars)](https://github.com/Helicone/helicone)
- [AutoGen GitHub (58.4k stars)](https://github.com/microsoft/autogen)
- [AutoGen Studio docs](https://microsoft.github.io/autogen/dev//user-guide/autogenstudio-user-guide/index.html)
- [Magentic-UI GitHub (9.9k stars)](https://github.com/microsoft/magentic-ui)
- [Magentic-UI blog post (Microsoft Research)](https://www.microsoft.com/en-us/research/blog/magentic-ui-an-experimental-human-centered-web-agent/)
- [Flowise GitHub (53.1k stars)](https://github.com/FlowiseAI/Flowise)
- [Dify GitHub (106k stars)](https://github.com/langgenius/dify)
- [OpenHands GitHub (74.8k stars)](https://github.com/OpenHands/OpenHands)
- [Cursor 3 agent fleet article](https://the-decoder.com/new-cursor-3-ditches-the-classic-ide-layout-for-an-agent-first-interface-built-around-parallel-ai-fleets/)
- [Cursor 2.0 changelog](https://cursor.com/changelog/2-0)
- [Devin 2.0 session view](https://medium.com/@takafumi.endo/agent-native-development-a-deep-dive-into-devin-2-0s-technical-design-3451587d23c0)
- [vibe-kanban GitHub (26.5k stars)](https://github.com/BloopAI/vibe-kanban)
- [vibe-kanban article (VirtusLab)](https://virtuslab.com/blog/ai/vibe-kanban)
- [KanBots](https://www.kanbots.dev/)
- [DanWahlin ai-agent-board GitHub](https://github.com/DanWahlin/ai-agent-board)
- [Claude Code Agent Monitor GitHub (398 stars)](https://github.com/hoangsonww/Claude-Code-Agent-Monitor)
- [AgentsView GitHub (1.1k stars)](https://github.com/kenn-io/agentsview)
- [Mission Control builderz](https://mc.builderz.dev/)
- [AG-UI multi-agent demo (Microsoft)](https://devblogs.microsoft.com/agent-framework/ag-ui-multi-agent-workflow-demo/)
- [Marc Nuri AI coding agent dashboard](https://blog.marcnuri.com/ai-coding-agent-dashboard)
- [Linear Agent SDK changelog](https://linear.app/changelog/2025-07-30-agent-interaction-guidelines-and-sdk)
- [MindStudio Claude Code agent view](https://www.mindstudio.ai/blog/claude-code-agent-view-manage-multiple-agents-3)
