Sketch 图形用户界面

Sketch从入门到精通-Sketch3 神奇的测量键

0
登录或者登记去做吧。

在做设计的时候经常离不开精准的测量,间距,字体的大小。尤其是在做移动端UI设计的时候,设计完的界面效果图还要输出标注规范给工程师们让他们去实现,这就离不开精准的测量。

在Sketch里面,有个神奇的测量键,你只需要按住Alt键,任意的移动鼠标就可以知道每个元素之间的间距大小,以及和画板之间的大小,上下距离等。

比如你想知道你的标题文字和左边的间距是多少,你只需要把鼠标点到标题文字上,然后按住Alt键,Sketch里就会自动显示出文字和左边距的数值大小,与顶部的数值大小和右边的数值大小。特别直观方便。依次复制N个同样的图形,也可以自动测量之间的间距距离。如下图:

shenqiceliangjian01

同样的,如果你在调节一个图层的大小,Sketch也会帮你显示出具有相同长度或宽度的图形的数据。

shenqiceliangjian02

­而且是自动显示的,但你一定要保证单个元素的边缘要整齐,有些文字的边缘框就不是百分百对齐,就需要把文字转曲,边缘框贴近文字,然后测量的间距才是最准确的。

但文字进行转曲后就无法进行更改,不易编辑,所以建议可以不对文字转曲,先画一个框,然后在把文字放到框里面,这样测量文字间距的时候,就以文字边缘画好的框之间来测量,就能更准确一些。

给工程师们标注图的时候,一定要切记半点像素都不能差,主要标好,元素间的间距,比如某一中心按钮距离左右的间距是固定不变的,那么就标好左右的间距是多少,选择一个固定不变的距离,去测量可变的距离,标好尺寸。

Sketch里面的插也很好用,并且很强大,我会下一章给大家讲解插件的神奇运用,会令你的工作效率提高很多倍很多倍。

Sketch从入门到精通-Sketch3 插件的运用
Hybrid APP 会吃掉微信等应用?