真香！设计神器 Sketch 65 进阶指南（建议收藏）

我在日常的工作中会做一点设计相关的工作，工作之外，我也依然会抽空来尝试不同的设计风格，这一点相信早期关注我的小伙伴应该会很熟悉，有没有发现无论是封面图或者文章首尾的图都变得越来越精致了呢？

不知道我们小伙伴中有多少是设计师呢？欢迎在留言区亮出你的职位~即便不是，你或许也听说过Adobe家的设计双子星Adobe Photoshop和Adobe illustrator吧！不过，相信「Mac软件天堂」接触过设计的小伙伴一定都知道Sketch，这是Mac上几乎与上面提到的Adobe家两款软件齐名的神器，它的图标是一颗钻石💎，当然也有钻石品质，可能是Mac最强大的移动应用矢量设计工具了！

Sketch对于网页设计和移动设计者来说，比PhotoShop好用N倍！尤其是在移动应用设计方面，Sketch 的优点在于使用简单，学习曲线低，并且功能更加强大易用，支持自动切图，并且具有移动设计模板，能够大大节省设计师的时间和工作量，非常适合进行网站设计、移动应用设计、图标设计等，功能非常强大👍！

咱们今天的标题是Sketch进阶指南，为了对得起这个标题，内容一定得干货，废话不多说，咱们这就走起。

软件安装及界面介绍

从下方下载链接获取Sketch软件包后，按照其中的提示将软件拖拽至“应用程序”文件夹即可成功安装。安装完成后直接打开，即可进入以下这个界面，就像其他任何一款好用的软件一样，左侧栏提供了使用教程和一些必要的工具，让你可以轻松上手：

Sketch默认提供了Android Icon Design（安卓图标设计）、iOS App Icon（iOS应用图标设计）、Material Design（材料设计）、Prototyping Tutorial（原型设计）、Web Design（网页设计）四种模板供你选择，如果你都不满意，还可以选择「最近使用」新建空白文档，随心所欲设计自己想要的作品。

新手入门

对于刚接触Sketch的新手来说，任意打开新建一个空白文档，就可以进入如下的编辑界面，简单插入一些形状和文字，尝试顶部菜单栏的各种功能，就可以慢慢上手Sketch。

我简单地将Sketch划分为以上的4个部分，从顶部至下部左中右依次是“顶部功能区”、“左侧页面&画板区”、“编辑&预览区”、“右侧属性区”，其对应的功能分别是：

（1）顶部功能区：添加各种素材，例如形状、图片、路径、画板等，同时还可以实现各种元素的编组、缩放、布尔运算等，是最核心的功能区域。

（2）左侧画板&页面区：像PS一样可以分图层清晰地显示每一层的内容，还可以通过插入画板仿真模拟素材的实际显示状态。

（3）中间实例编辑&预览区：最主要的操作区域，所有的元素创建、移动、组合等操作均在此区域完成，可以直观地看到作品的全貌。

（4）右侧属性区：针对不同的素材显示不同的属性选项，例如最基本的图片和文字的属性就不一样。添加任意元素后选中，即可在右侧属性区域自定义元素的属性。

新手进阶

我一直认为最好的学习方式就是研究别人的作品，遇到不懂的问题就用搜索引擎或者在知乎等社区寻找答案。你完全可以下载一个别人做好的Sketch源文件，花时间去拆解每一个模块是如何做出来的，再带上自己的理解重新复原一份作品，相信你会有很大的进步的。

图中的这份是我在网上Download的一份电商APP的Sketch源文件，用来作为今天的示例文件，每一个文件都可以单独拆分学习，感兴趣的小伙伴可以到UIKIT（http://www.uikit.me/）下载（非广告）。

同时，为了最高效地帮助你上手Sketch，我这里要特别强调的是注意对Sketch“Symbol 组件”的使用，“组件”可以帮助你快速实现最不同页面中重复使用素材的快速编辑。

创建组件也很简单，制作好一个需要重复使用的元素后，选中该元素，单击顶部“工具栏”中的「组件」按钮，即可将该元素转化为一个组件。以后在任何一个页面需要用到的时候，只需要复制一个过去使用即可。当后期需要进行修改的时候，只需要双击其中任何一个即可进入编辑界面，修改一个即可实现对所有相同组件的修改。

Sketch插件

我在「Mac软件天堂」分享过这么多的软件，我总结了一个规律，越是那些为人称赞的神器，肯定会有各种各样的插件来丰富其功能，比如：Chrome 浏览器、Adobe Photoshop、Final Cut Pro等均是此类。

Sketch当然是这样的神器，有非常多好用的插件可供你选择，我今天推荐几款我认为比较好用的三款插件，如下：

（1）一键汉化插件 SketchI18N

下载后双击打开即可，安装完成后重启Sketch即可完成汉化，以下即为汉化后的Sketch（不过之前有小伙伴反馈说新版本的sketch已经原生支持中文，所以如果安装成功即是中文的小伙伴就不用安装这个插件啦~）。

（2）一键搞定产品页面标注插件 Sketch Measure

安装此插件后可以在Sketch中标注任意元素的尺寸和位置等信息，精确到像素。具体的使用方法是依次点击“插件”-“Sketch Measure”-“Toolbar”调出工具栏，然后任意选择一个元素，点击标尺图标即可看到详细的位置信息。

除此之外，Sketch Measure还提供了标注图层或文本层的信息，如填充颜色、边框颜色、不透明度字体和字号等丰富的功能，实在是Sketch必备良心插件。

（3）Sketch设计稿转换为Axure内容插件 Axure RP

Axure作为使用最多的原型设计软件，可是产品汪的必备恰饭工具，UI设计也是必备技能，在Sketch中设计好后，可以用这款插件把Sketch设计稿转化为Axure支持内容，可以直接在Axure中粘贴使用。

如果你还想了解更多的Sketch 相关内容，可以访问SketchUI（http://www.sketchui.net/）网站了解更多的内容（也不是广告）。

一点感想：学习任何一款软件都有从入门-上手-熟悉-精通的过程，不同的阶段所需要的时间也不一样，Sketch是一款可以轻松上手的软件，但是要做到精通其实也不容易，需要不断反复地练习及领悟。

软件下载地址：https://www.macfans.org/thread-37588-1-1.html