加入收藏 | 设为首页 | 会员中心 | 我要投稿 厦门网 (https://www.xiamenwang.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 建站 > 正文

详解APP端哔哩哔哩所有的导航类型,及高保真原型实现

发布时间:2017-11-03 01:03:12 所属栏目:建站 来源:人人都是产品经理
导读:副标题#e# 注:由于哔哩哔哩的用户性格从整体上说更偏向于活泼,所以B站在具体的细节上的设计也考虑到了用户的调性,并不是一沉不变的。单从导航这一种设计上看,就出现了多达 8 种设计方式。几乎覆盖了所有现网上出现过的导航类型,让用户可以更好的玩儿自

首先我们添加一个矩形框,里面放置一些功能点的入口,命名为“矩形框”,并且设置这个矩形框为隐藏状态。然后设置“+”的交互案例,单击时可以切换显示/隐藏“矩形框”。同时我们要考虑到,在显示矩形框的情况下,点击其他位置,矩形框依然会消失。这里要首先添加一个条件,在矩形框的状态为显示的情况下,点击其他区域,矩形框消失,所有的交互如下图所示。

详解APP端哔哩哔哩所有的导航类型,及高保真原型实现

七、轮播导航

轮播导航具体的设计原理及效果实现,我在《Axure高保真原型,实现APP端轮播样式》写的已经很详细了,大家可以参考,这里就不再赘述了。

八、Tab导航

Tab导航和顶部导航极其相似,都是出现在APP的顶端,通过不同的分类对APP自有的内容进行分类呈现。但是现在的tab导航中,多了许多的花样,由于APP的内容不断地增多,一级分类已经不够让用户足够清晰地看到自己想看到的内容,很多内容型的APP的内容信息,需要二级分类才能更好的展示出自有的内容信息。这就需要tab导航衍生更多的功能,在顶级tab分类下,每个tab点击进去后,会展示二级分类方式,选好二级分类tab之后,才能更好的展示出相应的内容,就如目前大型内容型APP,携程,大众点评等呈现的那样。

详解APP端哔哩哔哩所有的导航类型,及高保真原型实现

九、资源共享

整个APP端哔哩哔哩所有导航的Axure原型,我共享在了百度云网盘上,大家可以用来学习参考。

链接: https://pan.baidu.com/s/1jHOAYGY

密码: 9qyn

文章很长,花了很长时间做出原型,又花了很长时间写出文章,只希望大家能互相学习共同进步,如果你读到这里依然没有点击退出,感谢你的耐心~

作者:Mitsuizq,微信公众号:Mitsuizq

(编辑:厦门网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读