我们先来回顾一下现阶段各大UI设计工具的概况

现阶段，UI设计工具已经蛮饱和的了。自从Sketch以其光滑、简单、高效的工具来制作用户界面设计以来，许多公司都紧随其后，从设计工具的市场份额中分了一块蛋糕。根据UXtools进行的2019设计工具调查。Sketch去年依然是最热门的工具，但是对比2018年，相当多的工具已经逐渐迎头赶上。

2019年最受欢迎UI设计工具调查结果

UI设计工具调查图2019

2018年最受欢迎UI设计工具调查结果

UI设计工具调查图2018

根据我观察到的这些工具的增长，我自己使用这些工具的经验以及听取其他设计师使用这些工具的经验，我预计近两三年间，能给我们带来更多惊喜的无疑是Sketch，Figma和Adobe XD 这三款工具。

今年，我与很多年轻设计师交流时遇到的最常见问题之一是“我应该学习Sketch还是其他工具？”。为了回答这个问题，我们可以深入研究工具的几个关键方面并进行比较。为了使本文简洁明了，我们只关注调查中的前三个工具，即Sketch，Figma和Adobe XD。

| 系统需求

让我们从该工具的一个关键需求开始，也就是您正在运行的操作系统。Sketch是Macintosh唯一的应用程序。因此，如果你运行的是Windows或Linux机器，那么你只能使用Figma或Adobe XD。

对于Mac用户来说，以上三款软件则都在你的选择范围之内。

| 定价

对少部分人来说，这是另一个关键的决定因素，假如你支持正版的话且资金实(TU)力(HAO)雄(BA)厚(BA)的话

。以下是对每种工具的个人版本的定价: 对大部分人而言，你懂的，请直接跳过这一段

Sketch:：$99美刀一次性付款。为期一年的免费更新。这意味着你可能需要每年支付$79美刀的续签费才能享受新功能带来的好处。

Figma：它有3个项目限制，单个项目中文件数量无限制+2个编辑器。

Adobexd: 2020年10月前免费，项目/文件不限，共享没有限制。2020年10月后，只有一个共享项目和两个编辑器。

Adobe XD似乎提供了最大的价值。

| 布局编辑

大量的设计时间都花在了管理布局上。选择布局良好的工具对提高生产率至关重要。

对于Sketch来说，他们有智能的布局特性，可以在内容长度/大小发生变化时自动调整容器的大小。例如，按钮背景调整为其文本长度。

Sketch的智能布局可以在编辑内容时自动调整元素的大小

Figma也提供了类似的自动布局功能，比如拖放内容的重新排列。

Figma的拖放自动布局

Adobe XD有其感知内容的布局特性，这有助于在调整内容大小时强制层组的填充。与其他工具的布局特性相比，我认为Adobe XD的填充特性是相当独特的。

Adobexd提供了填充布局特性，可在编辑内容时强制填充

当改变内容高度时，自动调整图层垂直高度的是一个很节省时间的方法。Figma在这一点是做的最好的。

| 协作

如果您与其他设计师一起工作，则这三种工具都提供了与其他人共享文件的方法，并且还可以通过安装插件的方式来满足更多需求。在这里的讨论中，我们将重点介绍每种工具自带的协作功能。

Sketch的文件可以存储在其云服务器中。这些文件也可以与其他人共享和编辑。可以使用版本控制，但撰写本文的检查工具处于beta版。Sketch可以与其他工具（例如Invision或Zeplin）配对使用，以实现诸如设计共享和移交之类的协作功能。Sketch正完善这些这些功能，但截至目前仍落后于其他竞争对手。

Figma的多人编辑示例

Figma凭借其实时协作功能脱颖而出，它允许多个人同时查看/编辑同一文件。这是近年来UI设计工具市场上最独特的功能之一。  实时编辑/预览功能很方便，因为任何人查看设计文件并可以随时看到最新的更改。除了实时协作之外，Figma还具有其版本控制，设计系统和检查功能。

Adobe XD于2019年11月推出了自己的共同编辑功能，其中包括多用户编辑和文件版本控制等功能。此外，XD具有与其他工具相似的共享和移交功能。

在Adobe XD中，允许多个人可以访问同一文件，并且您可以实时查看其他人的文件。

Adobexd的协同编辑功能目前处于测试阶段

考虑到Adobe XD协作功能处于测试状态，以及Sketch功能的完善度，Figma是这一模块是首选，特别是对于那些重视实时协作的设计师。

| 性能

对于大多数拥有良好硬件规格的人来说，这三种设计工具之间的性能差异不会太大。当使用大量画板/框架，外部插件和文件中的图像资产时，性能问题将变得更加明显。

使用Sketch时，在一个Sketch页面上包含几十个画板的文件上工作时，经常会遇到呆滞的交互。我还看到了一些报告，其中人们在使用第三方插件时遇到性能问题。

在使用Figma的日常流程中，我很少遇到性能问题。考虑到Figma是基于浏览器的工具，因此性能对硬件的依赖性较小，并且在大多数情况下都相当不错。

Adobe XD，我在2019年初首次启动时遇到了一些性能问题。此后，后续的更新解决了相同的性能问题。老实说，我没有像其他工具那样广泛地测试过XD的性能，但是到目前为止，该性能已经可以与Sketch媲美。

在性能这个模块中，根据我的经验，Figma依旧是最可靠的。

| 原型功能

当谈到原型工具时，有很多需要讨论的，因为市场上有更多专门的原型制作工具可供考虑。

Sketch支持屏幕链接，使用热点构建可点击的原型。 原型可以在本地预览，也可以通过Sketch Cloud与他人共享。另外还有一些不错的功能，比如“滚动时固定位置”和“点击后保持滚动位置”使草图与Invision提供的原型制作功能相当。

Sketch滚动时的固定位置功能有助于创建更复杂的点击原型

Figma拥有与Sketch几乎相同的一套原型特征。主要的区别是在过渡效果，其中Figma有一个智能动画功能，可以在状态的两帧之间创自动创建动画。使用智能动画，我们可以创建更复杂的外观原型。

Figma的智能动画可以在帧之间创建更复杂的过渡

Adobexd在原型设计方面功能是最强大的。除了Figma和Sketch提供的功能外，还有如键盘、手柄和基于语音的触发器，可以支持更专业的原型体验。

Adobe XD有一个用于构建基于语音的用户体验的触发器

对于原型开发的功能，Adobe XD无疑是最优秀的，它提供了丰富的输入选项。

 | 插件

这三种工具都带有一个插件生态系统。

Sketch的官方插件页面

Sketch拥有一个大型的、多样化的插件库。你可以找到许多有用的插件来加速设计工作流程或扩展草图的功能。

Figma插件页面

Figma的插件支持于2019年8月启动。从那时起，许多插件被添加了进来，但是与其他工具相比，这些插件还是远远不够的。

Adobexd的插件面板

Adobe XD于2018年开始了其插件生态系统。虽然它尚未与Sketch处于同一级别，但它的追赶速度很快。并且我认为，在这三个工具中，Adobe XD的插件的浏览和管理体验感是最好的。

那么，在插件这个模块，Sketch绝对是最佳的选择。

| 发展速度

当选择一个设计工具来投入你的学习时间时，一个重要的考虑是这个工具的发展速度有多快。

查看Sketch的更新日志，他们在过去的一年里，平均每个月都有一次重大的更新(1个完整版本)。这可能是由于2019年初他们为了“追赶”其他竞争对手，为什么这里的关键字是“赶上”呢，坦率地说，素描在功能上落后于Figma和Adobe XD有一段时间了。考虑到Sketch的推出比它的竞争对手早了几年，但是Sketch只是与其他竞争的设计工具的优势并没有很大，这是有点令人沮丧的。

Figma发布功能的速度和Sketch差不多。值得注意的是，Figma已经发布了更多与其他工具相关的集成特性，比如用于测试的Maze和用于原型设计的Framer Web。正因为如此，Figma能够很好地与那些使用额外工具来补充设计流程的设计师或团队合作。

相对而言，Adobe XD的发布速度令人印象深刻。它最初发布时(测试版在2017年底发布)存在不少问题，但在不到两年的时间里，它赶上了其他工具，成为一个强有力的竞争者。XD没有与其他第三方设计或开发工具广泛集成，但它与Adobe套件紧密集成。

在这方面，虽然Adobe XD到目前为止已经完善的还不错了，但Figma在推出新的和多样化的功能方面却更让人期待。

| 总结：

那么应该使用哪种工具呢?

Sketch、Figma和adobexd都是很棒的UI设计工具。如果你刚刚开始，还在考虑使用哪些工具，我建议你从Figma开始。如果您正在寻找还能够创建更复杂原型的设计工具(例如，语音输入触发器)，那么使用Adobe XD。最终，你的雇主/设计团队可能会为你选择一种工具，但好消息是这三种工具非常相似。这意味着如果你已经在一种工具上投入了时间，那么当你选择另一种工具时，大部分的知识都是可转移的。

最后补充，其实，软件不是最重要的，它只是实现你想要功能的一个工具，真正重要的是设计思维和还有你的思考能力。