现场演示手册
让观众看到真实产品发生变化。
优秀的 oh-my-design 演示不是逐个介绍技能名。它从一个看得见的问题开始,保护产品依赖的既有行为,最后回到真实路由,并给出任何人都能核验的证据。
选择能证明结果的最小演示规格
时间限制的是范围,不是诚实程度。开始前先选一种规格,并说明哪些内容不会被更改。
修复一个可见缺陷
现有页面能用,但显得普通或难以理解
保留行为,只修复一个影响最大的层级、间距、状态或无障碍问题。
修改前画面、聚焦差异,以及同一真实路由上的修改后效果。
交付一个完整小界面
项目已有技术栈和组件,流程范围也已明确
基于项目设计上下文,实现一个小界面及加载、空白、错误和成功状态。
可运行路由、状态覆盖、变更文件和实际执行的检查。
运行带检查点的完整流程
界面较新或模糊,需要调研与设计系统决策
不跳过审批门槛,从发现、用户旅程、DESIGN.md 提案推进到实现和验证。
用户旅程、DESIGN.md 补丁、可运行 UI、验证摘要和三次用户检查点。
可重复使用的六步流程
无论是技术聚会、工作坊还是录屏,都可以使用同一顺序。CLI 负责准备环境,真正的 UI 工作由 AI 编程助手在代码仓库中完成。
- 01
确定一个可见问题和一项受保护行为
打开真实路由,准确指出观众需要观察的问题。然后声明 URL、数据流、字段名、文案或交互中哪些内容不得更改。
- 02
安装套件并让 doctor 检查实际状态
在项目根目录运行两个命令,安装后重启 AI 编程助手。安装成功只是准备工作,不是演示结果。
npx oh-my-design-cli@latest npx oh-my-design-cli@latest doctor - 03
对齐 DESIGN.md 与 verified_v2 证据
公开演示请选择 verified_v2 参考。让代理与现有 DESIGN.md 一起读取,只采用属于当前产品界面的证据;未知字体、token 和组件声明保持缺省。
- 04
实现真实界面及关键状态
继续使用现有技术栈和组件。新流程不要只打磨静态成功画面,还要覆盖用户真正可能遇到的状态。
- 05
在真实路由上审计
打开产品路由,实际操作受保护行为,并运行相关无障碍与 interface-feel 检查。只报告真正执行过的检查和测量。
- 06
记录用户的修正
用户修正某个视觉决定时,只修正对应范围,并用 omd:remember 记录,避免下次会话重犯。
适合现场修复的提示词
先阅读 DESIGN.md 并检查当前产品路由。在保留 URL、数据流、字段名和现有用户行为的前提下,修复这个页面中一个可见的层级或状态问题。公开演示请使用 verified_v2 参考,并只对齐属于该产品界面的证据;未知值不要用 fallback 填充,直接省略。在真实界面中实现改动并覆盖关键状态,然后验证该路由,报告变更文件和真正执行过的检查。扩展 DESIGN.md 或越过必需的流程检查点之前先征求我的确认。观众应当能够核验的证据
在演示过程中同步保留这些记录。只有精美截图而没有可追溯过程,并不算可审计演示。
原始页面和一开始指出的可见问题
包含受保护行为的完整提示词
DESIGN.md 差异以及主动省略的未知字段
包含关键状态的真实产品路由,而不是独立模型
变更文件和真正运行的检查或测量
作为持久且有明确范围的偏好记录下来的用户修正
让惊喜建立在事实之上
CLI 负责安装和诊断
AI 编程助手读取已安装的上下文并修改 UI。安装器本身不会生成界面。
未知信息保持缺省
不要用系统字体、通用组件、推测 token 或相邻营销页面填补缺失的品牌事实。
证据优先于表演
没有真实前后测量,就不要宣称速度、转化率、无障碍或性能获得提升。
必需检查点不得跳过
30 分钟流程仍会在用户旅程、DESIGN.md 补丁和验证审批处停下。现场观众不是跳过它们的理由。

