一、聚焦于设计本身
Sketch是一款轻量级的设计工具,不仅能用于视觉设计,还被广泛用于交互设计。Glen本身作为产品经理,平时输出需求的时候,急需快捷的交互设计工具。之前也跟很多人一样,使用Axure。Axure虽然功能强大,但是使用起来非常的不方便,效率偏低。自从使用了Sketch后,大大提升了交互设计的效率。总之,Sketch能够让你聚焦于设计本身,而不是花费大量精力去学习一个异常复杂的工具。
二、Sketch界面介绍
目前Sketch只提供mac(苹果电脑)版本,是一款高效、轻量的矢量设计工具,也提供基本的位图样式支持(例如模糊和颜色调节)。Sketch非常适合制作产品原型,比用Axure高效10倍,而且学习成本很低,基本一两天就能上手。
界面介绍:Sketch界面主要分为工具栏(Toolbar)、页面(Page)、图层(Layer)、画布、检查器等几个部分。
- 页面用于新建不同的设计面板。
- 每个页面由1个或多个图层组成,相信有了解PS的同学会很好理解。
- 工具栏提供了基础的工具箱:编辑、旋转、布尔运算等。
- 画布就是主要的作图区域了。
- 检查器用于调整画布中元素的一些属性或者微调元素的位置/大小/颜色等。
三、Sketch元素基础教程
(1)新建画板:打开Sketch后,按字母「A」,鼠标就会变成「+」号,此时可以直接用界面右侧提供的常用设备尺寸画板,如iPhone 8、iPhone XS、Apple TV等;也可以选择“自定义”画板的尺寸,非常的快捷高效。
(2)快速调整元素之间的间距:Sketch快速检查两个元素之间的间距的方法也十分的快捷,选中一个元素,按住option不放,鼠标放到另一个元素上,就可以看到两者之间的间距了。
(2)新建一个元素:Sketch中插入一个元素也非常的快捷,在工具栏中点击“+”号,选择“Shape”,即可按需选择新建一个元素,然后鼠标会变为加号,可以在画布里直接添加元素。也可以使用快捷键快速添加元素:
- 按“O”,快捷画圆形。
- 按“R”,快捷画方形。
- 按“L”,快捷画直线。
(4)快速修改元素尺寸:选中一个元素,在面板右侧的检查器里能快速调整元素的尺寸(Width宽度和Height高度)和位置(X横轴和Y纵轴),并且可以按住Shift键再按键盘的上键或下键,Sketch 将相应地将值递增或递减10倍,按住 Option键会将其增加/减少十分之一。
(5)简单数学公式调整元素尺寸:Sketch还支持简单数学公式调整元素的尺寸。
(6)不透明度调整:要改变一个元素的不透明度的时候,有两个方法。一个是选中元素后,在右侧的检查器里调整“不透明度”的数值;另一个方法更快捷,选中元素后,可以直接键盘输入数字来调整,比如输入50即把不透明度改到50%。
(7)元素组合:Sketch中可以快捷对多个图形进行编组,选中多个图形,按Command+G即可进行多图形组合 ,按Command+shift +G即可进行多图形解组。
好的,今天主要介绍Sketch界面基础和元素的操作,一起学习努力努力再努力吧!