场景一
ProdFlow · H5 智能产研协同平台
9 屏 30 态 · 血缘图谱与变更冲击波 · Linear 信号台视觉方向
把「提示词」变成「岗位 + 工序 + 契约」：29 个 skill、4 个 agent 岗位、3 道人工审批门、3 份机器可校验契约。
对话式用 AI 做完整项目必然遇到三个问题：上下文漂移、越界（写代码的顺手改产品范围）、无法复现。解法是把 AI 协作组织成一家小公司——每个 agent 是一份独立系统提示与工具授权，只拿得到自己那段的上游契约。
| 身份 | 决定 | 不得决定 | 冻结产物 |
|---|---|---|---|
| PM 产品经理 |
问题、受众、场景、指标、机制、范围、优先级、页面任务、流程、数据、状态、验收、AI 三性 | 色板、字体、主题、组件造型、插画风格、视觉构图 | product-contract.json |
| Designer 视觉设计 |
布局、层级、密度、色彩、字体、组件语言、图像媒介、生图 prompt、资源切出、HTML 样张 | 静默改功能范围、业务流程、数据逻辑与验收条件 | approved.html + design-tokens.json + 组件契约 |
| Engineer 前端工程 |
技术选型、代码结构、实现方式、状态 fixture、多端适配、离线与性能 | 自行重定义产品、自行批准视觉 | 生产 app/ |
| QA 验收 |
契约一致性、六维证据、自动与人工视觉质量判定 | 用主观审美替代阻断证据 | visual-qa.json + QA 报告 |
需要跨界怎么办？写 RFC：Designer 写 design-rfc.md，Engineer 写 engineering-rfc.md，经人批准后更新上游契约的版本号再往下走——而不是在下游偷偷改掉。
skill 规定这道工序的输入、方法、产物格式与完成条件。题目会变，skill 不变。
| 阶段 | Skill | 这道工序做什么 | 归属 |
|---|---|---|---|
| 总控 | solve | 拆解评分表 → 编排全部工序 → 管三道门的停与走 | — |
| 产品 | analysis | 业务分析四节，竞品三路并查 | PM |
concept | 把分析变成 3 个机制正交的产品立意（不是三个换皮方案） | ||
pm-proto | 赢家立意做成可点击灰稿，用户试玩后拍板 | ||
pm-kit | 方法论弹药库：OST、竞品 FIA 防编造、Gherkin、proto-persona | ||
requirements | PRD、产品框架图、业务流程图、版本规划四件套 | ||
product-handoff | 产品冻结：PRD 编译成可校验 JSON 契约，跑断链与覆盖度检查 | ||
| 设计 | ui-direction | 解构参考、建立设计观点、比较 2 个方向并冻结视觉边界 | Designer |
frontend-design | 视觉判断力基线：排版、留白、避免模板感 | ||
ui-prompt-director | 把契约与方向编译成专业 ImageGen prompt 包（11 段固定结构） | ||
ui-imagegen | 消费 prompt 清单生图，维护逐项状态与回图评审 diff | ||
ui-assets | 按 manifest 确定性裁切、缩放、抠键色、转码、生成 1x/2x | ||
ux-spec | 信息架构图、页面交互说明、Design System | ||
| 工程 | scaffold | 按契约建路由与状态，按 tokens 建主题与组件接口 | Engineer |
components | 组件库与引擎 API 速查，避免重复造轮子 | ||
mockdata | 造 30+ 条有分布、有真实感的数据（禁张三李四） | ||
form-mobile / form-desktop | 移动 H5 与 PC 大屏两套形态手册 | ||
backend-addon | 可选后端模块，默认不触发（本次两题均为纯前端） | ||
| 验收 | ui-render | 从生产 HTML 按状态 fixture 渲染固定 viewport UI 图与 manifest | QA |
visual-qa | 视觉、可访问性、溢出、字体、console、关键状态与像素回归检查 | ||
ai-capability | AI 能力设计说明、创新亮点、AI 交互资产三件套 | ||
| 交付 | package | 把契约、UI 状态矩阵、文档与生产 app 装配为门户与 zip | — |
promo | 把交付门户升格为营销级产品宣传页 | ||
deploy-sztv / deploy | 内网 GitLab CI 部署（默认）／ Cloudflare Pages（备用） | ||
figma-export | 可选：HTML 成品反向捕获成 Figma 设计稿，仅在点名时执行 | ||
| 兼容 | codex-gen / shots | 旧入口路由到新工序，保证历史指令不失效 | — |
人工拍板产品立意与范围，产出 product-contract.json 并跑 validator：P0 需求必须映射到页面与验收条件，核心页面必须有默认态 + 至少一个异常态，跳转目标必须存在，AI 页面必须定义可感知／可控／可恢复与失败降级。不通过不放行。
门 2 只批视觉方向（两个方向二选一，含布局／层级／色彩／字体／组件语言边界）；门 3 批首页真实 HTML 样张——不是概念图，是能 file:// 直开、能切换深浅主题的真页面。样张批准后 Engineer 才开工。
其余环节全部自动跑并留证据——门设多了流程停摆，门设少了跑偏发现得太晚。
| 契约 | 谁产出 → 谁消费 | 约束了什么 |
|---|---|---|
product-contract.json | PM → Designer / Engineer / QA | 稳定的需求／页面／验收 ID；页面状态矩阵；AI 三性定义。禁止颜色、字体、圆角、阴影进入——一旦进入就是 PM 越界替 Designer 做决定 |
design-tokens.jsoncomponent-contract.json | Designer → Engineer / QA | 色彩、字阶、间距、圆角、投影、动效、断点与组件双形态布局。工程侧不散落魔法值，全部引用 token |
app/pages.json | Engineer → QA | 路由与状态截图清单。每个异常态由 URL 参数确定性触发，截图不依赖随机点击或当前时间 |
产品、prompt、资源、页面状态都有 manifest 与 validator，截图使用状态 fixture 而非随机点击。同一份契约重跑一次，产出的 UI 图逐张一致——AI 参与的每一步都可复现、可审计，而不是一次性的运气。
两道赛题各起一个 deploy/<slug>/ 目录、各跑一遍完整产线，共用同一套 skill 与 agent 身份——换了题目，产线一行没改。
9 屏 30 态 · 血缘图谱与变更冲击波 · Linear 信号台视觉方向
12 屏 40 态 · 凭证状态机与共同时段求解 · 票据形式语言
流程层是 ai-log 逐工序留痕，产品层是每条 AI 输出都带标识、理由与来源。
流程层是三道审批门，产品层是「AI 只给候选，人做确认」。
每个 AI 能力必须同版本交付失败降级路径——没有降级的 AI 不上线，这是硬规则不是建议。