Figma 设计师一句话点破：Slots 正在把设计系统变成“可编程接口”

如果你还把 Slots 当成“更灵活的组件占位符”，那你已经落后了。Figma 的 Rachel 在这期 Show Your Work 里展示了一种反直觉的用法：Slots 不只是为设计师服务，而是在悄悄把设计系统改造成 AI Agent 也能理解、组合、生成的结构化系统。

反直觉的开始：Slots 不是为了更自由，而是为了更可控

很多人第一次用 Slots，都是冲着“自由度”去的：内容随便换，结构不受限。但 Rachel 一上来就抛出一个反直觉的结论——Slots 真正的价值不是自由，而是系统级的控制力。

她用菜单组件举了一个非常典型、但常被忽略的例子。如果你把 menu heading、menu item、divider 直接当作默认内容塞进一个 slot，看起来编辑体验没差，但一旦系统层面要改样式（比如给 heading 加背景色），所有被改过 slot 内容的实例都会“失联”。

解决办法不是更多 variants，而是提前把可复用的最小单元定义成嵌套组件。这样一来，即使 slot 里的内容被改过，只要它还是那个子组件，系统级更新依然能穿透下去。这里的金句值得记住："Slots 不是逃离系统，而是进入系统的另一条路。"

当组件只剩一个“空槽”，问题就开始了

第二类 Slots 用在更自由的内容区域：卡片、弹窗、Sheets、Accordion。Rachel 做了一个很多设计系统都会经历的选择——干脆不给默认内容。

原因很现实：这些组件的使用场景差异太大，默认内容往往只是“占地方的示例”，最后一定会被删。但问题也随之出现：组件开始退化成“一个矩形 + 一个 slot”，系统感迅速崩塌。

她给出的解法不是回到模板，而是一个组件里放多个 slot。以 Card 为例，标题、媒体区、操作区各自独立成 slot。这样一来，每个 slot 内部可以高度变化，但整体结构依然稳定。

这一步非常关键，因为它把设计从“随便往里塞内容”，拉回到“在明确接口里组合内容”。如果你是做 AI 产品或 Design-to-Code，会立刻意识到：这种结构，对机器极其友好。

最危险、也最有未来的一步：把 Slots 当成布局语言

真正让这期视频出圈的，其实是最后那段“实验性”的思考。Rachel 发现，一旦你习惯用 Slots 思考，组件的边界会开始模糊——页面级模板也可以是一个带 Slots 的组件。

多个组件层层嵌套，每一层都暴露清晰的 slot 接口，这种感觉已经非常接近代码里的 layout + props。她没有夸下海口说自己已经全面采用，但明确点出了一个方向：当 AI Agents 参与设计和布局生成时，这种高度结构化的系统，会让“准确生成页面”成为可能。

这也是为什么她特意强调：并不是所有地方都该用 Slots。像按钮里的图标、前后缀这种“选择题”，依然应该用 instance swap。她给了一个极好记的区分方式：Slots 是用来“搭建”的，Swaps 是用来“选择”的。

总结

这期视频表面讲的是 Figma Slots，底层其实在讲一件更大的事：设计系统正在从“给人用的规范”，进化成“给人和 AI 共用的接口”。

如果你在做 AI Agent、DesignOps、或任何需要规模化生成界面的工作，可以立刻行动三件事：第一，检查你的组件里，哪些重复元素还没被拆成可控的子组件；第二，警惕“一个大 slot 解决一切”的懒设计，尝试多 slot 的结构化表达；第三，开始用“接口思维”而不是“模板思维”看待设计系统。

最后留一个问题：当你的设计系统足够结构化时，未来到底是 AI 在“用”你的系统，还是你的系统在“约束”AI？这个答案，可能决定你产品的上限。

关键词： Figma， Design System， Slots， AI Agent， 组件化设计

事实核查备注： 需要核查：视频发布时间是否为 2026-06-10；作者是否为 Figma 设计师 Rachel；视频中关于 AI agents 的表述是否为探索性而非结论性陈述