Sketch移动界面设计方法

1.全屏演示模式

与Photoshop里连按两个〈F〉一样，隐藏所有工具栏和菜单，全屏展示内容，使用的快捷键是：〈Command〉。

图2-20

2.网格工具

在Photoshop中网格算是比较低端的工具，Photoshop不用采用网格插件基本就不可用，而Sketch中网格工具则可以很方便的进行编辑，有传统的方格，也有横向和纵向组成的长方形，使用起来真是便捷不少。

3.图层样式

与Photoshop一样，Sketch也有渐变、描边、内外阴影，不同之处在于Sketch制作图形增添图层样式时可以叠加最多四层完全不同的渐变，添加无限的描边和内外阴影。在制作比较复杂的图形的时候Sketch会更加便捷。文字的样式也可以单独的保存起来，方便对多个的文本进行调整。图层样式使用〈Alt+Command+c或v〉进行复制粘贴。

4.钢笔工具

Sketch的钢笔工具也比Photoshop好用，具体表现在可以针对像素或半个像素对齐，而在Photoshop中虽然也可以对一个像素对齐，但设置和切换很麻烦。结合〈Alt〉键可以画出完美的弧线，绘制钢笔路径时，Sketch会自带类似于Photoshop中的橡皮带，〈Alt〉能够引导即将绘制路径的方向和曲线，同时在检查器面板中可以通过快捷方式完成锚点编辑。

5.圆角矩形(www.xing528.com)

在Sketch中创建圆角矩形是很方便的，不但可以直接控制四个角圆角大小，也可以双击单个圆角进行调整，并且缩放拉伸圆角矩形时，圆角也不会变形，当然Photoshop CC也升级功能并解决了这个问题，但它的操作很繁琐。

6.方便的选择元素

读者可以通过左侧图层和分组栏，看到矢量图形的缩略图。有着命名规范的良好习惯的设计师，Sketch的搜索会让你在寻找界面元素的时候更加快速，并且随着上下点击就会对焦到你选中的元素。

7.测量工具

测量工具要比Photoshop更加便捷快速，不再需要使用蚂蚁线或者切片工具来测量元素与元素之间的距离。Sketch为了提高制图效率让设计更加精确，只需要在元素中按住〈Alt〉键，然后再用鼠标点选其他元素或者移动，就可以实时显示上下左右之间的距离。

8.轻松改变透明度

当需要调整一个元素的透明度的时候，不需要去慢慢调节进度条，只需要选中图层或组，使用数字按键来设定透明度，比如3就是30%透明度，这可以非常方便快捷的更改参数。

9.巧用比例缩放功能

当在画板中创建的UI元素大小不符合期望时，假如设置了一个边缘半径30px，边框6px的按钮，如果直接鼠标拖拽缩放，效果恐怕不理想。会造成边框不随着面的大小适时地变粗或者变细，如果你点击“比例缩放（Scale）”按钮来调整，就可以让边框随着面的大小适时地调整，比例协调地缩放。