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

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

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

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

shenqiceliangjian01

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

shenqiceliangjian02

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

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

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

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

原创文章,作者:Tinadmin,如若转载,请注明出处:https://www.iamue.com/9004/

(0)
TinadminTinadmin
上一篇 2015-08-28
下一篇 2015-08-28

相关推荐

  • Ps CC使用技巧

    小编话:工欲善其事,必先利其器。作为一位UI设计师,Photoshop一定是你的必备软件吧!只会用还不行,高效的利用才是王道。今天给大家带来的是来自八只熊酷站分享的PS CC使用技巧,作者从软件、习惯、技巧等三个方面…

    2015-01-22
  • App Store2016年最新审核规则

    编号 中文内容 1.1 为App Store开发程序,开发者必须遵守 Program License Agreement (PLA)、人机交互指南(HIG)以及开发者和苹果签订的任何协议和合同。以下规则和示例旨在帮助开发者的程序能获得 2.1 崩溃的程序…

    UI设计 2016-01-21
  • 设计反复修改?可能是你的信息层级没有梳理好 |  网易UEDC

    摘要

    别人上班时,设计师在改稿...

    别人下班时,设计师还在改稿...

    别人约会时,设计师仍然在改稿...

    2017-07-24
  • Sketch 3.6的更新

    Sketch 3.6 带来了许多新的更新,终于盼来了文本渲染和SVG的改进,以及性能增强和bug修复。 固定基准 之前不一致的基线导致在设计的时候出现了很多问题,新的版本中当改变一个文本图层的字体和字体大小时,该图层出…

    2016-03-08
  • IOS 10人机界面设计指南[中文版]

    随着iPhone7的发布,iOS10普及起来已经不远,所以iOS10的人机交互规范大家也需要学习起来了,分享的是迄今为止翻译得最全面的,iOS10人机界面设计指南[中文版],希望能帮到大家,enjoy!

    2016-10-24
  • 动态响应-应用程序的身体语言设计

    引言:如果把APP比作一位美女,那么icon是她的证件照,界面是她的形体,而动效则是她的肢体语言。

    2014-12-30
  • Origami五分钟入门秘籍

    早在Facebook推出Facebook Home时,相信强大的原型工具Quartz Composer就进入了很多设计师的法眼,无须编写代码就可以输出细腻丰富的动画,这个太刁了,和大家一样,彼时我也信誓旦旦励志要学会这个玩意儿,于是开…

    图形用户界面 2015-08-27
  • Sketch从入门到精通-Sketch3蒙版的使用

    蒙版,顾名思义就是蒙上一层东西,只显示你想显示的部分,类似PS里面的遮罩。在Sketch里面,你可以有选择去显示想要显示的内容,比如你可以打开一张正方形的图片,然后想做一个圆形的头像,那么就需要在这个正方形…

    2015-07-20
  • 产品不能忽视

    在做交互稿或视觉稿的时候,为了让界面尽可能的真实,设计师们会虚拟一些内容放在页面上。但是当看到前端同学产出的demo时,设计师们又总是会觉得为啥和我当初做的页面那么不一样捏?设计师总喜欢把图做的很漂亮,在虚拟页面的内容时,使用漂亮的图片,把内容安排的恰到好处。但是当产出界面demo时,这个页面可能是个空内容的页面,也可能内容很多,导致布局错位。所以在设计界面时,一定不能忽视空状态、内容过多等极限状态。这些状态也许只会在初次使用时遇到,也许只会有很小一部分用户遇到,但是这些都影响着产品的细节品质。

    2014-12-28
  • UI设计之4个字体设计小技巧

    内容在设计中起着至关重要的作用。不管你是从事网站设计、移动应用程序设计、还是可穿戴ui设计,你的设计必须能够清楚地传递出设计的意图和目的。由于文本是基于沟通的目的,所以需要对字体设计有着深刻的理解。当然,…

    2015-05-14