7.9
深览指数
科技Bestblogs·大淘宝技术··AI 生成
让 AI 看得见、判得准、改得对—— D2C 从设计稿到三端真机达标的自动化实践
大淘宝技术团队针对 AI 生成移动端代码后无法真机验证的空白,构建端上 UI Harness:将 66 个确定性步骤下沉到 CLI,仅留少量推理给 AI,并以 L1 像素 diff、L2 DOM 树对比、L3 像素采样、L4 Vision LLM 四层信号把视觉检测准确率从 60-70% 提到 91%+。方案已覆盖 DX、Weex、Muise 三条链路,作者据此提炼出五条可迁移的 Agent 工程化原则,适合做 AI 编程工具链与端上自动化的工程师细读。原文 ↗
核心观点
- ▍AI 生码的瓶颈不在生成,而在生成后无法在真机上自我验证与修复;解法是把真机 UI 验证做成可被 AI 调用的 Harness 闭环。
- ▍重新划分 AI 与程序的边界:确定性流程全部下沉到 CLI 骨架,AI 只保留少数需要推理的决策点,从而把可靠性从 AI 可靠性转化为 CLI 可靠性。
- 01将 D2C 全流程拆成 66 个确定性步骤交由程序执行,AI 仅负责少量推理决策点,减少模型漏步骤与自由发挥的空间。
- 02四层视觉信号体系:L1 像素 diff 定位差异、L2 结构对比期望值 vs 实际值、L3 像素采样验证、L4 Vision LLM 语义复核,视觉检测准确率由 60-70% 提升至 91%+。
- 03CLI 前置校验加 Stop Hook 双重拦截:每步执行前校验状态,AI 跳过 verify 直接跑 done 立即退出;声称完成时 Stop Hook 校验交付契约,不满足则注入继续指令。
- 04方案已覆盖 DX、Weex、Muise 三条移动端技术链路,用户只需提交设计稿链接即可实现全自动达标交付。
- 05作者提出 AI Friendly 的定义应从「AI 能快速写代码」转向「架构设计是否支持 AI 参与」,将 D2C 改造定性为生产方式重构而非代码重构。
反方 / 局限
- — 方案依赖设计稿 AST 与真机 DOM 树的双向对比,隐含前提是设计稿结构与实现结构可对齐;对强自定义绘制或非标准组件的覆盖能力文中未展开。
- — 91%+ 的准确率是在内部三条链路上取得的结果,缺少与外部移动端 UI 自动化方案(如 Appium 图像对比、视觉回归工具)的横向基准对比。
D2C(Design to Code)端上 UI HarnessLoop EngineeringCLI 骨架Stop HookVision LLM像素 diffDOM 树对比大淘宝技术DXWeexMuisePlaywright
4 分钟 · 4 卡片 · 5 资料
读原文 →