超强远程协助能来的Figma和人气很旺的Sketch谁更有前景？

Sketch和Figma是最热门的两个UI/UX 设计工具，从时间顺序上来说，先有Sketch再有Figma，两个软件在设计界面和体验方式上非常相识，但与sketch相比Figma最大的不同是线上协作功能非常强大，而且是一款线上免费软件，只有当用他们的高级协作功能才会要付费，Sketch一直就是一款付费软件，在国内已经有很大的用户基础，当然最新的一些版本sketch也开始注重云端功能了。由于两个软件界面非常相似，所以没有迁移成本，但在国内登录figma的软件非常慢，而且没有中文版，所以现在普及有有一的困难。

以下是老外分析的两个软件的优劣点，可以作参考。

 

两款非常好用的UI设计工具，sketch和figma之间的竞争还在持续，设计师最经常问到的是：哪一个软件更好用？我应该从sketch迁移到Figma吗？或者反过来。

 

我已经用sketch4年多了，我非常喜欢这款软件。因为有sketch这样的神器将我们从PS做UI的历史中解救出来，如果你是从PS时代开始做UI的话，你就应该记得有多痛苦。

 

我的公司最近开始迁移到用Figma。所以我有机会使用Figma来工作，然后我就发现它居然是和Sketch不相上下的神器。

 

所以在这篇文章中，我将会带大家一起看看这两款工具的差异点，以及最后会告诉大家到底哪个才是最好用的。

 

我将会在以下几个方面来比较这2款软件：

• 功能特性
• 组件系统
• 协作能力
• 文件交接
• 原型功能
• 文件导出
• 离线办公
• 插件 

1.功能特性

这两种工具几乎具有相同的功能，相同的快捷方式和相同的结构。如果会使用其中一个，另一个往往也能直接上手。

 

• Figma支持在Figma中打开Sketch文件
• Figma 可以在任何系统中 (Windows, macOS..) 使用，因为它是基于浏览器的
• Sketch 是 macOS  里的原生应用, 所以它只能在Mac中工作
• Sketch 和 Figma 目前的性能表现非常相似（注：Figma实测还要略胜一筹）
• Figma 需要花费比较长的时间来打开一个项目文件（注：一定程度上取决于网速），而sketch打开往往只需要1秒

2.组件系统— Symbols Vs Components

我原来用sketch的symbols来制作组件库感觉还不错，但是当我开始使用Figma后，我发现在组件化这块做的更加优秀。让我来告诉你为什么！

 

Sketch中的组件样式并不是原子级的，当我想要构建文本样式时，我必须把所有想要的样式全部列出来，需要做一个长长的列表。

我来解释下Sketch是如何工作的：当你定义任何文本或图层成组件样式时，Sketch会将所有属性保存在这个样式中，如果想要修改symbols中的任何样式，都是以覆盖的形式来完成修改。例如，如果你希望有不同的对齐方式或不同的颜色的组件，在用Sketch时，就必须提前做好所有可能的文本/图层样式。

 

让我们再来看看同样的情况Figma是怎么处理的：

Figma的惊人之处在于它的组件更具原子级，在component属性面板中的每一个属性都可以直接定义样式，它的工作模式更符合设计师的需要，你可以单独保存颜色，字体，投影，并且可以任意组合成你想要的主要样式。这种工作流程是非常有帮助的，因为如果当我想要改变颜色时，我不在需要像Sketch那样深入到元件中去调整文本风格或者是图层颜色。在Figma中，你可以真正做到修改一处就能改变所有。

 

(注：从我自己的使用经验来看，Figma中的component复制后产生新的Instances，比symbol强大的地方在于，存在子父级的关系。相当于你可以调整一个实例样式，但又不会干扰到父级的样式，而修改父级的样式又能修改全局。有点绕，看一张图吧。)

我也注意到Figma把组件做的更灵活了，相比于Sketch的symbols，限制更少。

 

在Sketch中，如果你想要修改symbols属性，可以通过symbol中的覆盖样式来调整。但是你不可以删掉组件中的元素。例如，如果你有一个带有图标的按钮，此时就必须创建2个symbol，一个带有图标，另一个不带图标。

 

Figma 的组件有些不一样，可以跟sketch一样修改覆盖样式，但也可以直接修改组件层，以及层的属性。

 

3.协作方式

选择一个合适的工具对于设计师之间的协作是非常重要的。

 

Figma在协作的过程中采用了谷歌文档的模式，允许所有设计师在同一时间，同一个文件上同时开工。你能见到许多鼠标在页面上，可以看到其他设计师正在做什么。

 

老实说，我个人不大喜欢有人一直盯着我看，或者和别人在一个文件上工作。因为当文件放大时，两个人想要在同一个屏幕上工作时，简直崩溃。但有一些设计师更喜欢这样的工作方式。

让我们看看Sketch如何处理协作的事情，我发现Sketch在这部分其实做的更好因为它里面有一个插件叫做abstract（注：可以用来做版本管理）。它允许设计师拥有像Github那样的项目分支系统，每个设计师都在分支中进行设计，然后合并分支，解决冲突。我个人更喜欢这种工作方式，但有些设计师觉得它太复杂了。

 

4.文件交接

设计师如何把设计稿发给开发？

 

Figma 有自己的内置标注工具，但我在实际中跟开发人员遇到的最大问题是，当我发一个界面给开发时，我必须发送整个项目文件链接。当他们点击那个链接时，就必须得等，直到项目完全加载才能看到项目中有一个界面的标注文件。或者在汇报会议上，我们想打开设计稿时，可能会等到会议结束，链接都还没打开。

 

Sketch有一个Cloud来分享界面，但我觉得目前还未开发完善，但其实目前已经有非常多的插件来使得分享更加流畅，比如像abstract, Zelpin, invision …。使用这些插件，你只需要共享需要的界面文件，这样加载的速度会快上很多。

 

5.原型功能

在Figma里面做原型是非常方便的，你可以把原型非常容易的发给用户作为测试，因为它的分享和更新都异常简单，打开一个连接就好了。

 

Sketch是本地化工具，做原型分享就不大方便了，你必须通过Sketch cloud来分享它，而且这个云目前还非常基础，基本上做不了太多事情。

 

对于想做出有意思的动画和漂亮的原型，Sketch和Figma都可以结合需要工具来做，比如Flinto, Protopie, Principle…

 

6.文件导出

这两个工具在导出时是比较类似的，并且有许多插件可以同时被使用的，例如Zeplin和Simpli，它们的存下使得切图导出更加容易。

 

但我在Figma中真正怀念的功能是可以复制任何画板或任何元素，并将其粘贴到Figma之外的软件中，但现在是不行的。Sketch是可以的，我以前经常这么做，所以我的桌面并不会有太多文件垃圾，我希望Figma能尽快实现这一点。

 

7.离线办公

两种工具都可以离线工作，但Figma不能加载组件，而且离线工作时非常慢。但Sketch在离线的情况下几乎是没啥变化。

 

8.插件

Sketch比Figma出来的早很多，所以插件也要更丰富一些。但我真正喜欢Figma的是他们在每个插件进入到Figma商店之前都会对它们进行审核。这很好的保证了插件是可信的，不会破坏项目文件本身。

 

最后，我想强调的是，我对使用哪种工具更好没有特别强烈的意见，因为到目前为止，这两个工具都还做的不错。学习其中一种，你也就会使用另一个，转换其实非常容易的。

 

因此，我建议要根据项目的具体条件来选择合适的工具。

 

另附上Figma中文用户手册：https://figmachina.com/guide

转载注明：云瑞
原文地址：微信