一句话摘要
分享借助 AI 工具完成设计工作的个人方法。
我如何用 AI 做设计。2026 年 8 月 26 日 · 6 分钟阅读 · 查看原文 ↗ AI Design
作为一个不是设计师、又痛恨垃圾感(slop)的工程师。
每一个落地页、应用和 TUI 看起来都一样。它们都是垃圾,而且大多数让人看不懂。
下面是我如何给产品设计去垃圾感。
1. 始终考虑整体。
设计过程大致是 3 步:
把你为之设计的所有约束摆出来。
考虑一系列满足这些约束的解决方案。
如果你意识到必须新增一个约束、或者可以去掉一个,回到第 1 步。
这出自 Christopher Alexander 的《Notes on the Synthesis of Form》。这是一次对设计过程令人愉悦的严谨探索。
— "《Notes on the Synthesis of Form》,一本非常好的书。"
约束可以有很多形式。它们可以是字体和字号规则、你必须支持的工作流,或者业务逻辑状态。重要的是,是你来决定这些约束。
常见的问题是跳过第 3 步,然后玩起"设计打地鼠"。
一个用户感到困惑,很自然就跳进解决方案模式。我们团队总是被这种事 nerdsnipe(勾走注意力)。尤其是左侧边栏,因为它把太多信息塞进了一个小空间。诱惑是就地修补,但那条路通向毁灭。
— "一个小空间里塞满了海量信息和操作。避免打地鼠式设计。"
跳过摆出约束这一步所带来的问题,是你得到一块脱节的补丁,随机地让某些交互优先于另一些。AI 加剧了打地鼠式设计的诱惑。它鼓励你不断提示"把 X 做得更显眼"或者"加一个能做 Y 的 affordance"。到头来,更多用户被搞糊涂了。
当反馈到来时,先评估它是否改变了你的设计约束,再跳到解决方案。我们处理这件事的方式,是维护一份记录 papercut(小毛病)和烦人点的文档。对明显的修复我们快速行动,但对那些次要的,我们只做跟踪,这样等到重新设计的时候,我们就有一堆东西可以连贯地一起解决。重要的是,我们避免过度反应、制造更多混乱。
2. 删掉东西。
Agent 喜欢加东西。你的工作是删掉不必要的部分。
这一点应该非常熟悉,因为 agent 在代码和计划里做的是完全相同的事。它们喜欢双保险,多包一层 try-catch,或者一遍又一遍地重复实现同一个工具。
在 UI 设计里,agent 也做同样的事。它们喜欢加多余的文案、线条和图标。你最后得到的是"真实"的设计,看起来比大多数工程师手工做出来的好,但实际上有点糟。
简单的一步是:看设计里的每一个元素,对每一个元素都问"我真的需要这个吗?"
— "删掉 agent 的垃圾。"
3. 在设计工具里迭代。
你不应该在产品里迭代设计。用一个能给你精细控制、让你以最小额外上下文快速迭代的工具。
原型引力(prototype gravity)是无声的杀手。这就是:你让 agent 在你的代码库里构建了第一个版本,然后感觉上,去精修那个版本比探索其他选项更容易。在你的真实代码库里做设计,也会迫使 agent 去构建一个硬接在你真实——
Figma 仍然是 GOAT,而且 AI 集成的水平每周都在变好。Cursor Design Mode、Claude Design、一堆新创业公司、甚至 HTML 原型,也都很棒。
只是请你用一个为设计而生的工具,并让 AI 为每样东西生成 3-4 个变体。
— "Figma 仍然是设计迭代的 GOAT。"
4. 用组件和库。
这一点对大多数工程师来说可能显而易见,但它非常重要,所以我快速说一下。
把视图和逻辑分开。创建可复用的组件。
这不难,而且回报丰厚。你的应用会视觉上协调一致,而不是一堆重复实现的按钮拼成的补丁。
为了在 Ref 做到这一点,我们维护一个 /showcase 页面。我们先让 agent 在那里构建 UI 组件、把玩它们,然后再接到主应用上。
— "拥有 Ref 所有组件的 /showcase 页面。"
5. 用预览部署。
评估设计最好的方式是用真实数据。预览部署让你能用真实的、运行中的后端去试新设计。
重要的是记住,总会有一些润色和返工是必须的。即便 agent 完全按你说的构建出来了,当你把它拿在手里、配上真实数据时,仍可能意识到它不对。
对于一个涉及前端和后端的大特性,预览部署可能会棘手。在 Ref,我们通过把前端和后端 PR 分开来解决。后端改动可以用单元测试和集成测试来验证。前端改动需要人工验证,而预览部署让分享链接变得容易。
— "GitHub action 为每个前端 PR 设置一个预览部署。"
6. 偷东西。
大多数 UX 问题已经被解决过了,你应该把各个部分拿来拼装。花点时间看看那些在解决类似问题、或者传达类似想法的产品。
我合作过的每一个顶级设计师,每个项目一开始都是攒一堆截图。你也应该这样做,这能给你发给你 agent 的上下文带来惊人的效果。
— "由一位非常优秀的真实设计师收集的落地页灵感。"
7. 探索你的品味。
这是好玩的部分!
品味就是反思你对某样东西的反应。而且抱歉了 Kyle Chayka,反思自己的体验并不是布鲁克林阁楼派对的专利。它是创作、而且不创作垃圾所必需的。
产品工程师非常擅长识别一个设计哪里不对,却很难知道怎么改。工程师缺的是来自经验的解决方案库。建立它只需要反复去尝试和反思的 reps(练习量)。
去玩、去探索很有趣。但它也可能感觉相当残酷,因为在你感到足够好之前,是一场铺天盖地的批评。
在 Ref 我们没有全职设计师,所以我们诉诸一种农业脱粒式的做法来打磨我们的品味。我们把一个设计扔到中间,然后用棍子抽它,直到我们觉得它顺眼为止。
以上就是我的全部。GLHF。标签:# X # AI # Design # Guide 相关文章 How to Design with AI Without Getting the Same Screen Twice The model returns the average of what it has seen. The design is what you refuse to let it average. AI Claude Design
原文参考:https://maxed.wiki/posts/how-i-design-with-ai/ (Maxed.wiki,本页为站内中文整理)