我的 AI Coding 工作流实践：从需求澄清到跨 Agent 交付
这篇文章分享我在个人开发和公司项目中实际使用的 AI Coding 工作流。重点不是罗列 Skill，而是说明不同阶段应该留下什么工程产物，以及如何让任务跨会话、跨 Agent 后仍然可以继续。
目录
1. 个人使用的 AI Coding 工作流实践分享
我的工作流分为开发前、开发中和开发完成三个阶段：
| 阶段 | Skills | 主要作用 |
|---|---|---|
| 开发前 | + repo-scan 扫描仓库+ screenshot-to-code 截图转代码+ agent-reach 各社区平台cli登录爬虫数据+ vue-best-practices vue最佳实践+ pretty-mermaid 流程图生成+ archify 架构图生成 |
了解项目、补充外部信息、加载技术规范，必要时先画清流程和架构 |
| 开发中 | + matt-pocock ai coding plugins ○ grill-me / grill-with-docs 盘问 ○ Wayfinder 导航 ○ research 调研 ○ prototype 原型 ○ to-spec 规格 ○ to-tickets 拆单 ○ codebase-design 架构 ○ tdd 测试 ○ implement 实现 ○ diagnosing-bugs 调试 |
澄清需求、解决未知问题、形成共识、拆分任务并完成实现 |
| 开发完成 | + code-review 代码审查+ review-push 快速审查到& 推送 |
检查实现是否符合规范与需求，再按授权提交和推送 |
这不是一条每次都要完整执行的流水线。小改动可以直接实现和验证；需求模糊、任务庞大或需要跨会话时，再逐步增加约束。
开发截图示例
grill me / grill with docs skill 效果图
review push 效果图
1.1 开发中的主链路
Matt Pocock 工作流中，我主要使用 grill-with-docs → to-spec → to-tickets → TDD → implement → code-review 这条主链，但完整用法还包含短任务、原型、Bug、架构治理和上下文切换等分支。
下图以当前官方 ask-matt 路由和端到端演示，并结合社区对 Issue 关系树、多 Agent 隔离和独立 Review 的实践。开发主链表示官方流程，按需介入为扩展功能， 来应对并行开发、若干决策路线记忆、原型需求描述等丰富场景。
官方端到端演示强调：短任务在 grill-with-docs 后可以直接进入 implement；只有需要多个上下文的任务才需要 to-spec 和 to-tickets。社区讨论中的差异主要集中在 Ticket 如何组织、多 Agent 如何隔离，以及 Review 是否放到全新上下文中执行。
1.2 跨会话、跨 Agent 如何承接任务
跨会话的关键不是让新 Agent 重新阅读全部聊天记录，而是把状态固化成可读取、可验证的项目产物。
| Skill | 什么时候使用 | 留下什么 | 如何承接下一次会话或 Agent |
|---|---|---|---|
grill-with-docs |
需求和术语尚未对齐 | 共识、领域语言、ADR 或 CONTEXT.md |
新 Agent 先读取统一术语和既有决策 |
Wayfinder |
大型需求存在多条决策路线 | 决策地图和依赖关系 | 每次只解决一个未决节点，结果写回地图 |
to-spec |
需求已经达成共识 | 目标、非目标、关键决策和验收标准 | Spec 成为后续实现与审查的共同契约 |
to-tickets |
一次上下文无法完成整个 Spec | 带依赖关系的纵向任务切片 | 一个 Agent 或一次新会话处理一张 Ticket |
handoff |
任务未拆分，但当前上下文即将结束 | 已完成内容、失败尝试、当前状态和下一步 | 新 Agent 从明确状态继续，不重新猜测 |
实际选择可以进一步压缩成三条：
- 大任务跨会话：
to-spec+to-tickets或grill-with-docs沉淀的CONTEXT.md。 - 当前会话临时中断：
handoff。 - 多 Agent 并行：按 Ticket 依赖分配任务，最后使用独立上下文执行
code-review。
无论使用哪种方式，Spec、Tickets、决策、研究结论和 Handoff 都应该进入仓库或 Issue 系统，不能只保存在聊天窗口中。
1.3 最小质量约束
- 任务必须说明目标、非目标、允许修改范围和验收方式。
- “已完成”必须附测试、构建、页面、日志或指标等可检查证据。
- 模型不能只用自己的完成声明证明自己正确。
- 提交、推送和部署属于独立授权，不能从“帮我改代码”自动推导。
这就是我理解的 Harness Engineering：不用越来越长的 Prompt 控制模型，而是通过工程状态、工具权限、测试反馈、真实运行环境和 Review 门禁限制错误半径。
2. 不同模型及档位适用的场景
不是所有任务都需要最强模型和最高推理强度。简单任务拉满档位，通常只会增加等待、成本和过度设计。
| 任务 | 默认模型 | 推理强度 |
|---|---|---|
| 文案、样式、明确的小修改 | GPT-5.6 Luna / Terra | medium |
| 文档、普通功能 | GPT-5.6 Sol | medium / high |
| 多模块功能、疑难 Bug、性能问题 | GPT-5.6 Sol / GPT-6 Astra | high |
| UI 与交互高度定制、重构 | GPT-6 Astra | medium / high |
| 架构决策、高风险迁移、长时间自治任务 | GPT-6 Astra | xhigh / max |
默认从能够完成任务的最低合理档位开始，只有在验证失败或复杂度明显上升时升级。
价格比对
按本文核验时的官方 API 价格：
- GPT-5.6 Sol 为
$4/M输入、$20/M输出。 - GPT-6 Astra 为
$10/M输入、$50/M输出，约相差2.5倍。
团队中应结合质量、耗时和 Token 消耗建立自己的任务评测，而不是统一拉满。
3. 前端相关插件扩展
下面这些能力属于前端扩展，不是通用工作流的必选项。
| 工具 | 用途 |
|---|---|
screenshot-to-code |
根据截图还原页面结构和样式 |
vue-best-practices |
为 Vue 项目加载 Composition API、TypeScript 等工程规范 |
ui-ux-pro-max |
生成或补全 UI、交互和视觉细节 |
web-design-guidelines |
审查响应式、可访问性和 Web 界面规范 |
redesign-existing-projects |
基于现有产品做系统性重设计 |
| Ego Lite 浏览器 （当前仅支持 Windows / MacOS） | 让 Agent 操作真实浏览器并检查页面状态, 补足浏览器交互和真实页面验收, 但这个app目前为止尚无 Linux 版本。 |
vite-plugin-vue-inspector |
在 Vue + Vite 页面中点击元素并跳转到对应源码, 负责缩短从页面元素定位到组件源码的时间，QML 项目需要另行寻找对应的 Inspector 能力。 |
前端任务不能以“构建通过”作为唯一完成标准。Agent 还需要打开实际页面、执行主要路径、检查控制台，并在目标视口验证布局。
4. 辅助开发Skills及工具
skills
| Skills | 用途 |
|---|---|
repo-scan |
在安装、运行或依赖外部仓库前检查项目和供应链风险 |
agent-reach |
通过多平台 CLI 获取外部信息源，为研究和需求判断补充材料 |
pretty-mermaid |
绘制项目流程图、时序图和状态图 |
archify |
生成更完整的项目架构图和可交互图示 |
review-push |
对少量代码变更执行审查、提交和推送的组合流程 |
工具
- Ego Lite: 一个专为AI代理（如Claude Code）设计的浏览器，允许代理直接复用你已登录的浏览器状态，在独立、隔离的空间里并行执行网页自动化任务，且不影响你前台正常使用浏览器。
- vite-plugin-vue-inspector: 一个Vite开发插件，让你在浏览器中点击Vue组件时，能自动在代码编辑器（如VS Code）中打开其对应的源代码文件，方便调试。
- Doubao Murmur: 一款利用豆包（Doubao）Web语音识别能力的极简全局语音输入工具，按下快捷键即可在任意输入框中实现语音转文字。
注意
团队环境中尚未具备的 Skill，将在正式分享前统一补充来源、安装方式和支持的 Agent。
5. 相关 Skill 一键安装
将下面的提示词复制给当前 Agent。它会先检查本机和当前项目中已经存在的 Skill，再补装缺失项。
前端岗位安装提示词
请为当前设备和当前 Agent 检查并安装本文工作流涉及的 Agent Skills。从Vercel开发的https://www.skills.sh/ 这个网站里提取。
先审计，后安装；保留已有内容，只补缺失项。
目标 Skills：
1. 通用与前置能力
repo-scan、screenshot-to-code、agent-reach、vue-best-practices、pretty-mermaid、archify。
2. Matt Pocock 工作流
grill-me、grill-with-docs、wayfinder、research、prototype、to-spec、to-tickets、handoff、codebase-design、tdd、implement、diagnosing-bugs、code-review。
3. 前端与交付能力
ui-ux-pro-max、web-design-guidelines、redesign-existing-projects、review-push。
按以下顺序执行：
1. 识别当前操作系统、Shell、当前 Agent 类型、用户级 Skill 目录、项目级 Skill 目录及仓库内的 Agent 配置。使用当前 Agent 的原生安装方式，不假定所有工具都使用同一个目录。
2. 在用户级、项目级和共享 Skill 目录中搜索上述名称，同时检查符号链接和同名别名。验证每个已安装项是否包含可读取的 SKILL.md，并记录其实际路径和来源。
3. 输出安装前盘点表：Skill、状态（已安装/缺失/冲突）、现有路径、来源、准备执行的动作。完成盘点后再开始安装。
4. 对已安装的 Skill 保持原样，不覆盖、不重复安装，也不自动升级。发现本地修改、同名多份或来源冲突时，保留现场并报告。
5. Matt Pocock 相关 Skills 只从官方仓库 https://github.com/mattpocock/skills 获取。按照当前 Agent 支持的方式安装，并补齐源 Skill 明确依赖的基础能力，例如 grilling、domain-modeling 和 setup-matt-pocock-skills。
6. 其他 Skill 优先从当前环境已有的官方/团队 Skill 目录、当前仓库声明的来源或可信 Skill 注册表解析。候选仓库存在时，先做只读安全检查，再安装。无法确认唯一可信来源时停止该项并向我索要来源，不要安装随机同名仓库。
7. review-push 是个人 Skill。如果本机和团队目录中都不存在，列为“缺少来源”，不要自行寻找同名替代品。开源下载 `npx skills add nov-ai-story/review-push -g -y`
9. 安装后逐项验收：确认目录存在、SKILL.md 可读、当前 Agent 能发现该 Skill、没有生成重复副本。运行安装器提供的只读列表或校验命令，并记录失败项。
10. 最终输出结果表：已存在、成功安装、跳过、需要我提供来源、外部工具待确认。注明哪些 Skill 需要重启 Agent 或开启新会话后才会生效。
不要只给安装计划；完成审计后直接安装所有来源明确且不需要额外授权的缺失 Skill。只有来源不明、会覆盖本地修改，或需要管理员权限/修改项目依赖时才暂停询问。
其他岗位安装提示词
请帮我为当前设备和 Agent 一键安装前端开发所需的 Agent Skills。
📌 安装来源：
● Matt Pocock 系列：从 https://github.com/mattpocock/skills 安装
● review-push：从 npx skills add nov-ai-story/review-push -g -y 安装
● 其他前端 Skills：从当前环境已有的官方/团队 Skill 目录安装
🎯 需要安装的 Skills：
screenshot-to-code、vue-best-practices、ui-ux-pro-max、web-design-guidelines、redesign-existing-projects、review-push、grill-me、grill-with-docs、wayfinder、research、prototype、to-spec、to-tickets、handoff、codebase-design、tdd、implement、diagnosing-bugs、code-review
⚙️ 安装要求：
1. 先审计当前已安装的 Skills（检查用户级、项目级目录）
2. 只补充缺失的，不覆盖已有内容
3. 安装后验证每个 Skill 的 SKILL.md 是否可读
4. 输出安装结果清单（已存在/成功安装/失败/需手动处理）
⚠️ 注意：
● 如果某个 Skill 来源不明确，跳过并报告，不要自行寻找替代品
● 安装完成后提示哪些需要重启 Agent 生效
● 非前端 Skills（repo-scan、agent-reach、pretty-mermaid、archify）不安装
开始执行。