我去看了一篇高互动的 Codex + Figma 笔记，评论区反复问同一个问题： 为什么不直接让 Codex 写，非要多走一遍 Figma？ 我先绕开 Figma 做了一次实测。 只给 Codex 页面目标、桌面/手机尺寸、颜色和交互要求，它做出了一个真的能打开、能勾选、能点按钮的 Focus Week 页面。 所以先说结论：不是每个项目都要把 Codex 和 Figma 全装上。 这 3 种情况，可以先跳过 Figma： 1. 个人小工具，只想先验证能不能用 2. 单页或简单后台，没有设计师协作 3. 需求还在变，先做能点击的初版 但遇到这 4 种情况，Figma 很有价值： 1. 多人要先评审视觉和流程 2. 有组件库、品牌色、字号和间距规范 3. 页面多、状态多，需要统一设计语言 4. 会反复改版，需要一个可对照的视觉锚点 Figma 不是“多余中转站”，它负责把预期钉住；Codex 负责把预期变成能运行的页面。 我会这样发给 Codex： 你是前端还原助手。请根据我提供的 Figma 链接或导出截图实现页面。 输入： - 目标画板：1440px 桌面端、390px 手机端 - 设计材料：截图、字体、颜色、间距、图标、组件状态 - 交互：按钮、表单、勾选、空状态和错误状态 - 技术限制：{HTML/CSS/React/现有组件库} 执行顺序： 1. 先列页面结构和缺失材料，不要直接写代码 2. 我确认后再实现 3. 生成桌面和手机截图 4. 对照设计稿列出差异并修正一轮 输出： - 可运行页面 - 修改文件清单 - 桌面/手机截图 - 交互测试结果 - 仍未还原的差异 验收时别只看“像不像”：还要查两种尺寸有没有横向滚动、文字有没有溢出、按钮能不能点、控制台有没有报错。 限制也说清楚：Figma 不会自动让设计变好，Codex 也可能还原偏差。复杂项目仍要设计师和开发做最终判断。 你做的是个人小工具，还是要多人协作的产品？ #Codex #Figma #AI工具 #AI编程 #产品设计 #普通人用AI #网页设计 #新手教程