Demoo-移动端原型方案演示工具

Demoo-移动端原型方案演示工具

Demoo是一款在浏览器快速创建移动端原型方案设计演示的工具,热区和手势双设置,把设计思维更保真的通过电脑投影演示呈现,同时可以在手机上实时体验!

操作示意图

 

主要功能

快速引入原型画面并连结相关页面,加入过渡动作,在线预览及修改。

方便快捷的操作,只需简单的几步就能把一个项目的所有原型页面串联起来。

授权他人编辑,可让多人同时编辑一个项目,充分发挥团队的战斗力。

无缝的分享到各种平台,在不同的平台上进行测试,让你的原型有最真实的体验。

创建项目

登录后点击“新建App原型”按钮就可以创建一个项目,如图:

Demoo-移动端原型方案演示工具

填写项目信息页面

Demoo-移动端原型方案演示工具

功能菜单介绍

默认菜单

Demoo-移动端原型方案演示工具

Demoo-移动端原型方案演示工具

链接编辑菜单

Demoo-移动端原型方案演示工具

上传图片

刚创建好的项目,可以从文件夹中拖入图片到页面的空白处生成项目页面,一张图片为一个页面,也可以通过页面中的上传图片按钮上传图片。

Demoo-移动端原型方案演示工具

创建链接热区

链接热区可以实现页面间的跳转,在图片上任意位置按住鼠标左键不放就可以绘制一个链接热区,绘制好热区后放开鼠标左键,会显示连接目标的曲线,曲线的终点为链接热区的目标点,单击目标点即能成功的给链接热区绑定一个目标,单击右键可以取消选中目标,如图:

Demoo-移动端原型方案演示工具

也可以通过下拉选择的方式给链接绑定一个目标页面,如图:

Demoo-移动端原型方案演示工具

给链接绑定目标

单击链接热区,如果该链接已经绑定了目标,那么会显示一条连接到目标的曲线。

Demoo-移动端原型方案演示工具

双击链接热区,可以给该链接重新绑定一个目标。

Demoo-移动端原型方案演示工具

设置链接跳转动画

选中某个链接后,可以给该链接设置一个跳转动画,实现页面间的跳转已动画的方式进行,如图:

Demoo-移动端原型方案演示工具

删除链接热区

选中某个链接后,可以点击删除链接按钮删除链接,也可以按Delete键删除该链接,如图:

Demoo-移动端原型方案演示工具

缩放页面

拖动页面上的滑动条,可以对页面进行缩放,方便精确的操作页面上的元素,如图:

Demoo-移动端原型方案演示工具

设置页面手势

选中某个页面后可以给该页面设置一个手势,这样页面就可以通过手势来实现跳转,单击手势图标显示手势对应的目标,双击手势图标可以重新绑定目标,每个页面最多可以绑定四个手势,如图:

Demoo-移动端原型方案演示工具

固定页面的头部和底部

拖动页面底部和顶部的裁剪条,可以实现裁剪范围内页面固定在顶部或者底部,也可以选中页面后在输入框中精确的设置页面的裁剪值,如图:

Demoo-移动端原型方案演示工具

替换图片

将新的图片拖到页面中对应的图片区域或者选中某个页面后点击替换图片按钮即可实现图片的替换,如图:

Demoo-移动端原型方案演示工具

设置项目属性

点击配置图标就可以重新对项目的属性进行配置,如图:

Demoo-移动端原型方案演示工具

页面排序

按住标题后面的空白处不放,可以改变页面的排序,默认第一张图片会首屏展示,如图:

Demoo-移动端原型方案演示工具

本文为@运营喵原创,运营喵专栏作者。

(1)
运营喵的头像运营喵官方
上一篇 2018-08-21 20:45
下一篇 2018-08-21 20:53

发表回复

登录后才能评论
公众号
公众号
返回顶部
运营喵VIP会员,畅学全部课程,点击查看 >