邮箱订阅

订阅即可免费获取优质的设计资讯!

邮箱订阅

感谢你的支持!

分享到微信朋友圈:

Close

打开微信,点击底部的“发现”,使用 “扫一扫” 即可将网页分享到我的朋友圈。

Mockplus是什么?

更快更简单的原型设计工具,微软、联合国国贸中心、华为、东软、育碧、中石油、Oracle、西门子、IBM都在用,你呢?

开始使用

2019,都在用 iDoc了!

最强的协作设计工具,产品团队必备。智能标注、一键切图、多样批注、交互原型、全貌画板、团队管理。

免费使用

【友情推荐】人人秀,H5活动制作工具,3分钟完成制作。

了解更多

工具类App原型制作分享-Bear

Anny 2017-10-27 16:55:26 阅读:58923

Bear是一款记事工具,App画风简约可爱,这只萌熊也是这款App的最大亮点,为了真实还原这款工具,我也是将熊的图片放进了原型中,其次就是一些常见的交互动效,这次给大家讲解一下Mockplus中如何实现侧滑菜单效果。


先简单看看动图:


Mockplus原型分享-Bear


点击这里,可以立即在线预览:http://run.mockplus.cn/niWz9rg0LCnuyKZk/index.html


三个步骤轻松搞定侧滑菜单:


1. 找到交互分类里面的抽屉组件,拖入工作区任意位置。


2017-07-28_113616


2. 拖拽App左上角图标的链接点,链接抽屉组件。


2017-07-28_143108


3. 双击抽屉组件,再次双击里面的面板,就可以拖入任意组件,摆放任意图标或者文字。


2017-07-28_142620


这样,一个侧滑菜单就完成了,是不是超级简单!演示时即可看到效果。


再送上UI Flow大图:


Mockplus原型例子-Bear流程图


这个原型的主要页面有:主页、欢迎页面、添加事件页面、设置页面、升级页面等。


以上设计的所有页面可以在这里下载分享


所有页面的图片集(10张), 在这里下载


Enjoy it!

原型工具难上手、速度慢?试试Mockplus!

_____

Mockplus,更快更简单的原型设计工具。快速创建原型,一键拖拽创建交互,团队协作省事省力。微软、华为、东软、育碧、Oracle、西门子、IBM等全球知名企业和全球300多所高校都在用,你也可以免费开始你的设计!

免费下载
logo

咨询客服

帮助群:874495829 加入QQ群

服务邮箱:service@jongde.com

咨询客服

在线客服

置顶