万物皆 Frame

Frame，是一个很好用但却不那么容易理解的概念。我最早接触到 Frame 是在 Framer 中，在此之前各种设计工具中与之接近的概念是 Group （组）。和 Group 一样，Frame 也可以给图层分组，但是它的作用远不止分组。

从 div 说起

按过往的经验，当我们需要在设计工具中画一个按钮的时候，会先画一个背景图层，再添加一个文字图层叠在上方，然后把它们打包成一个组。

但是，在前端工程师的世界里，一个按钮并不是这样构成的。他们直接使用一个 div 容器来包裹这段文字，然后再给 div 容器添加圆角、背景色样式。也就是说，这个 div 即是容器也是个背景。

Figma 的 Frame 和这个 div 有异曲同工之处。如下图，上面这个按钮就是用 Frame 画的，它拥有更加精简的图层数量……