编辑导语:一次优秀的用户体验必不可少的就是一个优秀的导航设计,你们肯定遇到过在交互界面点着点着就不知道自己点到哪里了,很影响体验,所以今天作者和大家分享了关于导航设计的汇总和他们的优缺点。
一、导航的定义导航的定义其实就是元素之间的相互组合,可以让用户自由的在里面进行自由穿行。
二、导航设计的目的导航设计的目的就是需要突出产品的核心,扁平化用户的任务路径。让用户能够顺利的在产品中畅行,让用户时刻清楚自己在应用中所处的位置,及如何前往目的页面。
产品的导航系统,是产品的信息结构在用户界面上的展现方式。移动端产品导航的设计没有最好之说,只有最合适,根据你的产品采取最合适的导航设计。
三、导航设计的作用导航的设计其实就是让用户知道自己在哪里,身处在哪一个交互界面,可以再次去到哪一个页面,返回哪一个页面。
当然还要提供跳转的方法让用户感受到元素与页面的关系,表达用户与浏览界面的关系。
四、9种常用的导航设计1. 底部标签(Tab)导航当产品的整个体验流中是以几个常用功能模块(一般不超过5个)贯穿的,意味着用户需要在多个标签入口之间来回切换;
为了保证切换的效率,将贯穿产品整个体验的流的模块平铺在Tab Bar位置,保证了用户任务路径的扁平,比如QQ和微信。
优点:属于拇指热区范围内,操作方便,切换快速,用户体验良好。
缺点:只能容纳3-5个,数量有限。
2. 顶部标签(Tab)导航顶部Tab是谷歌提出来的,为了区分与iOS的区别的一种导航模式,由于在顶部,手指难以触及,所以谷歌对应地提出了手势操作的解决方法:通过在屏幕左右滑动来切换标签,比如:樊登读书和爱奇艺。
实际项目中,顶部与底部配合使用的挺多。
优点:顶部可滑动,所以可拓展性强,占据的空间比底部少,是通过滑屏切换方便快捷。
缺点:正式因为可拓展性强,所以导致用户需要花费很多时间来切换到自己想要到的页面,最后面的页面就非常容易被用户遗忘。
3. 舵式导航点聚式它将多个核心功能聚汇到主界面中显示,方便用户呼出使用。会搭载其他导航样式出现(如标签式)成为舵式导航,比如微博。
与标签导航类似,就点聚工导航与标签导航的结合体,其中一个导航标签蕴含