# AgentScope Studio — Agent Tracing UI

> AgentScope Studio is a local visualization toolkit: Projects/Runs UI, OpenTelemetry-based tracing, and eval dashboards for AgentScope agents.

## Install

Copy the content below into your project:

## Quick Use

```bash
npm install -g @agentscope/studio
as_studio
```

## Intro

AgentScope Studio is a local visualization toolkit: Projects/Runs UI, OpenTelemetry-based tracing, and eval dashboards for AgentScope agents.

- **Best for:** Developers who need trace + eval visibility while iterating on agents
- **Works with:** Node.js 20+; npm 10+; optional Docker; integrates with AgentScope (per README)
- **Setup time:** 10–30 minutes

## Practical Notes

- GitHub: 542 stars · 57 forks; pushed 2026-03-06 (verified via GitHub API).
- README recommends Node.js >=20 and provides an npm global install with a single `as_studio` entrypoint.
- README highlights OpenTelemetry tracing and evaluation analysis as first-class UI features.

## Main

Make the UI actionable, not decorative:

1. Define a “run” contract: inputs, tools allowed, timeouts, and environment.
2. Capture traces for every run and keep them searchable by version (prompt/model/agent code).
3. Add simple evals (pass/fail rubrics) and correlate them with trace patterns (retries, tool failures, long spans).
4. Use the UI to produce a reproducible bug report: trace link + inputs + expected vs actual.

This is how agent debugging becomes engineering work instead of guesswork.

### FAQ

**Q: Do I need to use AgentScope?**
A: README positions it as AgentScope-focused, but the tracing concepts are OpenTelemetry-based.

**Q: Is Docker required?**
A: No—README lists Docker as optional; the recommended install is via npm.

**Q: What should I track first?**
A: Start with latency and tool failures, then add token usage and cost annotations.

## Source & Thanks

> Source: https://github.com/agentscope-ai/agentscope-studio
> License: Apache-2.0
> GitHub stars: 542 · forks: 118

---

<!-- ZH -->

## 快速使用

```bash
npm install -g @agentscope/studio
as_studio
```

## 简介

AgentScope Studio 是面向 agent 开发的本地可视化工具：提供项目/运行管理界面、基于 OpenTelemetry 的 tracing 展示，以及评测分析面板，适合把 agent 调试流程标准化。

- **适合谁：** 需要 tracing + 评测可视化来迭代 agent 的开发者
- **可搭配：** Node.js 20+；npm 10+；可选 Docker；与 AgentScope 集成（见 README）
- **准备时间：** 10–30 分钟

## 实战建议

- GitHub：542 stars · 57 forks；最近更新 2026-03-06（GitHub API 验证）。
- README 推荐 Node.js >=20，并提供 npm 全局安装与 `as_studio` 一键启动。
- README 将 OpenTelemetry tracing 与评测分析作为核心能力展示。

## 主要内容

让可视化真正服务工程：

1. 先定义“Run”契约：输入、允许的工具、超时与运行环境。
2. 每次 run 都采集 trace，并按版本（prompt/model/agent 代码）可检索。
3. 加入最小可用的评测（通过/失败），并把结果与 trace 模式关联（重试次数、工具失败、长耗时 span）。
4. 用 UI 输出可复现 bug report：trace 链接 + 输入 + 期望/实际差异。

这样 agent 调试就从“玄学”变成可复现的工程工作。

### FAQ

**必须配合 AgentScope 吗？**
答：README 以 AgentScope 为主，但 tracing 思路基于 OpenTelemetry，可迁移到其他栈。

**一定要 Docker 吗？**
答：不一定。README 写 Docker 为可选，推荐 npm 安装。

**第一步该追踪什么？**
答：先看延迟与工具失败，再逐步加入 token 与成本标注。

## 来源与感谢

> Source: https://github.com/agentscope-ai/agentscope-studio
> License: Apache-2.0
> GitHub stars: 542 · forks: 118


---
Source: https://tokrepo.com/en/workflows/agentscope-studio-agent-tracing-ui
Author: Agent Toolkit