1.1 XD的基本介绍

本书关于XD的介绍以XD 2019为例。XD是由Adobe公司开发的一款矢量设计软件，能够轻松地完成移动应用界面、网页设计及简单的交互设计，在Mac OS和Windows系统上都能获得比较好的体验，支持在iOS和Android设备上实时预览。其更重要的是除云服务外，XD的其他功能完全免费，并且能够与Photoshop、Illustrator及After Effects无缝衔接，甚至能够打开Sketch文件，打通设计全流程。

XD主要用于设计移动应用界面和网页，并且能够制作可交互式原型。本书中有关XD的操作使用的软件版本均是XD 2019的17.0.12.11。目前XD保持每月更新一次，且每更新一次都会增加一些新的功能。

XD支持一键切换“设计模式”和“原型模式”，在原型模式下通过“单击”和“拖动”操作能创建交互（图中蓝色的线条为交互调整线条），并支持在桌面端和手机端实时预览交互效果。

XD中的“重复网格”功能能大大减少设计人员的工作量。在交互设计中，绝大部分需要重复的设计工作都能通过“重复网格”功能来完成。以往，在设计一个文章列表页时，需要先制作好一组元素，然后通过复制、粘贴及修改等多重操作才能完成整个列表页的制作，枯燥、重复又耗时。有了“重复网格”功能，在完成一组元素的制作后，只需要开启“重复网格”功能，拖动重复网格的“控制”按钮，然后批量拖入准备好的元素，在几秒钟内就可以制作出一个完整的文章列表。

XD支持一键打开PSD、SKETCH及AI格式的文件，在Windows上也支持打开SKETCH格式的文件进行编辑，使得从其他软件切换到XD完全无障碍，也能够直接导出设计文件到After Effects进行动效设计。

同时，XD支持使用插件，据说为此官方曾拿出1000万美元作为投资和奖励，来鼓励和支持第三方开发XD相关的插件，增强XD生态系统。下图为部分已发布的XD插件，在管理器中就能直接下载和使用。

1.1.1 XD与同类软件的区别

与XD同类的软件有Photoshop、Sketch及Axure RP等，下面主要来说明一下XD与这3款软件的使用区别。

1．与Photoshop的区别

Photoshop是一款位图图像处理软件，诞生至今已经将近30年，包含图像处理、图形处理、文字处理及印刷处理等多种功能，是设计师必备的设计软件之一，主要用于平面设计、网页设计、美工及影楼后期处理等领域。尽管Photoshop是一款强大且好用的图像处理软件，但在笔者看来，其在UI界面设计和网页设计上使用起来并不是那么顺手。随着版本的升级及功能的不断增加，Photoshop越发成为一款重量级的软件，但与此同时也出现了占用内存越来越高、越用越卡及保存的文档非常大等问题。

XD是一款矢量设计软件，专注于界面设计，有着简洁的操作界面，功能清晰，无弹窗，启动速度和运行速度快，且非常轻量化。同时它可以直接打开PSD文档进行编辑，旧有的素材也可以直接拿到XD中进行编辑。此外，XD除云服务外的其他功能都完全免费，且云服务每月只收服务费9.99美元，与动辄单价数千元的Photoshop相比更具优势。

2．与Sketch的区别

近年来一款名为Sketch的矢量设计软件成为了设计圈的新贵，也被冠以“Photoshop杀手”的称号。Sketch在UI界面设计和网页设计上相比Photoshop有无可比拟的优势。据相关数据显示，Sketch在UI设计行业的市场占有率已超过老牌的Photoshop。但遗憾的是，Sketch不支持Windows操作系统使用。

XD与Photoshop一样，都是由Adobe Systems开发和发行的软件。XD开发和发行的目的便是与Sketch直接竞争。XD作为一款专注于UI界面设计和网页设计的矢量设计软件，XD的操作界面比Sketch更加简洁，并且在发布之初就推出了“重复网格”“原型模式”等比Sketch更具有优势的功能。相比Sketch, XD最大的优势便是同时支持Mac OS和Windows操作系统，而且XD还能直接打开PSD和SKETCH格式文件进行编辑，而Sketch不能打开XD格式文件进行编辑。

3．与Axure RP的区别

在笔者接触的一些有关XD的交流群中，经常都会看到有群友问道：“原型设计用Axure RP更合适，还是用XD更合适？”

Axure RP是一款专业的快速原型设计工具，使用人群更多的是产品经理。通过搜索引擎搜索关键词“Axure RP”，在图片结果中显示使用Axure RP完成的更多是简易线框图、流程图。

而通过搜索引擎搜索关键词“Adobe XD”，在图片结果中显示更多的是UI界面图，由此可知XD主要面对的是UI设计师。基于以上描述，笔者认为这两款软件侧重点不同，比较的意义不大（尽管XD也能制作线框图、流程图），因此这里不再做过多分析和描述。