最近让 AI 设计两个应用的首页有感，设计现在还是应用最大的护城河，微调设计比写代码要难多了，要描述设计风格非常难。 我现在的大体做法是这样的： 1 搜集和发现好看的设计，我一般都是在 https:...
TL;DR · AI 摘要
设计仍是应用的核心竞争力，AI辅助设计需结合审美与工具。作者系统分享了从灵感搜集到动画实现的完整流程。
核心要点
- 使用styles.refero.design和getdesign.md获取设计灵感
- ChatGPT images2可生成三种风格的页面草图
- 动画实现推荐使用gasp/motion框架配合emil-design-eng方法论
结构提纲
按章节快速跳转。
论证设计能力仍是应用差异化的核心壁垒
通过refero.design等平台系统化收集设计风格
分五步实现从PRD到可视化页面的转换
列举ChatGPT images2等关键工具的使用场景
推荐gasp/motion框架与emil-design-eng方法论结合
强调持续观察与素材积累的重要性
思维导图
用一张图看清主题之间的关系。
查看大纲文本（无障碍 / 无 JS 友好）
- AI辅助设计流程
- 设计原则
- 护城河理论
- 审美重要性
- 实施步骤
- 灵感搜集
- PRD转化
- 图像生成
- 页面转换
- 动画实现
- 工具链
- refero.design
- ChatGPT images2
- gasp/motion
- emil-design-eng
金句 / Highlights
值得收藏与分享的关键句。
设计是应用最大的护城河，微调设计比写代码难多了
ChatGPT images2是我用过觉得设计最好的模型
使用emil-design-eng的skill去做动画的指导思想
Viking on X: "最近让 AI 设计两个应用的首页有感，设计现在还是应用最大的护城河，微调设计比写代码要难多了，要描述设计风格非常难。 我现在的大体做法是这样的： 1 搜集和发现好看的设计，我一般都是在 https://t.co/VYBb28z11z 或者 https://t.co/VLRrkVQsH5" / X
Viking
@vikingmute
最近让 AI 设计两个应用的首页有感，设计现在还是应用最大的护城河，微调设计比写代码要难多了，要描述设计风格非常难。 我现在的大体做法是这样的： 1 搜集和发现好看的设计，我一般都是在
或者
去看，它们会搜集非常多网站的风格，并且可以快速获取 design.md 2 结合你要做的产品找到设计风格，最后再提供网站的截图，同时把 PRD 提供给 AI，让它精炼处你产品中的最有特色的部分，先把要展示什么内容和页面的大体结构写出来，不需要出图，可以多些几个版本，找到你想要的。 3 出图，把 design.md 参考网站截图 你要展示的结构 一起提供给 AI，让 ChatGPT images2 帮你出图，这是我用过觉得设计最好的模型，你可以让它帮你直接出 3 种风格的，你可以选择你喜欢的，假如有一些静态素材，也可以让它帮你扣出来。 4 图片转换成页面，这个一般比较强的大模型都可以，没什么可说的，出来以后，在根据图片的细微之处微调就好。 5 交互和动画，交互我觉得是非常重要的，我喜欢在页面中添加一些简单的动画，尤其是使用 gasp 或者 motion 去添加一些小范围 精致 的动画，让页面可以出彩，你也可以问 AI 怎样添加动画，可以使用emil 的 emil-design-eng 的 skill 去做动画的指导思想：
skills.sh/emilkowalski/s…
然后可以参考
transitions.dev
去添加更多微妙的动画。 6 最后就是发现美的眼睛了，要自己去多看多搜集多观察，这就是一种天赋了。 这篇帖子之后我会总结成一篇《怎样用 AI 做设计》，系统的去总结一下。
DESIGN.md Examples for AI Agents | Refero Styles
From styles.refero.design
1:12 PM · Jul 4, 2026
24.8K
Views
3
1
31
6
7
67
4
436
5
715
Read 31 replies