我做了一个 Agent Learning Lab：把 AI 应用开发过程做成白盒实验台

最近我开发了一个 AI 应用学习项目，叫 Agent Learning Lab。

项目地址：

https://chat.onekey-ai.top

这个项目的定位不是普通聊天机器人，而是一个面向 AI 应用开发学习的实验台。

它的核心目标是：

把 Prompt、结构化输出、上下文管理、RAG、工具调用、Workflow、Agent 等能力拆成独立模块，让每个能力都能单独实验、单独查看、单独复盘。

目前项目已经具备了一批基础实验模块，后续还会继续完善联网搜索、Function Call、MCP、Skill、Workflow Agent 和 Mini Personal Agent 等能力。

这篇文章主要记录一下这个项目目前的设计思路、页面特点、技术实现方向和后续规划。

一、项目背景

现在很多人都在学习 AI 应用开发，也有很多人开始讨论 Agent。

但对开发者来说，只看概念很容易停留在表面。

比如：

text 复制代码

Prompt 到底怎么控制模型？
模型输出怎么稳定变成 JSON？
长对话上下文怎么管理？
RAG 检索到的内容怎么展示？
模型调用过程怎么调试？
一个 Agent 的执行链路怎么观察？

这些问题如果只看文章，很难真正理解。

所以我做了这个项目。

我希望通过一个可运行的系统，把 AI 应用开发里的关键能力拆开实现，并且在页面上尽量展示每一步的执行过程。

也就是说，这个项目不是为了做一个"看起来很智能"的聊天框，而是为了做一个：

text 复制代码

能学习
能调试
能观察
能复盘
能持续扩展的 AI 应用实验台

二、项目定位

Agent Learning Lab 的核心定位是：

AI 应用开发工程师学习实验台。

它不是一个单纯的 ChatGPT 套壳页面。

普通聊天页面通常只有：

text 复制代码

输入问题
等待模型回答
展示最终结果

但是这个项目更关注 AI 应用背后的工程过程。

例如：

text 复制代码

Prompt 是怎么组织的？
模型原始输出是什么？
结构化解析结果是什么？
校验有没有失败？
上下文压缩保留了哪些信息？
RAG 检索到了哪些片段？
最终回答依据来自哪里？

这些过程对于学习 AI 应用开发非常重要。

因为真实项目里，模型回答只是结果，真正难的是中间过程的设计、调试和稳定性控制。

三、页面设计：按能力模块拆分，而不是全部挤在一个页面

这个项目在页面设计上，我没有选择把所有功能都堆到一个聊天页面里。

而是采用模块化设计。

每个模块对应一种 AI 应用能力。

目前项目里已经包含了这些能力模块：

text 复制代码

Prompt Playground
结构化输出实验
上下文压缩实验
Local RAG 实验

后续还会继续扩展：

text 复制代码

联网搜索
Function Call
MCP
Skill
Workflow Agent
Mini Personal Agent

这种设计有几个好处。

第一，学习路径更清晰。

每次只关注一个能力，不会被一堆功能混在一起干扰。

第二，调试更方便。

比如结构化输出失败，就只看结构化输出模块；RAG 检索不准，就只看 RAG 模块。

第三，方便沉淀文档。

每个模块都能对应一篇技术文档，说明它解决什么问题、怎么实现、有哪些坑。

第四，适合后续扩展。

后面增加 Function Call、MCP、Workflow 时，不需要推翻原来的页面结构，只需要继续增加模块。

四、项目最核心的特点：白盒 Trace

这个项目目前最重要的特点是：白盒化。

很多 AI 应用都是黑盒的。

用户输入一句话，模型返回一段话。

中间发生了什么，页面完全看不到。

但对开发者来说，中间过程才是最有价值的。

所以 Agent Learning Lab 会尽量展示每个模块的执行细节。

例如在不同模块中，可以看到：

text 复制代码

原始输入
System Prompt
User Prompt
模型原始输出
结构化解析结果
Schema 校验结果
上下文压缩结果
RAG 检索片段
引用来源
耗时信息
失败原因
重试记录

这样做的目的不是为了让页面复杂，而是为了让 AI 应用过程可观察。

因为只有可观察，才能调试。

只有可调试，才能优化。

只有能优化，才算真正进入工程化。

这也是我做这个项目时非常重视的一点。

五、技术文档：项目经验必须沉淀下来

除了页面和功能，我在这个项目里还特别重视技术文档。

因为这个项目本身是学习型项目，如果只写代码，不写文档，很多设计思路很快就会忘。

所以每个模块都应该有对应的文档说明：

text 复制代码

这个模块解决什么问题
为什么需要这个能力
核心流程是什么
前端怎么展示
后端怎么设计
失败情况怎么处理
后续可以怎么扩展
面试时可以怎么讲

技术文档不是附属品，而是项目的一部分。

尤其是 AI 应用项目，里面有很多 Prompt、Schema、上下文、检索、模型返回、错误重试等细节。

这些细节如果不记录，后续很难复盘。

对我来说，这个项目既是一个功能项目，也是一个技术沉淀项目。

六、项目目前的技术方向

这个项目目前的技术方向可以概括为：

text 复制代码

前端模块化页面
后端 AI 能力服务
模型调用封装
结构化输出校验
上下文状态管理
本地知识库检索
白盒 Trace 展示
技术文档沉淀

整体思路是：

text 复制代码

每个 AI 能力单独模块化
每次执行都尽量展示过程
每个模块都保留可调试信息
每个能力都能逐步扩展到 Agent 系统里

后续再继续补充工具调用、MCP、Skill、Workflow 之后，这个项目会逐渐从 AI 应用学习实验台扩展成一个更完整的 Agent 学习系统。

七、后续规划

Agent Learning Lab 后续会继续完善更多能力。

联网搜索

让系统可以获取最新资料，比如最新岗位要求、AI 应用开发趋势、技术资料等。

重点会关注：

text 复制代码

Query Rewrite
搜索结果筛选
网页内容提取
来源可信度
时效性
引用展示
Prompt Injection 防护

Function Call

让模型在需要时调用确定性函数。

比如：

text 复制代码

计算技能匹配度
生成学习任务
渲染报告预览
统计资料数量

模型负责理解任务，程序负责确定性计算。

MCP

把外部工具和资源用标准方式接入系统。

例如：

text 复制代码

读取简历
读取学习笔记
查询岗位样本
生成任务预览

MCP 的重点不是单个函数调用，而是工具和资源的标准化接入。

Skill

沉淀可复用任务手册。

比如：

text 复制代码

岗位分析 Skill
简历优化 Skill
学习计划生成 Skill
面试准备 Skill

Skill 更像是一套任务操作说明，让模型在面对某类任务时能稳定执行。

Workflow Agent

把多个能力串成可观察、可重试、可分支的流程。

例如：

text 复制代码

输入目标岗位
抽取岗位技能
检索个人资料
计算技能差距
生成学习计划
生成报告
用户确认
导出结果

这里会重点处理：

text 复制代码

state
node
edge
router
retry
checkpoint
human approval
trace

Mini Personal Agent

在前面能力都具备之后，再实现一个安全版的个人 Agent Loop。

它不会做危险自动化，而是聚焦在：

text 复制代码

接收目标
判断下一步
读取资料
调用安全工具
生成结果
等待用户确认

八、我对这个项目的总结

Agent Learning Lab 目前对我最大的价值，不是某一个具体功能，而是把 AI 应用开发过程拆清楚了。

它让我把很多原本抽象的概念，变成了可以运行、可以观察、可以调试的模块。

比如：

text 复制代码

Prompt 不再只是提示词，而是模型行为控制入口。
结构化输出不再只是返回 JSON，而是模型结果工程化。
上下文压缩不再只是总结，而是任务状态管理。
RAG 不再只是向量数据库，而是基于资料回答的完整链路。

后续继续接入 Function Call、MCP、Skill、Workflow 和 Agent Loop 后，这个项目会更接近完整的 Agent 学习系统。

如果要用一句话总结这个项目：

Agent Learning Lab 是一个把 AI 应用开发能力拆开、跑通、白盒展示，并持续组装成 Agent 能力的学习实验台。

它不是一个完结项目，而是一个长期迭代项目。

后面我会继续边做边记录。