# AI 全自动付流水线

今天上午有一个看起来不大的需求：调一下菜单分组、把一个内部页面对全员开放、再加一道权限。

**10:58** 我把需求扔给 AI，**15:23** 生产环境 `ci-deploy = success`。

中间 5 小时，我只做了 4 件事：

1. 澄清需求（5 分钟）
2. 批 plan（1 分钟）
3. 给 4 套测试账号（1 分钟）
4. 看 PR + 按 merge（2 分钟）

**加上看一眼飞书审批卡的 30 秒，全部有效介入：约 15 分钟。**

不是炫技，是想分享一种 **「让 AI 把流水线的每个工位都跑完，人只守关键的批准门」** 的协作姿势。这是一次**杠杆实验**——把自己挪到流水线最有杠杆的位置，剩下的让 AI 接力跑。一个人能干一个小团队的活。

### 一、核心思路：把交付拆成「专员」流水线

```mermaid
flowchart LR 
    Intent(["意图"]) --> Plan["计划"] 
    Plan --> Code["编码"] 
    Code --> Verify["验证"] 
    Verify --> Gate["审批门"] 
    Gate --> Deploy["部署"] 
    Deploy --> Wrap(["收尾"]) 
    
    classDef human fill:#ffe5e5,stroke:#c00,stroke-width:2.5px,color:#000 
    classDef agent fill:#e5f0ff,stroke:#06f,color:#000 
    
    class Intent,Gate human
    class Plan,Code,Verify,Deploy,Wrap agent
```

不是让一个超级 AI 做所有事，而是把交付拆成 **专门职责** 的小角色 (subagent)，每个角色：

* 有自己的 **目录边界**（越界会被 hook 拦下）
* 有自己的 **工具白名单**（只调它该调的）
* 跑完写一份**轨迹文件**留在硬盘上，让下一棒能接上

整条链：**意图 → 计划 → 编码 → 验证 → 审批 → 部署 → 收尾**，每一棒都是独立 agent。

> 关键点：人不是中介，是**审批节点**。AI 之间的 handoff 走文件，不走对话。

***

### 二、全流程时间线（5 小时内闭环）

#### 步骤 1️⃣ 澄清需求（10–15 分钟）

我把需求扔给 AI，它启动了一个「头脑风暴」流程——**一次只问一个问题**：

> "Q1：菜单这个分组改完后，普通用户在哪个分组里看到这个新功能？给你 3 个方案 + 推荐 + 各自的 trade-off"

我选 C，它接着问 Q2、Q3。聊完输出一份完整设计稿，**等我点头**才动手。

> 这一步是整条流水线**最贵也最便宜**的一段——AI 帮我把模糊念头拧成精确规格，避免后面五个 agent 在错误前提上做无用功。

→ 产物：`intents/<日期>-<slug>.md`

![Screenshot 2026-04-28 at 16.46.47.png](https://p0-xtjj-private.juejin.cn/tos-cn-i-73owjymdk6/94f2999856af419bbf63d5a326c9d93b~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgc3F1YXJlenc=:q75.awebp?policy=eyJ2bSI6MywidWlkIjoiMTgyMDQ0Njk4NTgyOTE5NyJ9\&rk3s=f64ab15b\&x-orig-authkey=f32326d3454f2ac7e96d3d06cdbb035152127018\&x-orig-expires=1779706409\&x-orig-sign=c%2BRjY0Btau%2FRiHYktP%2F75Fpo%2FC0%3D)

***

#### 步骤 2️⃣ 出实施计划（2 分钟）

派一个**只读的「架构师」agent**，看完意图 + 项目元数据 + 最近 20 条踩坑日志，写出**分阶段实施计划**。每阶段都标：

* ✅ 完成判定（具体到一行命令的输出）
* ❌ 不做什么（明确范围之外的部分）

它**不能改代码**——这是设计上的边界，避免它边规划边乱搞。

→ 产物：`runs/<slug>/plan.md`

***

#### 步骤 3️⃣ 我批 plan（1 分钟）

看 plan，没异议就回"批准"。这是第一道**人类闸门**。

***

#### 步骤 4️⃣ 编码（约 10 分钟）

派**项目专员 agent**——它的工作目录被锁死在某一个 repo 里，碰其它 repo 会被 hook 弹回来。

它读 plan 后自己干：

* 改代码
* 跑类型检查
* 清前端构建缓存
* 写一份「我改了啥 + 你需要重启 dev server」的报告

**不 commit、不 push、不开 PR**——这些动作要等审批门。

→ 产物：`runs/<slug>/dev-report.md`

***

#### 步骤 5️⃣ 浏览器验证（约 80 分钟，可放着不管）

派 **「视觉验收 agent」**。它用浏览器自动化工具：

* 拿 4 套测试账号轮流登录
* 每个账号下，每张关键页都拍 **3 档屏幕尺寸**（手机 / 平板 / 笔记本）
* 跑 5 类预设探针：CJK 文字截断、表格列宽溢出、flex 兄弟挤压、纵向堆叠、网络 4xx

最后输出 **「GO / NO-GO」判定**：

| 结果                             | 数量           |
| ------------------------------ | ------------ |
| 截图归档                           | 21 张         |
| API 鉴权用例（是否 403？未登录 → 是否 401？） | 9 条全过        |
| pre-existing layout 警告（不阻塞）    | 1 条，记录留到下次治理 |

→ 产物：`runs/<slug>/verification-report.md` + `screenshots/`

![Screenshot 2026-04-28 at 16.53.30.png](https://p0-xtjj-private.juejin.cn/tos-cn-i-73owjymdk6/4d04219d7b91490392be34746e589918~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgc3F1YXJlenc=:q75.awebp?policy=eyJ2bSI6MywidWlkIjoiMTgyMDQ0Njk4NTgyOTE5NyJ9\&rk3s=f64ab15b\&x-orig-authkey=f32326d3454f2ac7e96d3d06cdbb035152127018\&x-orig-expires=1779706409\&x-orig-sign=l6hnVFCIWJRp%2FQu%2Bqqk9VDXCoqM%3D)

***

#### 步骤 6️⃣ 审批门（这一步必须有人）

派\*\*「部署看门人 agent」\*\*。它干三件事：

1. 把 diff、截图、curl 结果、安全审查凑成一张**互动审批卡**，推到飞书
2. 写 `gate.json` 标记 `status=pending`
3. 然后**就不动了**——等人在手机上点"批准"

这是设计上最关键的"人类时刻"。**AI 不能自批，无论多绿都不行**。

![Screenshot 2026-04-28 at 16.54.58.png](https://p0-xtjj-private.juejin.cn/tos-cn-i-73owjymdk6/9c6d03a0e11545688dc07b05270f5019~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgc3F1YXJlenc=:q75.awebp?policy=eyJ2bSI6MywidWlkIjoiMTgyMDQ0Njk4NTgyOTE5NyJ9\&rk3s=f64ab15b\&x-orig-authkey=f32326d3454f2ac7e96d3d06cdbb035152127018\&x-orig-expires=1779706409\&x-orig-sign=yRzwOWCBxVt580auEIzmo5oT7vg%3D)

***

#### 步骤 7️⃣ 我点"批准"（30 秒）

收到飞书卡 → 我看一眼 **5 个改动文件 + 9 条 curl 结果 + 截图** → 在主对话回 `/approve <slug>`。

`gate.json` 翻成 approved → 触发后续动作。

***

#### 步骤 8️⃣ 提交 → PR → 自动部署（约 3 分钟）

批准后 AI 自己接着跑：

1. `git checkout -b feat/...` 切 feature 分支
2. **英文 commit**（写在 memory 里：PR 一律英文）
3. push 到 GitHub
4. `gh pr create` 开 PR

**第二道人类闸门**：merge 按钮我按。这条产线规则是 "merge=立即部署"，所以我必须看清楚才合。

我 merge 完跟 AI 说一声 → 它立即：

* 把 GitHub 的 commit 镜像同步到镜像源（生产服务器从那边拉代码）
* 查 CI 流水线状态：`ci-deploy = success` ✅

![Screenshot 2026-04-28 at 16.57.04.png](https://p0-xtjj-private.juejin.cn/tos-cn-i-73owjymdk6/000d13258253416fb54b3f78570cf2b9~tplv-73owjymdk6-jj-mark-v1:0:0:0:0:5o6Y6YeR5oqA5pyv56S-5Yy6IEAgc3F1YXJlenc=:q75.awebp?policy=eyJ2bSI6MywidWlkIjoiMTgyMDQ0Njk4NTgyOTE5NyJ9\&rk3s=f64ab15b\&x-orig-authkey=f32326d3454f2ac7e96d3d06cdbb035152127018\&x-orig-expires=1779706409\&x-orig-sign=hoBiCgZGM2HIJTXwotiojcuOs4I%3D)

***

#### 步骤 9️⃣ 收尾（1 分钟）

AI 自动：

* `gate.json.status = shipped`
* 写一份 `done.md` 列出 PR / commit / CI / 截图位置
* 把"踩坑教训"追加到团队的 `feedback-log.md`（下次规划时其它 agent 会读）
* 把意图文件归档到这次交付的目录里
* 给飞书发一条 SHIPPED 通知

***

### 三、用到的工具与技术手段

> 不讲实现细节，只讲**用它解决了什么问题**。

| 工具 / 手段                     | 解决的痛点                                                |
| --------------------------- | ---------------------------------------------------- |
| **专职 subagent**（10+ 个角色）    | 让每个 agent 专注一件事；上下文不污染；权限边界清晰                        |
| **目录 / 工具白名单（hook 拦截）**     | 防止 agent 越界改错项目；权限即代码                                |
| **文件作为唯一 handoff 渠道**       | agent A 写 plan.md，agent B 读 plan.md；不靠"记忆传话"         |
| **审批门 + 飞书互动卡**             | 关键决策必须人类盖章；手机点一下就回到流水线                               |
| **「头脑风暴」一次一问**              | 强制把模糊需求收敛成精确设计，避免 AI 自由发挥                            |
| **多档 viewport 自动截图**        | 单分辨率会漏 50% 的 UI bug；CJK 在某些尺寸下会竖排                    |
| **角色 × 视图矩阵自动跑**            | 4 角色 × 3 屏幕 × N 页面，人工跑要 1 小时，AI 跑 80 分钟（包含登录、拍照、写报告） |
| **预设 probe（探针）**            | 把"上次踩的坑"沉淀成自动检查项，下次不再踩                               |
| **feedback-log（团队共享教训）**    | 每次交付沉淀一行经验，下一棒 planner 必读                            |
| **多 remote 同步（CI 一边，生产一边）** | 让 CI 触发与生产代码源解耦，便于跨网络环境部署                            |
| **审批 KV + webhook 轮询**      | 手机点了"批准"，桌面上的流水线立刻继续                                 |

### 四、回到杠杆这件事

回到开头那 15 分钟 vs 5 小时的账。我具体是怎么花的：

| 我做了什么          | 时长                             |
| -------------- | ------------------------------ |
| 写需求            | 5 分钟                           |
| 看 plan         | 1 分钟                           |
| 给 4 套测试账号      | 1 分钟                           |
| 看飞书卡批准         | 30 秒                           |
| 看 PR 内容点 merge | 2 分钟                           |
| **小计**         | **约 10 分钟（含等待切换的零碎时间约 15 分钟）** |

剩下 5 小时，是 AI 在跑、在等我。

这不是"AI 取代我"——是**我把自己挪到了流水线最有杠杆的位置**：定方向、把关键、踩刹车。

杠杆点在哪？三个动作：

1. **澄清** — 决定要做什么、不做什么。一次决策影响后面 5 棒
2. **批 plan** — 决定怎么做。看一遍计划，避免后面跑错方向
3. **批审批卡 + merge PR** — 决定该不该上线。最终质量门

这三件事**没法机械化**，必须人来做。其它**重复、可机械化、有明确判定标准**的工作（写 boilerplate / 跑 4 角色登录截图 / 拼审批卡 / 同步镜像）全部交给流水线。

最让我满意的不是速度，是**可追溯**——`runs/<slug>/` 这个文件夹里 11 个文件完整记录了这次交付的每一步：意图、计划、改了啥、测了啥、审批了什么、部署了什么、踩了什么坑。半年后再翻，整个故事都在。

> AI 协作的下一步不是「prompt 写得多好」，而是「**流水线设计得多清晰**」。 让人守关键门、AI 跑工位，是当下能落地、效果可验证的最优解。

***

### 附：流程图源码（Mermaid）

```mermaid
flowchart LR
    Start([需求]) --> Brainstorm["1. 澄清<br/>(头脑风暴 agent)<br/>10-15 min"]
    Brainstorm --> IntentMd[["intents/&lt;slug&gt;.md"]]
    IntentMd --> Planner["2. 出计划<br/>(只读架构师 agent)<br/>2 min"]
    Planner --> PlanMd[["runs/&lt;slug&gt;/plan.md"]]
    PlanMd --> Approve1{{"3. 我批 plan<br/>👤 1 min"}}
    Approve1 -->|批准| Dev["4. 编码<br/>(项目专员 agent)<br/>10 min"]
    Dev --> DevMd[["runs/&lt;slug&gt;/dev-report.md"]]
    DevMd --> Verify["5. 浏览器验证<br/>(视觉验收 agent)<br/>80 min"]
    Verify --> VerifyMd[["verification-report.md<br/>+ 21 截图 + 9 curl"]]
    VerifyMd --> Gate["6. 部署看门人<br/>推飞书审批卡"]
    Gate --> Approve2{{"7. 我点批准<br/>👤 30 sec"}}
    Approve2 -->|approved| Ship["8. commit/push/PR<br/>(自动)"]
    Ship --> Approve3{{"merge PR<br/>👤 2 min"}}
    Approve3 -->|merged| Sync["sync 镜像<br/>+ 监控 CI"]
    Sync --> Done["9. 收尾<br/>gate=shipped<br/>+ feedback-log"]
    Done --> End([部署成功])

    classDef human fill:#ffe5e5,stroke:#c00,stroke-width:2px
    classDef agent fill:#e5f0ff,stroke:#06f
    classDef file fill:#fff8d5,stroke:#999,stroke-dasharray: 3 3
    class Approve1,Approve2,Approve3 human
    class Brainstorm,Planner,Dev,Verify,Gate,Ship,Sync,Done agent
    class IntentMd,PlanMd,DevMd,VerifyMd file
```

**图例**：

* 🔵 蓝框 = AI 自动跑的工位
* 🔴 红框 = 必须人类介入的审批门
* 🟡 黄虚线框 = 落盘的轨迹文件（agent 之间的 handoff 介质）

***

> 如果觉得有用，欢迎把这套流水线思路套到自己的项目上。 评论区聊聊你的"AI 工位编排"经验？


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://www.doruby.com/ai/ai-quan-zi-dong-fu-liu-shui-xian.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
