DesignFlow：AI UI 设计工作台项目总结
一个仍在探索中的 AI UI 设计工作台，总结它的产品价值、UI 价值，以及项目级记忆在未来 AI 设计中的意义。
一句话总结
DesignFlow 是一个 AI 驱动的 UI 设计工具。它的特别之处在于：它不是像普通 AI 那样“一句话画一张孤立的图”，而是像一个真实的设计师团队，根据你的需求，先制定设计规范，再成套地生成多个风格统一的界面，并且支持你持续对话修改。
为什么做这个项目？
目前市面上的 AI 生成 UI 工具，大多是“一句话给出一张效果图”。这种模式在实际工作中很难用：
- 不能做项目：每次生成都是独立的，没法完成一个包含多页面的真实项目。
- 风格不统一：生成 5 个页面，可能会出现 5 种不同的按钮颜色，底部的导航栏长得都不一样。
- 没有记忆：修改几次之后，AI 就忘了你最初的要求，越改越乱。
为了解决这些问题，我参考了 Google 内部的超前项目 Stitch，研究了它的交互模式和底层原理，并在这个基础上，解决了一致性和记忆丢失的问题，开发出了 DesignFlow。
核心产品设计思考
1. 设计规范是“灵魂”，不是附件
普通的 AI 设计工具是：需求 → 生成页面。
DesignFlow 的流程是：需求 → 生成设计规范 → 生成多个页面。
这中间多出来的“设计规范”非常关键。它规定了统一的颜色、字体、按钮样式等。系统会强制把这些规范应用到每一个页面的生成中。 这意味着：
- 多张页面看起来像同一个 App，因为它们用了同一套代码级的设计规范。
- 哪怕你后来反复修改局部，它也不会破坏整体的风格。
2. 把生成过程透明化，让用户安心
AI 生成多张高保真页面需要一到两分钟。如果只是转圈圈，用户会以为卡死了。 我把整个过程拆解成了几个能看到的阶段：
- AI 正在思考（你能看到它正在写的规划）
- 界面上出现设计规范卡片（颜色和字体定下来了）
- 出现几个灰色的手机屏幕框架（占位）
- 真实的精美界面一个个在框架里加载出来
这让等待过程变成了“看着设计逐渐成型”的体验。
3. 可以对话修改，而不是重新抽盲盒
如果你对某个页面不满意，普通工具只能重来一次。在 DesignFlow 中：
- 你点一下那个页面，告诉 AI：“把顶部的导航改成底部标签栏”。
- AI 会先“看一眼”所有其他页面，了解整体结构，然后再小心地修改当前页面。
- 如果修改的地方（比如底部导航）别的页面也有，系统会提醒你同步更新。
- 修改是安全的，如果不满意随时可以撤销。
4. 垫图生成：参考图 + 提示词
除了纯文字输入，系统还支持上传一张现有的设计图作为“垫图”参考。你可以输入：“参考图片风格，生成影石360 APP”。
系统里的前置 AI 会先去把这张参考图的排版结构、配色方案、信息层级“看懂”并压缩成摘要，然后用这个压缩后的意图去指导后续的生成。这样既能保证首屏精准还原参考风格，又不会让后面衍生的页面全长得一模一样。
后台是怎么指挥 AI 工作的？
有一个“总指挥”
如果让多个 AI 一起干活，很容易各搞各的。所以我设计了一个“总指挥”角色。 它不负责画图，只负责写计划：要做几个页面？每个页面干嘛？要用什么语言？哪些组件是大家通用的？ 其他 AI 只要严格执行这个计划就行了。
保证通用的东西绝对一致
如果一个 App 底部的导航栏在每一页长得都不一样，那就太业余了。 DesignFlow 有三层防线来保证这一点：
- 注入约束：明确告诉 AI 必须用一样的结构。
- 强制替换：如果 AI 没画好，代码会自动用正确的结构去替换。
- 自动修复：最后还会用另一个专门的 AI 来检查和修补缝隙。 总之，能用代码解决的确定性问题，绝对不让 AI 去猜。
让 AI 拥有“长期记忆”
为了让 AI 能持续陪你做完整个项目，系统会维护一个“项目记忆”。 这就像是团队的交接文档，里面记录了：目前做到了哪一步、之前的决定是什么、各个页面的关系是什么。这样无论你离开多久再回来修改，AI 都知道上下文。
实际效果展示
这是我们在 DesignFlow 中的生成效果。输入一段自然语言需求，它能成体系地输出多张高保真界面。并且保证了统一的视觉风格。
而且，最终生成的结果是可以用 HTML 格式直接复制进 Figma 的，方便设计师做后续的精调！
我学到的三个道理
- AI 在设计领域的护城河，不是“一次能画得多好看”，而是“能不能持续懂你的项目”。
- 多个 AI 协作时，要把“动脑”和“动手”分开。 让一个负责统筹，其他的负责执行。
- 不要什么都指望 AI。 凡是程序代码能百分百搞定的事情（比如替换组件、加载预览），就用代码写死，只让 AI 去处理需要理解语义的复杂问题。
需要说明的是，DesignFlow 目前仍处于探索与迭代的“过渡态”，整个项目还在持续演进中。
它的价值不在于立刻作为一个完美的成熟产品去替代现有工具，而在于它真正验证了“AI 深度融入真实设计工作流”的可行性——AI 不应该只是“出图更快的工具”，而是能够理解项目、维护一致性、持续协作的长期伙伴。顺着这个方向，未来还有很大的想象空间。