我最近更新了自己产品的设计。
有人说，我们已经不需要 Figma 这样的设计工具了。直接在代码里做设计，在浏览器里打开网站看效果，然后不断修改就行。 某种程度上这是对的，我自己网站的一部分就是这么设计出来的。但试过之后，我还是觉得 Figma 有用，尤其是对更复杂的项目。
下面是我的一些体会。
- 设计是由大量的小改动组成的
设计主要就是尝试、比较方案、然后修改。 这在 Figma 里很容易，你可以随手挪动东西，很快地试不同的想法。在代码里，同样的过程会变得很乱，你可能还不知道自己想要什么，就已经造出了一堆没必要的组件和样式。
- AI 同时要写代码时，设计出来的东西不一样
当 AI 要同时做设计和写代码时，它还得考虑功能、组件、响应式布局和各种技术细节。 我感觉这会分走它一部分放在视觉设计上的注意力。结果可能能用，但往往没那么好看。 有时候更好的做法是先让 AI 想清楚产品和设计，不要让它马上把所有东西都实现出来。
- 在 Figma 里更容易看到整个产品
在 Figma 里，你可以把很多页面并排摆在一起。人和 AI 都能很快理解产品的全貌，并比较不同的页面。 用代码的话，AI 可能需要打开网站、登录、点过一个个页面、复现某些状态，有时候还需要人来帮忙。 这让视觉上的 review 变得更麻烦。
- Figma 有很多好用的模板
Figma 有很多社区模板、组件和设计系统。 人一直在用这些资源，AI 也可以用。它们给了人和 AI 一个更好的起点。
- 但有些修改在代码里容易得多
代码也有一个重要的优势：共享组件。 如果 header 是一个共享组件，你只需要改一次，所有页面都会更新。改主题色、字体或者间距规则，也可以非常简单。 在 Figma 里，同样的修改可能很痛苦，尤其是文件没整理好的时候，你可能要一个页面一个页面地改。 所以一旦基础的设计系统清楚了，在代码里做修改会快得多。
Figma 也在帮我思考
对我来说，Figma 不只是一个设计工具，它也在帮我思考产品。 当我可以同时看到很多页面，又不用操心实现的时候，会更容易去问： 用户是谁？我们到底在解决什么问题？整个体验说得通吗？ 我经常被实现细节和 vibe coding 的兴奋感带偏，Figma 能让我退一步，把注意力放回产品本身。 我不觉得答案是 Figma 或代码二选一。 Figma 更适合探索想法、思考整个产品；代码更适合测试真实的体验，以及在整个系统范围内做修改。 对简单的产品，直接用代码做设计可能就够了。对更复杂的项目，我还是倾向于先从 Figma 开始，方向清楚之后再进入代码。