美文网首页Sketch UI设计
sketch新手入门(中文版)-11 原型

sketch新手入门(中文版)-11 原型

作者: 陆思思_6c27 | 来源:发表于2020-02-12 21:01 被阅读0次

使用sketch中的原型,您可以使用动画交互预览设计。要使用Sketch的原型功能,您需要在文档中使用艺术板。

我们还在原型制作教程中提供了原型制作的实践指南。您可以在Mac应用程序的“文档”窗口的“模板”选项卡下找到它。

一.添加链接

创建原型的最快方法是在两个艺术板之间添加链接。您可以将任何层的链接添加到任何艺术板。

若要添加链接,请选择层,在检查器中选择“原型制作”旁边的“+”(或按W),然后单击要将层链接到的艺术板。

添加链接

#如何编辑链接

在检查器中,您可以使用动画按钮选择链接的转换外观,并使用目标下拉菜单更改链接带到的艺术板。

编辑链接

在“目标”下拉菜单中选择“上一个艺术板”,告诉Sketch返回到当前艺术板之前预览的任何艺术板。当你有很多链接指向一个艺术板时,这很有用。

#如何删除链接

选择原型>移除选项的链接,将链接的目标设置为“None”,或者单击检查器Prototyping部分中的回收站图标以删除链接。

二.添加热区

热点提供比链接更多的控制,如果要创建比单个层更大的可单击区域,则热点非常有用。

若要添加热点,请选择“插入>热点”(或按H键),然后单击并拖动以绘制热点区域。之后,单击要链接热点的艺术板。

您可以在检查器中编辑热点的动画和目标艺术板,就像使用链接一样。

热区

#如何将链接转换为热点

选择任何链接,然后单击检查器中的“创建热点”图标,将其转换为热点。

#如何确定热点位置

选择您的热点,然后在检查器中选择滚动时的固定位置复选框,以固定其在画布上的位置,即使您的其他层滚动,比如底部按键。

#如何将热点与控件一起使用

如果将热点作为控件的一部分包含,则可以重用该控件,但可以单独覆盖其热点的目标。如果不希望热点链接到其他艺术板,也可以将其目标重写为“无”。

#如何隐藏链接和热点

选择“视图>显示原型”(或按Ctrl+F)隐藏表示原型链接和热点的不同路径。也可以在“首选项”的“画布”部分下更改它们的颜色。

#创建固定元素

要创建固定元素,请选择一个层或热点,并检查检查器原型部分中的滚动时的固定位置选项。或者,在菜单中滚动时选择Prototyping>Fix Layer Position。

例如,当你想在应用程序设计的底部固定一行标签页,或者在网站上有一个浮动按钮时,这是很方便的。

#如何创建滚动式艺术板

如果要创建带有滚动元素的原型,则需要选择艺术板预设,或创建自定义预设,并调整其高度。如果不使用预设,而是绘制自定义艺术板,则原型将不会滚动,并将在应用程序、草图云和草图镜像中显示为缩小。

左侧:使用iPhoneX预设的调整大小的艺术板将在预览中滚动。在右边:一个自定义的艺术板,它将缩小以适应预览窗口。

要从艺术板预设创建滚动原型,请选择预设并在画布上更改其高度。执行此操作时,检查器中的预设名称将更改为包含“已调整大小”一词。

若要创建可滚动的自定义尺寸艺术板预设,请选择检查器底部的“创建自定义尺寸”。确认您的艺术板的尺寸和名称,然后更改其在画布上的高度。与常规预设一样,它在检查器中的名称将更改为包含“已调整大小”一词。

三.设定起点

在预览原型时,起点允许您选择从哪个艺术板开始。要设置起点,请在预览窗口中打开原型,从下拉菜单中选择一个艺术板,然后单击它旁边的标志按钮。

起点

每当你预览你的原型时,你总是从你设置的艺术板开始。若要删除起点,请在预览窗口中选择艺术板,然后再次单击“标志”按钮。

#设置多个起点

您可以设置多个起点,以引导人们了解更复杂设计的不同方面(例如,注册流程和用户设置流程)。每次设置新的起点时,它都会在Sketch Cloud中的同一文档中显示为不同的原型。

#预览原型

有三种方法可以预览原型-在Sketch应用程序中,在使用Sketch Mirror的iOS设备上,或者在Sketch Cloud中,您可以与其他人共享原型。

#如何在Mac应用程序中预览原型

若要在草图应用程序中启动预览,请单击工具栏中的“预览”按钮。如果你已经设定了一个起点,你的原型将从那里开始。如果没有,它将从当前选定的艺术板开始。

预览圆形

1.单击预览窗口中的任何位置,可以查看显示链接和热点在当前艺术板上的位置的点击目标。

2.“后退”按钮将使您返回到原型中的上一个艺术板。

3.“艺术板”下拉菜单提供了在不同的艺术板之间快速跳转的方法。

4.标志图标将当前查看的艺术板设置为起点。

四.如何在草图云中预览原型

在SketchCloud中打开文档时,您将在文档概述顶部的一个部分中看到它包含的任何原型。单击原型的缩略图以在浏览器中打开并预览它。

与Mac应用程序中的预览窗口一样,单击屏幕上的任何位置都会突出显示任何热点或链接。若要返回到上一个艺术板,请单击浏览器中的“上一步”按钮。

如果您对文档启用了注释,则任何查看原型的人都可以选择窗口底部的“查看艺术板”以离开原型并输入该艺术板的静态视图。从那里,他们可以在侧边栏中留下评论。要关闭原型并返回到文档概述,请选择“关闭”。

#如何在草图镜像中预览原型

在iOS设备上启动Sketch Mirror应用程序并通过USB或Wi-Fi连接,然后单击Sketch应用程序窗口上角的通知进行连接。

在“草图镜像”中,点击艺术板开始预览原型。从那里,你可以点击链接和热点来浏览你的原型,或者向下轻扫一个艺术板来关闭它。

相关文章

网友评论

    本文标题:sketch新手入门(中文版)-11 原型

    本文链接:https://www.haomeiwen.com/subject/vsocfhtx.html