啥是飞个马！

Sketch对于我们来说在熟悉不过了，它解放了我们用PS做设计稿的时代！现在Sketch也已经得到了很大的普及，大多数的团队和设计师都在用它做设计稿，但是我个人在使用过程中也遇到了很多Sketch存在的问题，也许其中就有你也碰到过的哦

1. 1.Sketch终端无法访问账户，不能够线上共同协作。

2. 2.不想每天带着U盘上下班，拷贝源文件（Sketch低版本打不开高版本的文件）

3. 3.开发交付，蓝湖一直以来是免费使用的，在今年6月份也开始实施订阅收费。这让我不得不删减一半多的项目才可以添加新项目

4. 4.Sketch插件很丰富，但每次更新都会有几个插件出现不兼容罢工情况

5. 5.流畅度，Sketch面对小项目还好，页面一旦多起来运行就会卡顿

6. 6.实时预览有时候会出现错误，必须保存文件推出软件后，重新打开才可以

7. 7.。。。。

emmmmm。。。。。我用的是破解版Sketch软件，正版会不会出现这些情况我不晓得哦，反正我是没用过正版，嘻嘻嘻。针对这些问题无非就是协作和流程的问题，但是遇到Figma之后，这些问题就不复存在了，这是为什么捏？？？

 

什么是Figma？：以为是个青铜实际上是个王者！

啰哩啰嗦那么多，正式进入主题。Figma是一个基于浏览器的协作式UI设计工具，从推出至今受到UI设计师的青睐，也有很多的设计团队投入了Figma 的怀抱，比如像阿里、京东、字节和小米等就有设计团队已经开始使用Figma做设计了。

其实很多人包括我自己对于在线工具的第一印象就是觉得功能鸡肋、性能差，尤其是较为专业的工具更是觉得不咋滴。然而实际体验下来与Sketch别无二致，某些功能甚至比Sketch还要更懂你，更重要的是使用过程如丝般顺滑，从此跟Sketch卡顿说拜拜👋啦

 

基于浏览器有什么好处？

• 跨平台：不受平台限制，在iPad上也可以使用（Win、Chrome、Linux、Mac、iPad）

• 无需保存：线上实时保存，文件存储云端。Figma支持历史版本恢复，免费版最多保存 30 天。专业或团队版无限制

• 分享无限制：设计文件一个 链接，即可第一视角查看/编辑。这对工作流程是一个很大的改变

• 多人线上协作：这个协作是多人同时对同一个项目文件进行线上实时编辑修改，尤其是疫情之后，线上远程更凸显重要
  

  
  

兴趣驱使：实际上手操作

撸起袖子，铆劲学就完事了！通过草帽sMao的B站教学视频  https://space.bilibili.com/108104104/video

以下是我跟着教程演练的内容，因为app是临摹的，主要以熟悉Figma的功能体验和操作逻辑，从通用的「基础样式」到「组件搭建」再到「页面还原」最后「对接开发」。当然你还可以玩起「高保真交互」

图为临摹项目

Figma 有插件么？：Sketch 上我依赖很多插件完成工作

不得不承认，Sketch的强大一定程度上是拥有灰常灰常丰富的插件来辅助我们完成设计。当然，Figma 也支持插件开发。

哇哦！那他有哪些功能？

Figma = UI设计（更强大的组件功能Component + 更加智能的Auto Layout + 更加便捷的Layout Grid） + InVision（原型设计） + Zeplin标注（无需任何操作，直接将文件分享给开发即可查看） + Dropbox（云端同步） + Abstract（版本历史） + Craft-Freehand（实时讨论） + Liveshare（实时分享） + Team Library（团队组件库）+ Web API +....

 Figma 的一些功能和特性

UI 设计

Figma 是为 UI 设计而开发的设计工具，除了有和 Sketch 一样基本的操作和功能，还有许多专为 UI 设计而生的强大功能。

原型设计

你可以在 Figma 里面无缝完成从设计到原型演示的切换，不需要反复同步设计图到第三方平台，我们同样可以利用 Figma Mirror 在手机上预览效果。

前端协作

工程师可以在设计图上获取标注、并且可以导出所需任何资源（包括 CSS、iOS、Android 样式）

实时协作 + 内置评论

在 Figma 里，设计和协作可以是同时进行的，任何人都可以在设计图的任何地方添加评论， 你可以在评论中 @其他人或将评论标记为已解决。

团队 Library

我们可以跨项目共享和更新 Component、Style，但需要注意的是免费版不能跨文件共享 Component。

封闭与打通

Figma 被我运用到实际改版新项目中带来的最大最直观变化是我不再使用 Sketch、蓝湖、Axure、脑图，因为 Figma 自身包含了以上的功能，除了省去在不同应用之间的切换的麻烦且降低了学习成本，原本我们要熟悉整个工作流程需要学很多个软件进行协同，现在你只需要Figma就够了。极大的改变了我们的工作模式。

设计的封闭性

设计一直以来都是较为封闭，上下游对接同频道困难，甚至设计内部分享和同步效率都较低

关于前者对接上下游时我们会遇到两种情况，对于老板或者甲方需求方，由于设计文件为专业设计工具的限制或分享受限，导致上下游很难直接打开，就需要我们要一张张图片导出效果图给到对方，如有需要修改地方，改完后又需要再导一遍，反复多次之后砸电脑的心都有了！

后者，设计师内部协作更是抓狂，先不说文件同步共享问题，要想多人同时对一个项目协作完成一个需求，除了付出较高的沟通成本外，维护迭代组件库和调用都是问题，除了互联网大厂对协作较为完善外，中小企业的很难会通过Sketch能够维护并迭代组件和调用

Figma协作的全新模式

所有的上下游对接和对外分享只需要一个链接🔗，无论是视觉稿，还是交互稿，组件系统还是规范亦或是开发标注，都可以通过一个链接第一视角查看所有

分享文件只需要复制一条链接即可，项目内的人可以通过不同权限进行编辑/查看。透明开放式设计最直观的好处就是，降低沟通成本，避免信息不对等和延迟性带来的不必要的冲突，同时也可以让上下游的成员直观的看到一个需求是如何演化为设计稿的过程

协作问题，Figma文件内，可以多名设计师分页对其不同模块尽行完成修改和设计，比如一个设计是负责某一个模块的修改或者是新增页面设计，另一位设计师可以同步进行组件设计和归类，多线程并行让设计师之间的协作更能够专注于自己的任务的同时更容易在多人模式下把控整体效果产出和组件系统的更新

协作视角

自己视角

Figma组件化

在Sketch做设计稿的时候我也尝试为一个项目尽可能做完善基础组件和后期迭代，但是Sketch的组件归类和命名方式以及调用路径想想头发就掉不少！另外再经过几个设计师或者历任设计师的手后，原本的组件系统早已面目全非，冗余混乱。所以趁着自己近段时对项目大改机会，从0到1的重新搭建组件系统

组件系统的设计基本遵循原子化设计理念，从最基础的颜色、字体、字号等元素开始，将相关元素放到我们的组件库页面统一分类管理

再完美也有缺点

作为一款在线工具，缺点也是非常明显，那就是受限于网络，这几本上师所有在线工具共有的软肋，如果网络状态较差，别说线上协作，进入项目都困难。

目前国内访问Figma不需要科学上网，但是有时候访问依然比较迟缓，不知道是国内通病还是我网络差

网络差就会这样一直加载

趋势及未来

设计师个人

值得体验，经过疫情之后，远程办公，线上协作更是引起了极大重视，未来办公环境将不受限制，你可以在家办公而且还为企业降低HC成本，自由设计师将会成为职场设计师的下一站。当下的协作方式还有提升优化的空间，另外，Figma个人使用完全免费

设计团队

对于小团队来说，用就完事了，

大公司考虑的比较复杂，设计工具的更替会遇到很多困难，生产环境的迁移，网络的稳定，文件的备份存储等等都是问题，另外Figma的团队版是至少 $144 / 人 / 年的支出，不过如果你遇到一个好的老大，自上而下推进，懂得设计的多元化和包容性，那就是另一回事了。

如果想体验上手，先去B站通过草帽sMao的教学视频  https://space.bilibili.com/108104104/video快速浏览一遍，感兴趣可以进一步研究

拜拜啦。。。。。对你有帮助就麻烦按下你的大拇指叭！！！！嘻嘻嘻嘻😁