Canvas 如何让 Agent 工作流可视化、可操控且省成本

Canvas 如何让 Agent 工作流可视化、可操控且省成本 | 前端进阶之旅

Full translation

完整中文译文

当我在大学期间，我加入了 VS Code 最早版本 AI 行内补全的 beta 测试。那感觉就像一个改变游戏规则的存在。从那以后，GenAI 从根本上改变了软件开发：人机协作的混合团队，开发者作为愿景家和编排者处于中心位置。我们正身处这场转型之中。

作为 GenAI 创新速度的自然副产品，我们现在有了帮助我们规划、构建、审查和发布代码的工具。但在当前状态下，许多工作流程仍然感觉是割裂的。上下文在对话和界面之间丢失，过多时间花在了审查 Agent 生成的工作上。Agent 可以比任何人类审查它们的速度更快地产生变更，而且大多数开发者工具最初并不是为多 Agent 编排而设计的。人们很容易失去对以下内容的追踪：什么运行过、什么改变了、什么被验证了、什么仍需要人类判断。

GitHub Copilot 应用是解决这一问题的重要一步。有一个我学会喜爱并几乎每天使用的功能——canvases。Canvases 让开发者和 Agent 在一个持久的、共享的界面上互动。它不再将聊天作为唯一发生工作的地方，而是让工作在其展开过程中可见、可操控、可审批。

Chat 擅长表达意图，但缺乏持久执行能力

我仍然相信聊天是我们拥有的最好的意图表达界面之一。它是你思考、提炼和指导的地方。它快速且灵活，特别是当问题仍然模糊的时候。

但一旦 Agent 开始做实际工作，聊天就变成了一长串指令、日志、转向和修正的滚动记录。重要的部分技术上都在，但被埋没了：计划、决策点、验证和审批时刻。如果你不得不从历史记录中重建所有这些，你已经在支付协调税了。

Canvases 通过给工作流程一个归属地来解决这个问题。它们让状态变得明确且持久。人类可以检查和引导。Agent 可以更新和推进。双方可以在不不断重放上下文的情况下保持对齐。

第一个构建：Java Modernization Studio

我构建的第一个 canvas 是 Java Modernization Studio。Java 现代化正是 visibility 和治理至关重要的那种工作流程：评估、规划、迁移任务、验证关卡，以及发布就绪。

在纯聊天体验中，这些步骤会混在一起。你仍然可以继续前进，但审计变得更难，规模化信任也变得更难，特别是有多个贡献者的情况下。团队不断问着同样昂贵的问题：我们现在处于哪个阶段？做了什么决策？什么被阻塞了？什么仍需要人类审批？

这个 studio 让每个阶段都变得明确且可检查。团队可以直接看到运营状态，而不是解析叙事性历史。他们可以验证它，而不是猜测发生了什么。人类审查者可以专注于高信号判断，而 Agent 则可以在检查点之间保持执行推进。

Explore the Java Modernization Studio canvas >

第二个构建：Site Studio

之后，我为一种非常不同的工作流程构建了 Site Studio：创建和管理个人网站内容。它是内容密集型而非迁移密集型，但编排挑战类似：部分进度、迭代编辑、审查循环和状态转换。

在纯聊天流程中，内容会很快漂移。一个部分被修订，然后再次修订，对什么是当前版本的信心下降。反馈分散，草稿重复，动能减缓，因为每次迭代都从重建上下文开始。

Site Studio 保持状态持久。部分状态可见。草稿值在工作发生时持久化。人类审查点是明确的。Agent 可以继续移动，而人类可以在不丢失线索的情况下转向、审批或重定向。

Explore the Site Studio canvas >

可复制的模式

在这两个 canvases 中，我发现了相同的可复制蓝图：

清晰定义工作流程状态
呈现重要的决策
立即持久化进度和草稿
保持明确的人类审批点

这将模式从逐 prompt 交互转变为持久的协作工作流程。你不再将每次对话当作全新开始，而是开始将每个工作流程视为一个有记忆、结构和控制机制的系统。

成本与效率：是的，canvases 是一种投资

我也想明确说明成本：canvases 可以是一种投资。例如，Site Studio 花费了我大约 2,000 AI 积分，而现代化 canvas 花费了我大约 3,000 AI 积分。它们需要努力才能设计和塑造好。

但从长远来看，特别是对于重复性工作流程，这种投资会有所回报。持久化界面减少了重复 prompt、减少了上下文丢失、减少了不必要的来回、减少了返工。随着时间推移，这可以节省时间和金钱，同时提高信任度和吞吐量。

所以对我来说，这不是"花更多 tokens 获得更好的 UX"。这是"投资于更好的工作流程架构，使 recurring 工作变得更高效、更可预测、更可控"。

现在在 awesome-copilot 上可用

我构建的 canvases——Java Modernization Studio 和 Site Studio——在 awesome-copilot 上可用，任何想要使用、适配或从中学习的人都可以访问。

如果你已经在使用 Copilot agents，一个实用的下一步是选择一个重复性工作流程，用 /create-canvas 围绕它构建一个最小 canvas。小起步，运行实际工作，从实际使用中迭代。如果它对你的团队有帮助，将其贡献回 awesome-copilot，让其他人也能受益。

我们在这场转型中仍处于早期，但方向是明确的。Agents 可以加速执行。人类提供愿景、判断和问责。Canvases 是使这种伙伴关系变得真实、持久和可扩展的一种方式。

Build your own canvas with /create-canvas and contribute it back to awesome-copilot >

Ayan Gupta 是 GitHub 的开发者倡导者，他帮助开发者和团队在 GitHub Copilot、Azure 和开源领域采用实用的 AI 驱动的开发工作流程。他是 Forbes 30 Under 30 荣誉获得者，此前共同创立了专注于扩大健康和教育获取机会的科技企业。他今天的工作中心是使 Agent 驱动的工作流程透明、可操控和可重复——在此之外，他喜欢木工和志愿服务。

How to bring your software delivery workflow into GitHub with agent apps

See how four GitHub agent apps can help you scope, secure, roll out, and ship a feature across the SDLC–all without leaving GitHub.

Write your first prompt with the GitHub Copilot app

Learn how to write your first prompt in the GitHub Copilot app, choose the right context and model, and start your first task with confidence.

Using the GitHub Copilot SDK for Java

Enterprise Java developers have a new superpower—drive GitHub Copilot from idiomatic Java code with annotations, virtual threads, and more.