暗模式、弹簧动画…figma好用的五个功能分享

暗模式：在桌面和网络上使用暗模式进行舒适设计并减少眼睛疲劳。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

自动布局： 使用新布局选项、重新设计的属性面板和画布控件创建完全响应式设计。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

组件属性：使用组件属性添加文本、布尔值和实例覆盖，以减少手动创建变体文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

弹簧动画： 在原型制作时创建更自然和流畅的过渡动画。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

可变字体： 通过各种字体样式和功能拓宽您的设计和排版的可能性。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

其中自动布局和组件是我们经常用的功能，新增加的功能简介如下：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

一、增加了单侧描边文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

二、自动布局文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

1、Figma 一早就有拖动改间距的功能，只是之前没有运用到自动布局上。只要把整齐排列的元素全部选项，拉动中间的红色横杠就行。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

现在选中自动布局的 Frame，就会出现代表间距和边距的横杠，鼠标拖动即可调节宽窄。如果拖动时按下 option ( alt ) 键，还能同时统一调整两侧内边距。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

2、绝对定位文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

用 Figma 的自动布局很难做出下面这种层叠关系，因为所有元素必须从左至右或从上至下排布才行。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

现在有了绝对布局功能后，能够将一个元素固定在 Frame 的某个位置上，相当于从自动布局中脱离出来，不和其它普通元素一样依次排布了。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

3、文字对齐文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

现在允许在自动布局模式下设置文字对齐，只需点击「…」图标打开高级布局面板，开启 Text baseline alignment 就行。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

三、文字编辑文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

前端开发做自动省略，只需一行代码。但是大部分设计工具却没有这个功能，需要设计师自己手动删除多余文字，并在末尾加上 " … "，想想还挺不合理的。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

现在可以在文字的 Type setting 窗口设置设置一下，不管有多少文字都能根据文本区域自动省略了。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

四、组件属性文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

Figma 的组件灵活性很高，颜色可以改、图片可以改、文字可以改、图层可以删……虽然方便，但是变体太多不好管理了。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

组件属性，就可以用来标出主要的设置项。P.S. 虽然即便设置了组件属性，之前能改的地方也依旧能改，但多少有了些规范作用。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

组件属性又三种类型：布尔属性（是否展示）、交换示例属性（切换图标）、文本属性（修改文本）。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html

通过三种组件属性，可以实现以下文章源自菜鸟学院-https://www.cainiaoxueyuan.com/ui/35180.html