基本功能
样式风格:Figma中可以制作出可重复使用的样式,如网格、色彩、效果、文本。就拿格子来说,格子由总宽、列、水槽、边距组成,当我们建立了一个网格,通过点击右边的加号就可以创建一个复用网格。
组件:在Figma中,通过选中一个元素,点击顶部创建一个组件图标,就可以创建一个主版本(Mac快捷键:command+option+k)。选择了多个元素后,可以通过单击顶部的组件中的下拉图标创建多个组件。
变体:简而言之,变体就是一个超级组件(a.b.1.2.)通过分类将多个组件(a.b.1.2...)结合起来,设计者最终通过调用A,就可以达到同时切换Aa.Ab.A1.A2..
自动布局:自动化布局是指当子元素在增加或减少时,父元素的尺寸会自动改变,或者当父元素改变时,其子元素会按照规则自动改变。使用自动布局,可以大大减少重复性工作(间距计算.元素校准),也可以使UI设计稿框架化,帮助我们站在开发视角绘制界面,这有助于提高界面还原度。
互动部分:一个交互组件指的是一个原型交互可以在组件集的各种变量中创建。在使用创建良好的交互组件时,可以在预览界面上完成组件的不同状态切换,并可以对组件进行交互。
特色功能
历史版本:Figma可以自动保存最近30天的历史,因而设计师可以尽管放开的去思考和构思,随时可以恢复到之前的版本。
栅格系统:在Figma中我们可以给页面(即frame)和组件添加栅格,而栅格可以添加网格、行和列。在页面中添加网格可以帮助你对齐元素,但我一般会添加列栅格,因为它可以帮助我把元素排列为等分的几列,并保持元素间隙。
插件库:Figma的插件库目前还在极速的更新和壮大当中,越来越多的开发者将自己的想法注入到Figma,相比 Sketch 那种传统的安装与更新插件的方式,Figma 基于web的优势又体现出来了,直接在组件菜单中搜索,点击Install等待安装完成就可以了,之后在画板页面便可以从左侧的菜单栏中直接选择调用已下载的插件了。
主要缺点
对中文的支持不是很友好:直接在Figma里输入中文由于字库的关系,会有很多中文是没有办法正常显示的。要解决这个问题,需要同时下载 Figma的 Font Helper,才能保证在浏览器中正常的使用本地字体。如果下载后还没有解决的话,那我推荐你可以再下载两个字体插件, Better Font Picker 和 Font Explorer 。
全程需要联网:这个是由 Figma 自身的特性决定的,这无疑会限制 Figma 的使用场所。
网络不是特别稳定:这个由于 Figma 的服务器在国外,直接使用国内网络进行连接的话,确实会有时候打开不太迅速,保存的不是很及时等情况发生,这个时候就得找个梯子了。