Sketch最新资源合集(工具|插件|资源|教程)
从“自学设计”到现在能够独立进行UI设计,我使用的一直是Sketch这个UI设计工具。简洁、轻便、高效是我喜欢它的原因。但是要学会并用好一个工具并不简单,特别是Sketch,你除了需要掌握它的主要功能之外,还需要知道有哪些插件和资源能让你更有效率地完成UI设计。下面便是技匠从开始使用Sketch以来所搜集和整理的相关工具、插件、资源和教程,希望同样对那些Skech初学者们有所帮助。
工具篇
Sketch 3
Sketch是一款简明而现代的UI设计工具。Sketch只有几十M,相较于Photoshop,它小巧得多,更重要的是它是专为UI设计而生的,我不必关注那些与我做UI设计毫无关系的图片处理功能,从而降低了工作环境中的噪音。另外,通过强大的插件功能,我能根据需要进行安装使用,这大大提高了我的工作效率。

Sketch Toolbox
除了Skech本身之外,你第一个需要安装的工具就是Skech Toolbox,它能方便地让你搜索并安装和管理你的Sketch插件。另外它还能够自动更新那些已经安装的插件。

App Store Screenshot Builder
在你将你的App发布到App Store之前,需要制作一些优秀的截图放到App的介绍中,App Store Screenshot Builder将是你所需要的工具,你在Sketch中完成的设计,可以通过它转换成漂亮的屏幕截图。

插件篇
Craft
由InVision开发的Sketch插件Craft,可以快速采集真实用户头像,用户名,文章标题,时间等数据运用在你的设计稿中。同时还能通过Duplicate功能快速创建包含标题、头像、内容的列表项等内容。这个插件能够帮助设计师节省大量的时间。(优酷视频: InVision 发布一款 Sketch 的效率的插件 Craft)

Fluid
Fluid允许你通过数学表达式来设置Skech中元素或组的位置约束关系,非常实用。

Zeplin
设计师可以将Skech中的Artboard导入到Zeplin中,并快速生成一套样式指南(包含色板、元素位置约束,元素大小等),这样开发者就能非常方便地参照这个样式指南进行开发,并还原设计了。

Magic Mirror
通过Magic Mirror你能将你在Skech中所做的设计,进行图形变换,放置到不同的实物模型(如一个平放的iPad,或一个拿在手里的iPhone等),对你进行设计的展示非常有帮助。

Code Generator Plugin for Sketch
这个Skech插件能够将你的设计直接转换为Swift或ObjectiveC代码。

SF UI Font Fixer
iOS 9的San Francisco字体拥有非常良好的和读性,但同时使用它也有严格的要求。在Sketch中你必须根据Apple的使用指南在Display和Text两者之间准确地根据Font size调整字符间距。而SF UI Font Fixer能够帮助你自动地进行转换。

Sketch Palettes
Sketch色板使你能够非常方便地保存或导入全局或文档色板。其中推荐的色板对你进行IOS设计同样非常有帮助。我们一般可以从一个包含了iOS,Material Design,和Flat UI 的全局色板开始。

Icon Fonts
Icon Fonts能够让你从包括Font Awesome, Ionicons和Material icons这些知名图标库的上千个图标中选择你需要的,并应用到你的设计中。

Content Generator
Content Generator能够为你列表中的标题,内容,头像,图片批量产生真实的内容。从而使设计师从大量的重复劳动中摆脱出来。

Dynamic Button
在你日常的设计中可能需要处理很多带有文字的按钮,每次文字内容变化时,你就需要相应地调整按钮的宽度,这非常让人头疼。有了Dynamic Button这个插件,你只需要调整文字,按钮就会自动根据预先的设置进行调整。

Measure
当设计师交付设计给到开发团队时,为了便于开发人员还原设计,需要给设计作品加上样式说明。Measue能帮助你在你的设计中添加样式,尺寸,元素间距等信息,很有效地简化了设计师与开发人员之间的沟通。

Find and Replace Sketch Plugin
当你需要在许多Artboad或layer中同时替换某一段文字时,Find and Replace非常管用,它能够帮助你进行批量替换操作。

Git Sketch Plugin
使用这个插件,你可以在Sketch中直接将你的设计作品保存到Github中,并且能够通过它查看修改前后的变化效果。

Mira: real-time preview while designing in Sketch
对于Android用户来说非常有用,因为Sketch Mirror只能在iOS系统中使用。

Sort Me Plugin
当你的设计稿因为里面的层越来越多而变得非常混乱时,Sort Me可以帮助你把一切重新排序好。

资源篇
Sketch App Sources](http://www.sketchappsources.com/)
最早出现的Sekch资源站,包含大量教程、文章、插件等内容。

Sketch App Rocks!
一个新的Sketch资源网站,包含插件,图标,教程,模板等各种Sketch资源

Skech中文网
国内比较有名的Skech资源网站,包含一些翻译教程,资源以及中文社区。

Sketch Repo
Sketch Repo包含了大量免费的高质量Skech资源。

Sketch Talk
Skech Talk是一个面向使用SKetch的设计师开放的社区,那里有很多设计师关于Sketch的各种讨论。

教程篇
Sketch 3 Beginner Tutorials
这是SONARLEARNING上的一套共22集的Skech使用教程,非常适合初学者学习Skech使用。(Youtube教程已下载,可通过微信获取)

App Icon制作教程
这是Medium上一篇非常有名的App图标制作教程。你也看到了中文翻译版的教程:Sketch绘制立体时尚质感的IOS应用图标

Sketch App Tutorial Series
Medium上的Skech教程系列文章,一共有5篇。作者从0开始,带你体验Sketch的各项重要功能,并且给出了作者自己的一些辅助工具推荐,非常值得参考。

Harnessing Vector Awesomeness in Sketch
Medium上一篇非常棒的教程,教你如何使用Skech中的各种工具来制作不同的矢量图形。

Sketch 快捷键
用一个页面让你学会所有Skech中的快捷键。

The A to Z of Sketch
这是一篇以字母进行索引的Sketch教程。包含了大量基础的Sketch使用方法和技巧,非常实用。

如果你也有自己推荐的Skech资源,也欢迎在点评中分享哦 _
技匠,以上内容欢迎大家分享到朋友圈/微博等。如需转载,请通过简信联系授权。谢谢大家!