当前位置:首页 >教程首页 > U I 设计 > AI+UX设计大师班 >【Sketch实战技巧】让你效率倍增的冷知识!

【Sketch实战技巧】让你效率倍增的冷知识!

发布时间:2019-03-13 10:59:18

工作中发现,虽然仅使用Sketch基础功能也能很好的胜任设计工作,但是如果能掌握一些实用的小技巧则会让你的工作更加轻松。每一次看到我的学生们 一指禅 似的点击着软件界面中的各个功能,我的内心是崩溃的。今天就给大家带来一篇Sketch实战技巧!

收集了同学们在实践操作过程中最常用的一些快捷操作方法,希望能帮助同学们快速进入软件精通的状态,毕竟工欲善其事必先利其器,软件操作的都不6,设计视觉哪有什么精力再精进呢,我们快来看一看哪些鲜为人知的冷知识立刻让你效率倍增呢?

一、图层操作上的小技巧 

移动图层的操作是我们最常用的功能,每一次我们选择图层总是容易误操作到其他图层, 移动  起来尤其不便,但是以下几个功能相信一定能快速解决你的难题。

每次选择图层时,你可以习惯性的按住  command+鼠标左键  ,可以帮助你快速选择组内的图层。

1-1.gif

1-2.gif

如果按住  Option  键,接着按住鼠标左键不放然后框选,就会只选择完全位于框选区域内的图层,避免误选。

2.gif

如果遇到多个图层堆叠的时候,框选的效率就会非常的高了。

选中图层以后如何移动?

按照上面的方法选中图层后,同时按住  option+command  可以直接移动图层,但是优点是鼠标焦点可以不在被选图层上,如果不按这2个快捷键组合,在元素区域外是没法移动的,当在界面中有大量图层时,也可以避免误操作到其他图层。(笔者强烈推荐,这个组合键经常用到,对于解决选择移动问题非常有帮助)

3.gif

遇到多个图层堆叠时,我们可以通过右键点击最上面的图层选择想要的图层,再结合  option+command  组合快捷键进行移动操作就非常方便。

4.gif

对齐图层: Control-Command-V  垂直方向上的等分;Control-Command-H 水平方向上的等分,这个快捷键非常常用,比每次点击右上角的对齐工具要方便很多。

调整图层大小:如果某些图层带有图层样式,比如描边,投影,圆角这些,在直接缩放时各种样式的数据并不能同时缩放。如何解决呢?

其实sketch 是有2种缩放形式,一种是直接缩放,不改变元素样式只修改基本属性大小;另一种是变换缩放,可以同时缩放基本属性以及样式属性。操作方式是从菜单中选择「图层」>「变换」>「缩放… 」(或按Command-K)

5.gif

二、蒙版技巧

在sketch 中的蒙版功能很强大,不光对图层可以使用蒙版,对图层组也可以使用,但在蒙版组内,新建任何图层或者图层组都会被自动蒙版,有时候反而会成为麻烦。

有2种办法可以解除蒙版:

1)把图层或组拖出蒙版组之外,但是这样会破坏元素结构;

2)直接选择想要解除的图层,右键忽略底层蒙版即可,这样做的好处是,可以不会破坏对象组织结构。

6.gif


三、批量替换颜色

在进行多页面多画板修改颜色时,在不是symbol 的情况下,修改起来会很费时间。如何批量修改颜色,具体操作为:编辑——查找并替换颜色(option+command+F),需要注意颜色透明度,根据实际需要判断是否勾选。备注:sketch47版本还没有。

7.gif


四、快速切换视图

设计过程中,需要经常切换不同视图来查看设计内容,简直超高频的使用需求!作为一个操作666的设计师不会快速切换视图肯定是不够酷的,所以对于这些快捷键必须要在这里提一句:

Command +1 完整展示页面里的所有内容,适合全局展示,查看一致性。

8.webp.jpg

Command +2 将选中的元素放大到合适屏幕的尺寸,这个视图有一个妙用就是可以把复制的元素直接复制到当前元素的中间,这个特性非常实用,自己试过就知道了,肯定会有用到的地方。

9-1.webp.jpg

Command +3 将选中的元素显示在屏幕中央。

10.webp.jpg

Command + 0 以实际像素模式预览页面,即在100%大小下看设计效果。

11.webp.jpg

五、图层对齐

图层对齐也是经常要用到的操作。直接与对象对齐的话,Sketch 会将图层对齐到所有选定对象的最外层。但要将图层与特定对象对齐,怎么操作呢?

比如想让下图中两个元素以正方形为参照物进行居中,那应该先使用图层列表中的锁定按钮或使用Shift-Command-L  锁定该图层,然后再执行对齐操作即可。12.gif


六、设置sketch形状默认值

刚开始使用sketch 时,新建矩形,每次都会自带描边,然后再手动关闭描边,很麻烦。这个默认值能改吗?当然可以。

操作:首先建一个不带描边的矩形,然后选择图层-样式-设为默认样式,下次再新建形状时就会以你刚设置的样式作为默认值了。节省了多少次我们取消描边的操作啊。

13.webp.jpg


七、在属性栏中修改对象数值

这几个功能虽然不常见,但是对于资深设计师来说,确实能及其精准度的控制数据变化。不需要过多的调节,很适合对设计规范和视觉表现比较熟练的设计师掌握。

鼠标、Shift、Option实现快速修改

主界面中的右侧的属性栏中可以单击属性值以快速递增或递减该值(注意要把鼠标放在文字的上下方位内,出现左右箭头才可以快速修改)。如果按住Shift键,Sketch 将相应地将值递增或递减10倍,按住Option键会将其增加/减少十分之一。

14.gif

支持简单数学公式,支持样式单位L(中心点左对齐)R(中心点居右)C(中心点居中)M(中心点居中)T(中心点置顶)B(中心点底部对齐)

15.gif


简单数学公式计算

16.gif

圆角快捷设置,这个如果在用到蒙版时,修改起来才体会到更方便。

17.gif


八、文件整理小技巧

快速收起  所有图层便于选择画板导出。这时可以选择显示 – 图层列表 – 折叠所有分组,便于选择。

18.gif


快速吸取颜色: 在用sketch 的过程中,吸颜色是经常要干的事。直接按下conrtol+c (就能快速选取屏幕上的颜色了,极其好用。)

19.gif

快速切换层级小技巧 : 在很多图层未整理,处于比较混乱的情况下,按command+鼠标左键只能快速的选到某个具体图层,但是接着你又在想,如果我还能一键快速选到图层所在的组,那该多好。

方法是在选择具体图层后,按键盘上的esc 键,能快速选择图层所在的上一级,可能是组,也可以是更上一级的组,甚至能快速选到画板,是不是很方便?选择后如果要移动就按option+command,还能避免误操作。

20.gif

快速切换填充和描边状态

有时候,你可能想着要能快速选择描边查看效果,难道只有在右侧属性栏打勾选择吗(虽然这样也挺快),但是有更便捷的办法,直接按F/B 就可以快捷选择了,根本停不下来啊。

21.gif

本期sketch 操作技巧就先介绍到这里,各位亲爱的同学,文中的知识和技巧都会极大地提升我们的软件操作效率,请同学们务必动起手来勤加练习,熟练掌握这些操作,为自己的UI设计能力增砖添瓦,不日一定会成为一个Sketch软件高手咯。

作者:黄海洋 

来源: UI设计师之家

学员作品赏析
  • 2101期学员李思庭作品

    2101期学员李思庭作品

  • 2104期学员林雪茹作品

    2104期学员林雪茹作品

  • 2107期学员赵凌作品

    2107期学员赵凌作品

  • 2107期学员赵燃作品

    2107期学员赵燃作品

  • 2106期学员徐正浩作品

    2106期学员徐正浩作品

  • 2106期学员弓莉作品

    2106期学员弓莉作品

  • 2105期学员白羽新作品

    2105期学员白羽新作品

  • 2107期学员王佳蕊作品

    2107期学员王佳蕊作品

专业问题咨询

你担心的问题,火星帮你解答

微信扫码在线答疑

扫码领福利1V1在线答疑

点击咨询
添加老师微信,马上领取免费课程资源

1. 打开微信扫一扫,扫描左侧二维码

2. 添加老师微信,马上领取免费课程资源

×

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定