我为什么选择Figma作为主力设计工具

Figma自2012年创办于美国，2015年逐渐被国内设计行业知晓，虽然不如Adobe产品那样历史悠久，但其后来居上，国外和国内部分先进的设计团队，都已逐步将Figma作为主力设计工具。

许多年前，人们对UI设计工具的认识还停留在Ps(Adobe Photoshop)的时代。不可否认，Ps确实是目前最牛逼的设计软件，但“牛逼”不代表“适合”。Ps更倾向于处理位图，而它的同胞兄弟Ai（Adobe Illustrator）虽可做矢量图形，但也仅适合做平面设计。

对于UI设计来说，视觉层仅仅是表现形式，核心部分是交互设计和规范化组件设计。比如做一个按钮，需要做出“默认、悬停、按下、选中、禁用”等多个样式，做一个Tab组件需要主组件能统一修改所有子组件样式，按钮边框随文字增减改变宽度……这些需求，在复杂庞大的Ps中来实现并不是一个最优的选择。

随着Sketch、Xd等专业UI的设计工具的出现，越来越多的设计师开始使用组件化设计，设计系统更加规范，样式更加标准和统一，设计流程更加清晰和高效。但是，Figma的出现，在UI界掀起了新的浪潮。

为什么选择Figma？

1. 实时同步

在Figma文件中，UI在进行设计时，所有人都能实时看到设计效果，修改时也能同步，省去了重复上传下载的过程。开发人员直接能看到最新的设计标注，还可以自由选中任何元素来下载切图。对于产品经理，打开页面即可实时查看设计进展，省去了询问进度的工作。对于领导，可以看到每个项目中正在进行作业的人员及操作过程，方便监管员工工作状态。

2. 多人协作

目前我们的项目越来越大，好几个项目都需要个其他UI设计师来共同完成。如果像以前一样，还是各做各的，必然会出现设计样式不统一的情况，增加开发人员的工作量。而在Figma中，只要一人做出了组件，其他人都可复用。如果需要修改组件样式，只需修改主组件，子组件就能全部同步修改。另外，如果一人遇到设计方面的问题，其他人可以直接在线协助制作，省去了描述问题和传递文件的过程，极大方便了设计师之间的沟通合作。

3. 性能极佳，且无平台限制和侵权风险

Figma是基于Web的设计工具，无需下载软件，只要一台能联网的电脑就可随时随地工作。并且操作起来十分丝滑流畅，毫无卡顿。而以前的Ps、Ai、Xd、Sketch等设计工具，必须安装庞大的软件才能使用。其中Sketch为MacOS系统独有，更是增加了硬件成本。在配置不高的电脑上，这些软件时不时就会卡顿，影响工作效率。如我前不久做的一个项目将近200个1920宽度的页面，如果放在Sketch上就会常常鼠标转圈圈，而在Figma上依然流畅。

设计类绝大部分软件都是收费软件，价格也很昂贵。国内虽然有破解版，白嫖一时爽，一旦被追究，后果不堪设想。Figma有免费版可以使用，支持两个编辑者，不限文件数和查看者数量。也有教育版可以免费使用两年（两年后需重新提交申请），体验专业版的跨文件调用组件等功能。而且Figma仅按编辑者人数收费，查看者免费且不限人数。

4. 丰富的插件环境

自2019年7月上线插件市场以来，越来越多的插件被开发出来，Figma的生态更加完整，更多公司开始将Figma作为主要设计协同工具。以前Xd和Sketch上的常用插件，都能在Figma插件库中找到同样功能的插件，甚至更多更全面。

比如有很多数据和图片填充插件可供选择，也可上传本地样例数据，使设计图做得更加逼真。有很多大厂官方组件可供调用，如ElementUIkit、AntDesign、GoogleMaterialUIkit等。主题控制插件可以一键调用不同的样式进行主题切换。还有Gitlab插件和Github插件，可以直接向代码仓库提交图标或设计图。

5. 高保真交互

在以前的sketch时代，主打视觉设计，唯一的交互效果就是热区跳转。而在Figma中，可以利用自带的Smart Animation做出逼真的交互效果，可以随时在电脑或手机上自行操作和体验。手势操作包含：点击、拖拽、悬停、按下、键盘输入等；交互效果有：跳转、叠加、交换；动画效果有：即时、淡入淡出（可自定义贝塞尔曲线）、智能补帧动画等。开发人员不必打开产品原型来看交互逻辑，只需在Figma中就能同时看到设计标注和原型交互。不少公司的产品经理也在使用Figma来进行原型设计。可以说，原型-UI-交互-标注-切图，全套流程均可集中到Figma中完成。

6. 版本管理：

如同Github一样，Figma可以进行版本控制。大版本下拉还有更多时间节点的小版本，每个版本均可导出为独立的文件。免费版保留30天的历史版本。目前我使用的是教育版，同专业版一样可以保留无限历史版本。默认保存为云端版本，不会因为硬盘的损坏而丢失。也可手动保存在本地，作为离线备份。

7. 布局逻辑：

Figma中的设计逻辑相对于其他设计软件来说，更加接近前端开发的布局逻辑，使设计师熟悉开发思维，而不是局限于视觉表现。如利用自带的AutoLayout和LayoutGrid属性可以实现flex布局和grid布局的效果。

8. 共享组件库：

气象行业产品有很多通用功能，设计制作并整理为组件库后，可以很方便其他项目产品调用，也可由其他编辑者共同维护和扩充。有了组件库，在设计风格上能更加统一和规范。同时，组件库还可以当做灵感收集、归纳思考的文件库，丰富团队大脑。

关于安全性

说到安全性，凡是上传到网络上的任何数据都不存在绝对的安全。虽然我们属于B端项目，但在设计图上并没有涉及国家机密的内容，也不包含真实数据。比较有价值的应该是产品思维和设计样式，而这些，在我们使用Sketch和蓝湖时，也不能完全规避风险。

关于网络环境

至于网络环境不佳导致打开页面时较慢的问题，可以有以下几个解决办法:
• 自行安装可上外网的梯子，加载速度会有更大提高。
• 公司或部门开放一个可以上外网的通道，供内部人员使用。
• 如果客户要看效果图，可以下载后发送图片格式。如果要看交互，可以录屏以视频格式发送。当然，如果客户那边网络好，可以直接发送交互链接，客户可以自由点击体验。
• 使用Juuust Handoff 交付插件，生成本地文件，开发人员打开文件中的html，就能看到类似蓝湖的标注页面。但此方法有一些不足，比如：
• 开发不能实时看到改动的地方，每修改一点，都要重新发送文件，增加了沟通成本。
• 看不到交互效果，一些弹窗叠加效果失效。开发人员只能打开产品经理制作的原型文件查看交互逻辑。
• 另外，据其他中国地区用户反馈，电信网络比移动网络打开Figma文件的速度更快。