Motiff 妙多支持使用原型功能创建交互流程,从而模拟用户与产品的真实交互过程。
在以下场景中,原型功能发挥了重要的作用:
Tip:你可以使用快捷键 ⇧ Shift + E 快速切换「设计面板」和「原型面板」。
原型既可以模拟用户在 app 或网页中的整个交互流程 ,也可以模拟特定部分的交互体验。
一个流程由流程起点、交互连线和流程终点构成。你可以在同一个页面创建多个流程。例如,一个音乐 app 原型中可能包括了注册登录、播放音乐、搜索歌曲等不同的流程。
当你在两个容器之间添加交互连线时,Motiff 妙多会创建一个流程起点。
你还可以通过以下两种的方式添加流程起点:
一个容器可以被添加到多个流程中,但是每个最外层容器只有一个流程起点。 最外层容器的子容器可以和其他多个流程相连接。例如,同一个最外层容器内的「登录」和「注册」按钮可以连接到不同最外层容器以各自模拟对应流程。
当首次在两个容器之间添加交互连线时,Motiff 妙多将默认为第一个容器添加流程起点。
交互连线是交互流程的载体,是起点与终点之间的蓝色连接线。
你可以通过以下方式在图层之间创建交互连线:
在右边栏切换至原型面板。
选中一个图层作为交互热区。
你可以通过下列方式创建交互:
a. 光标悬浮在图层上,点击并拖动 连接到目标图层。
b. 在原型面板的交互模块,点击 添加交互。
在原型设计中,你可以为多个图层添加指向同一个目标容器的交互连线。你只需要在画布上多选图层后,点击并拖动 将连线连接到目标图层。
当你创建了一个交互后,可以在交互设置面板中设置下列交互属性。
当完成原型设计后,你可以通过以下步骤查看当前页面的所有流程。
当需要验证你的设计时,你可以分享整个原型或者复制指定流程的链接。
你可以通过以下步骤在文件中复制流程链接:
你可以通过以下步骤在演示视图下复制流程链接:
你可以在右边栏的原型面板中设置原型设备和背景,查看和管理当前页面上的原型流程。
原型模拟了用户与设计交互的过程。你可以通过「演示模式」在进行开发前对设计进行查看和测试,查看其交互的实际效果。