暗色模式
预览原型
为设计稿添加好交互和流程后,通过预览模式来演示和体验可交互原型的效果。
预览设置
在不选中任何图层的情况下,右侧属性面板显示原型全局设置:
- 预览模式背景色:设置预览界面背景的颜色和透明度
- 设备模型:选择合适的设备边框模型(如 iPhone、Android),预览时设计稿周围会显示设备边框,演示效果更逼真
流程列表
预览设置下方集中展示文件中已添加的所有流程。可以在这里直接点击播放按钮进入特定流程的预览。
进入预览模式
三种方式进入预览:
| 方式 | 操作 |
|---|---|
| 预览按钮 | 点击编辑器右上角的预览按钮(播放图标) |
| 画布播放按钮 | 点击画布中流程起始容器上的播放按钮 |
| 流程列表播放 | 在右侧属性面板的流程列表中,点击对应流程的播放按钮 |
注意
进入预览模式后,只能看到一级容器中的内容,不支持深入到嵌套容器。
预览模式操作
进入预览模式后,可以使用的功能:
视图控制
- 点击右上角缩放比例调整视图大小,默认「实际尺寸(100%)」
- 进入全屏模式(仅浏览器环境有效),按 ESC 退出
交互辅助
- 点击时显示热区提示:预览时点击非交互区域,会高亮显示可交互区域
- 显示/隐藏操作界面:隐藏左侧和顶部导航,进入沉浸模式。按 ESC 或 Cmd/Ctrl + \ 退出
导航栏
- 点击 MasterGo Logo 回到工作台
- 使用下拉菜单切换页面
- 点击收起按钮单独隐藏左侧面板
画板列表
点击左侧面板切换页面,或使用左右方向键切换,按 R 从头开始播放。支持搜索画板。
流程列表
切换到流程列表查看所有流程及其描述,点击流程即可播放。
分享原型
在预览模式中分享原型:
- 点击预览页面右上角「分享」按钮,打开分享面板
- 开启「链接分享」,设置链接有效期
- 点击「复制链接」,将链接发送给相关人员即可
常见问题
| 问题 | 解决方法 |
|---|---|
| 原型分享链接打不开 | 检查链接分享是否已开启;确认链接未过期 |
| 预览时看不到所有内容 | 预览模式仅显示一级容器内容,超出部分不入预览 |
| 交互热区不显示 | 确认已开启「显示热区提示」开关 |