Sketch UI设计sketch3官网 中文翻译(持续更新中)

sketch 新手入门(中文版)-1界面

2020-01-31  本文已影响0人  陆思思_6c27

The Interface 界面

初始界面

1.画布 

画布是我们的设计产生的地方,是无限的。所以我们不必担心我们的设计在何处开始,因为画布不会没有空间。(类似无限平面)不过如果你一定更喜欢在一个固定的空间中开始设计的话,你可以在你的画布上创建一个艺术画板。(画板在工具栏中可创建,快捷键A)

2.工具栏 

工具栏提供我们快速渐变的接口帮助我们去取得重要的工具和做一些你常做的事情。通常情况下软件帮你在工具条中安排了一些默认值,但是你也可以根据你的使用习惯改变这些操作。 你可以通过自定义工具栏这个选项(视图->自定义工具栏)来添加其他常用的工具。

3.检视栏

在右边这块区域,你可以发现你可以在这边改变任何你选中的层上的内容设置,或者是你正在使用的工具。

4.图层

在层目录中,你可以看到和选择文档中的所有页面,也可以看到页面上的艺术画板和不同的层。

5.组件

组件面板,在此你可以找到文档中的所有你的控件,文字样式,层样式,你也可以使用任何你允许的公共库。你可以轻易的拖动组件进入画布中。tips:如果你想要显示你的全部设计,可以将sketch的ui全部隐藏(视图->隐藏操作界面)

一.画布

#如何放大和移动这个画布

你可以通过摁住空格键+鼠标点击不放松拖拽的方式移动画布,或者如果你没有选中任何涂层的话,使用方向键。

如果要放大或者做小的话,你可以按住⌘ 键+鼠标滚轮(两只手上下移动 mac),或者直接使用触摸板的放大缩小功能(即两只手指的距离变大或者减少)或者直接使用快捷键Z。这里也有一些快捷方式:比如⌘+是放大,⌘-是缩小。

#如何使得画布转变为像素展示

sketch的默认画布展示是矢量模式,即他的分辨率是独立的,可以无限放大。(如不理解可搜矢量图的特点)

如果你从事的设计去看到每个像素是十分重要的,那么你可以在视口->画布 ->缩放时显示像素,或者直接使用快捷键⌘p来显示像素,当你缩放超过100%时,就会有独立的像素点显示。

#如何显示像素网格

选择视口->画布 ->缩放时显示像素网格或者直接使用快捷键⌘X来显示,一旦你显示超过600%的放大比例,那么就可以在页面上显示尚未对其像素网格的内容,从而调试对齐。

#如何使用标尺和创建引导线

sketch一开始的展示是将标尺默认隐藏的,如果要打开的话可以在视口->画布 ->显示标尺或者使用快捷键⌘R

你可以通过拖拉和点击你的标尺来设置基准点。如果要锁定他们就在角落上点击锁住,重置这些标准点是可以通过视口->画布 ->还原标尺

你也可以简单的通过拉取标尺来设定引导线,当你不需要他们的时候可以在标尺上右击删除全部竖向/横向参考线,或者摁住不需要的参考线离开画布并松开。

#如何创建网格

Sketch提供两种格式的网格,一种是普通的网格,一种是布局,如果需要的话两者可同时呈现。 

如果要设置普通网格的话,选择视口->画布 ->显示网格或者通过快捷键⌘G,如果要改变网格的格子大小,或者是线的粗细和颜色的话,选择视口->画布 ->网格设置

如果要设置布局的话,选择视口->画布 ->布局设置,使用选项可以显示横纵的布局,包括颜色,宽度。

*需要注意的是,你只能在艺术板上应用网格,或者如果没有任何艺术版的话可以在画布上显示。你可以同时为不同的艺术班设计不同的网格布局。

当你有一个网格布局时,组件会自动吸附到你所创立的网格系统上。

#测量

在一个画布的不同层之间进行测量,你需要选中第一层,然后按住option键选中你要测量的其他层。如果是在同一个组之间测量,那么需要按住

#吸附功能和智能辅助是如何工作的

当你移动或者插住图层或者标记时,sketch会自动展示与附近层之间的距离,而智能辅助就会帮助你吸附到距离最近的层上的物体中心或者是边缘。(此部分功能基本上同ppt的吸附)可对齐边缘/中心,模仿临近元素的宽度和高度。

二.工具栏

你可以改变工具栏上的功能呈现,下面是默认的工具栏状态。

工具栏默认状态

置入: 可以添加不同的层级元素到画布上,包括矩形,圆形,图片,文字等

素材: 可以插入文字,图像或者是自定义的素材

创建控件 将一个你选择的组件或者元素转变为一个可以重复使用的控件,你可以为它新建一个名字以及一些其他选项

前置一层/后置一层/编组/解组 帮助你组合你的元素以及移动他们的层级关系 

编辑/旋转/蒙版/缩放/展平 为编辑元素提供简单的入口

联结/减去/交集/差集 主要是布尔运算(boolean)的操作

放大/显示 改变了你的设计是如何在画布中展示的,以及你的重点在哪儿

预览 展示了你的设计在原型机上是如何演示的

云端 允许你分享你的文档在sketch云端

输出 提供了一种快速导出文档的方法

*你也可以将工具栏隐藏(视图->隐藏工具栏)

三.检视栏

可以找到所选图层的设置或正在使用的工具。检视栏根据选择的或正在执行的操作隐藏或显示这些设置。

检视栏

对齐选项 这些按钮会在你选择2项以上时亮起。

图层特性 这些选项可以更改图层的位置、大小和旋转,以及翻转(左右/上下)图层。

圆角设置 将鼠标悬停在它们上方将显示上下箭头以更改值。还可以单击标签上的圆角/平滑圆角修改弧度。

调整约束大小 如果在组或艺术板中选择了一个层,将看到这些控件

样式 使用样式工具可以控制图层的外观。若要添加新样式,请单击要使用的样式的标题旁边的“添加”按钮。添加样式后,可以通过取消选中样式旁边的复选框来隐藏样式。若要完全删除样式,请取消选中其复选框,然后单击显示的垃圾箱图标

输出 

四.图层

#如何隐藏和锁定层

要隐藏一个层,只要将其标题旁边的小眼睛,如果在你点击前已经有了一个眼睛的标记,那么说明他已经被隐藏了。

要锁定一个层,按住option键在点击锁定,锁定后你将无法编辑和移动,如果要解锁,直接点击锁定的按钮。

#如何使用页面

你可以在草图文档中使用任意多的页面。它们可以方便地组织您的工作,以及提高文档的效率。

若要在草图中创建新页面,请单击“层”列表顶部的加号箭头,然后为新页面命名。

如果你要切换他们,有两种方式,一种是按住fn+上下方向键,还有一种方式是点击下箭头将他们折叠为一个列表,并使用下拉菜单在它们之间导航。

您可以拖动页面以更改其顺序,或者控制单击页面以复制或删除它。

创建页面后,可以在“页面”面板中将“层”列表中的艺术板或层从一个页面拖动到另一个页面。

#如何使用艺术板

艺术板是完全可选择的,不是每个人都需要。但它方便创建画布上的固定框架,以创建您的工作。如果你是为一个特定的设备或屏幕尺寸而设计,它们是有用的。

若要创建艺术板,请从工具栏或菜单栏中选择“插入->艺术板”,或按快捷键A。也可以在画布上单击并拖动以创建自定义大小的艺术板,或者在检视器中选择已有的模版。

你也可以自定义一个艺术板,为他命名且保存。在你创建了一个艺术板后,按住⌘D可以复制它。

#如何移动艺术板

如果要移动他,可以长按并拖动他的头部标题,可以直接拖动或者使用方向键。也可以通过右侧的检视器设置position

#如何为艺术板重新设计尺寸

如果要重新为艺术板设计尺寸,选择他然后点击它周边的上下左右的方向箭直接拖拽就可以改变大小,需要精确调整的话,可以使用右侧的检视器。

你也可以点击检视器中的自适应,为根据艺术班的大小自动调整其中的内容大小。

#如何删除艺术板

如果要删除艺术板的话,之间点击delete就可以,但是如果你需要保留艺术板内的内容而只是删除艺术板的话,将艺术板解组即可。

#过滤层

当你的层特别多的时候,可以通过左侧底部的筛选,快速找到你需要的文件。

五.组件

“组件”面板是搜索、查找和管理文档和任何启用的库中的所有符号、图层样式和文字样式的快捷方法

#如何访问组件面板

要访问“组件”面板,单击“层”列表顶部的组件(也可以分别使用Ctrl+1和Ctrl+2在“组件”面板和“层”列表之间切换)。可以选择查看“所有”组件,也可以只查看属于文档或特定库的组件。

此列表下面的三个图标允许您查看符号、文字样式和图层样式。

组件

#如何过滤组件面板

你可以使用面板底部的搜索栏筛选所选内容。单击任何组件都会在面板底部显示一个大的预览,因此很容易区分具有微小差异的符号或样式。

找到要使用的符号或样式后,可以将该组件直接拖放到画布上开始使用它。

#组织组件

“组件”面板使您可以轻松地组织库。双击任何组件来重命名它,如果你想将它们组织到文件夹中,只需将一个拖到另一个上面。

<<--以上

上一篇下一篇

猜你喜欢

热点阅读