Sketch：知名的移动APP和网站设计工具

Posted 2021-02-17 m-milly

以上图片来源于互联网分享，如涉及版权问题请联系作者删除。

文章素材来源：风云社区（www.scoee.com）

下载地址：风云社区（www.scoee.com）

 

【简介】

Sketch 是一款适用于所有设计师的矢量绘图应用。矢量绘图也是目前进行网页，图标以及界面设计的最好方式。但除了矢量编辑的功能之外，我们同样添加了一些基本的位图工具，比如模糊和色彩校正。

我们尽力让 Sketch 容易理解并上手简单，有经验的设计师花上几个小时便能将自己的设计技巧在Sketch中自如运用。对于绝大多数的数字产品设计，Sketch 都能替代 Adobe Photoshop，Illustrator 和 Fireworks。

 

 

【为什么选择 Sketch】

Sketch 是为图标设计和界面设计而生的。它是一个有着出色 UI 的一站式应用，所有你需要的工具都触手可及。在 Sketch 中，画布将是无限大小的，每个图层都支持多种填充模式；我们有最棒的文字渲染和文本式样，还有一些你一定会爱上的文件导出工具。

必要的话，你可以用无限精准的分辨率无关模式来查看画布，或者打开像素模式来查看每一个像素导出后的样子。

但是 Sketch 并不是一个位图编辑应用。也就是说如果你想修正一张照片或者用笔刷来画画，那么这不是你要找的应用。

 

 

【性能】

Sketch 的性能可以轻松的支持相当复杂的设计，但如果你创作出了一个很大的文件，你可能会想知道有哪些因素影响着 sketch 的性能。

模糊

模糊是非常消耗系统资源的效果。Sketch 需要先将图层渲染成一个位图（这已经很消耗资源了），然后再在上面添加一个模糊（这将更消耗资源），模糊半径越大，消耗的资源也就越大。

一个半径为 1px的模糊，Sketch 需要检查每一个像素周围的每一个像素，也就是说在计算新的平均值时，每个像素我们都需要检查他周围的9个像素的值。如果模糊半径为 2px，这些数据也会按比例增长。

请记住，背景模糊会比普通的模糊更加复杂和消耗资源，所以如果你想模糊一整张图片，那还是用普通模糊吧，不要用背景模糊。

阴影

这个规律同样适用于阴影，在（大的）图片上渲染（大的）阴影也是非常耗资源的，阴影越多，延迟也就越长。带有扩散的内阴影效果更是会消耗大量系统资源。

多页面

Sketch 的一个页面能轻松负载12个画板，但如果多个画板上都有大面积的阴影和模糊效果，文件操作起来就会很慢，解决这个问题最简单的方法，就是把一部分画板移到新的页面上去。

文本转化为轮廓

布尔运算是一种非常复杂的数学运算，如果你的一个阴影效果还包含了数个做布尔运算的子路径的话，文件就会遇到问题。

所以说你在将文本转化为轮廓是要格外谨慎。其实无需矢量化，文本也可以直接应用渐变效果。但如果你执意要将文本转化为轮廓，那记得现将每个字母都单独放在一个图层当中。

【快捷键】

Sketch 有一系列为数不多但相当实用的快捷键，他们能大大提高你的工作效率。

通用快捷键

?control+h: 触发选区手柄

?control+l: 触发自动参考线

?control+g: 触发网格

?Space: 抓手工具

?Enter: 编辑所选图层

??+3: 滚动至所选图层

??+2: 放大所选图层

?Z: 放大工具。按住 Z 键，用鼠标单击拖拽出一个区域放大。缩小啧使用 Z + alt 再用鼠标单击。

?Escape: 退出当前工具，取消选择所有图层或返回检查器。

?Tab/Shift-tab: 在当前群组中切换不同图层。

添加图层

?R: 添加一个矩形

?O: 添加一个椭圆

?L: 添加一条直线

?U: 添加一个圆角矩形

?T: 添加一个文本图层

?V: 添加矢量图层

?P: 铅笔工具

移动图层 & 更改尺寸

?alt + 拖拽鼠标: 复制一个图层

?alt + 鼠标悬停: 显示两个图层之间的距离

?alt + 更改图形尺寸: 两边对称的更改图形尺寸

?shift + 更改图形尺寸: 等比更改图形大小

以上列出的是一些隐藏的快捷键，但是当然啦，还有更多的快捷键已经显示在菜单里了。熟练的使用这些快捷键真的能大大加快你的工作速度。 如果你发现某一功能用另一个快捷键更方便的话，请一定让我们知道。

隐藏命令

Sketch 有一些隐藏的偏好设置，对于一些特定的使用需求将会很有用。想要使用这些指令，进入到 Mac 下的 “终端” ，然后输入这些命令。重启 Sketch 即会生效。要想关闭其中的任何一项设置，把命令中的 YES 改成 NO 即可，反之亦然。

defaults write com.bohemiancoding.sketch svgExportSkipAssignIdToLayerName -bool YES

例如当上面这条指令被设置成 YES, 图片导出 SVG 格式时，Sketch 就不会使用图层 ID 作为名称。