18326051278
2017-12-09
毅耘科技
3382
一种抽屉式导航的准确使用方法【毅耘科技】
2012年，path首先使用了汉堡菜单作为产品的导航体例来替代原本的标签页的导航体例。一时引起了各大厂商的跟风，youtube、facebook等app都纷纷把自己的导航改成了抽屉式导航。但因为没有同一的规范，各个产品的抽屉导航设计也各不相同，为了控制Android平台日益紊乱的抽屉交互体例，2013 Google I/O大会之后，Google将NavigationDrawer纳入了AndroidDesign规范当中，随后大量应用开始采用这种交互模式【1】。
不过后面的事情大家都知道了，包括youtube和facebook在内的许多app都将抽屉式导航换回了原来的标签页导航。也是从那段时间开始，大家开始更加认真地思考抽屉式导航的优劣。随之而来的争辩也一向没有断过，并且慢慢的，对于抽屉式导航的指斥开始占有优势【2】。我摘取其中的两则指斥如下。
…上图的 APP 将选项卡（tab row）变成抽屉式导航菜单（drawer menu），用户在响应功能间的切换率急剧下降。…许多用户还没有建立起响应的心理模型（尤其是抽屉式或者汉堡包菜单）尽量将 APP 的核心功能放在用户可以看得到地方。
——能露出来， 就别藏着
触摸操作中，手势永远要比点击优先级低。现代触摸操作习惯毕竟只流行了几年，然而传统PC上的操作习惯已经执行了将近20年。所以通过滑动来切换Tab不会比点击切换来的直观。
——石头们
总结一下，对于抽屉式导航的指斥主要有如下几点：
1.可见性不好：a)首先抽屉式导航的入口是三条杠，对于部分用户来说，他们并不能准确知道这三条杠可以呼出抽屉式导航；b)抽屉式导航毕竟是隐藏起来的，没有现有标签式导航来的显明。
2.操作复杂。抽屉式导航的切换可以直接点击，假如Tab放在上方可以直接滑动切换。但是抽屉式导航的切换就要先呼出侧边栏，然后再点击，相对比而言，操作更加繁琐。
3.与现有的交互体例冲突。抽屉式导航可以从屏幕左边缘向右滑动唤出，与iOS的后退操作冲突。但是这原本就是Android的设计规范，并不一定适用于iOS，所以我觉得的这个指斥不成立。
但是，正如那句老话“垃圾是放错地方的资源”，我始终相信，没有不好的交互设计，只有不适合产品使用场景的交互设计。所以抽屉式导航也是有它的准确使用方法的。
首先关于这个入口的问题，我觉得可以通过指引来缓解这个问题，但是最终照旧需要通过长期的用户教育来实现的。正如现在的开关键（一个圆圈加一条杠），这个设计其实并不能一目了然地让人知道这是开关键，但是经过长期的使用，现在大部分人都会知道这是开关键。所以，这个问题就只能交给时间来解决了。
但是除此之外，上面的指斥1,2总结一下就是切换麻烦（指斥3不太站得住脚）。只是，假如产品的导航不需要频繁切换呢？假如有其他的切换入口呢？那么问题就迎刃而解了。那么有没有产品是这样的呢？答案是：当然有。下面我就结合一些例子来讲讲抽屉式导航的准确使用体例。
抽屉式导航的使用场景首先一点是：导航的模块是有主次之分的。相对比于常用的标签式导航而言，抽屉式导航的模块之间主次区分更加显明。首先，当启动应用时，标签式导航的每个模块入口都是可见的；其次，标签式导航的模块切换特别很是容易，通常是点击（底部Tab）或者滑动（顶部Tab）操作；第三，当进入某个模块时，其他模块的入口依旧清晰可见。基于以上三点，标签式导航模块之间的区分不是特殊大。（不同导航的区分详见APP常用导航总结）
但是对于抽屉式导航而言，以上三点都不成立。所以，相对而言，抽屉式导航的第一个模块的主要程度要远远大于其他的模块。也就是说，当不同导航模块之间存在显明的主次之分时，才可以考虑使用抽屉式导航。
举个例子，豆瓣一刻的导航模块如下：
如上图，因为豆瓣一刻的资讯都是严酷按照天天为单位的，一刻的目的也是希望你当天阅读完当天的内容。所以，一刻的核心使用场景是当日事当日毕，当天的内容（即“今日一刻”模块）的优先级远远大于其他模块。其他模块是为次要场景设计的，即使渗透率不高，对于产品的影响也不大。
对于次要的模块，我们并不需要严酷保证模块的渗透率。但是，假如我们可以提高次要模块的渗透率，又何乐而不为呢？既然抽屉式导航的可见性不高，操作繁琐，那为什么不可以另辟蹊径，设置一个可以见高，操作便捷的入口呢？答案当然是一定的。
对于豆瓣一刻来说，模块之间的优先级如下：今日一刻>往期内容>热门作者、栏目浏览、我的喜好。所以，往期内容模块的使用场景是仅次于今日一刻模块，但是又远远高于其他模块。所以，针对这个模块，可以设置更加便捷的快捷入口。豆瓣一刻的处理体例如下图：
在每日一刻内容列表的最下方设置了一个按钮，作为往期内容模块的快捷入口。这样的快捷入口，一方面不会干扰最主要的内容，因为它设置在页面最后面。另一方面，当用户阅读到最后的时候，假如用户还有强烈的阅读愿望，那么这个入口简直就是沙漠中的甘泉。
最最巧妙的一点，为什么这里不用上拉刷新而是使用按钮呢？因为上拉刷新的内容往往是衔接在当前页面下的，同时上拉刷新的操作成本很低。但是，往期内容模块与今日一刻的区分度又比较大，衔接在当前页面下并不合适，操作太便利的话又显示不出模块之间的区分度。所以，这里采用按钮而不是上拉刷新。
当然，为了解决可见性的问题，还需要在首次启动应用的时候进行指导。对于抽屉式导航的指导，有两种体例：1、启动应用主动打开导航；2、指引用户点击汉堡菜单按钮，然后再弹出导航。两种指导各有利弊，当然益处就是都可以起到指导作用。对于坏处，第一种方法的坏处是，即使使用动画指导，指导的效果照旧不如第二种，毕竟第二种用户是亲手打开导航的；第二种的坏处就是，它需要强迫用户先完成这个操作，然后才能进行其他操作。相对而言，这种胁迫会对用户的控制欲造成一些危险，用户体验会打一点折扣。
最后一个方法也是为了解决可见性不高的问题，就是行使让人又爱又恨的小红点，英文名称叫Badge Notification。小红点有两种形式：一种是带数字的，另一种是不带数字。带数字的一般是跟新闻有关系，比如还有两条新闻未处理，那么小红点就会显示一个“2”；不带数字的一般就是指导作用，告诉用户这里有东西需要你查看。
因为小红点对于用户来说确实体验不太好，许多人都会有强烈的强迫症要祛除这些小红点，所以，针对用户的这种心理，小红点反而成为了产品的一种特别很是高效、简洁的指导体例。不过，有句话要说的是：小红点虽好，可不要贪杯哟。适当适量的指导可以处于一种“既触发了用户的强迫症又避免让用户厌恶”的状况。假如一旦超过这个度，产品就有可能会被抛弃，所以郑重使用小红点。
再次重复一下那句话，垃圾是放错地方的资源。没有错误的控件，只有使用不当的控件。所以与其诘问诘责抽屉式导航的种种错误，不如找一个恰当的场景去承载它，让它发挥自己的闪光之处。以上就是我对于抽屉式导航使用的一些心得。
【1】交互设计新手必看！探秘抽屉导航的前生今世 http://www.eqolm.com/uisdc8533/past-of-navigation-drawer
【2】哪些因素阻碍国内 BAT 的移动应用采用 Material Design？ – Kenny MacCormick 的回答 – 知乎 https://www.eqolm.com/zhihu8533/question/37376355/answer/71940532?utm_campaign=webshare&utm_source=weibo&utm_medium=zhihu
文／妖叶秋（简书作者）本文标题：一种抽屉式导航的准确使用方法
本文网址：http://www.yiyuncloud.com/index/id/631.html
原创网址：合肥APP开发公司<毅耘科技> 版权所有，转载标明出去，并以链接形式链接网址：www.yiyuncloud.com
文章标签：合肥APP开发 合肥软件开发 合肥o2o社区 合肥商城开发 合肥B2B2C商城开发
毅耘科技（www.yiyuncloud.com）是一家拥有新型网站建设与程序开发经验的公司，致力于解决企业网络服务问题，紧跟着网络变化的步伐，为企业提供网络科技服务。平台服务：品牌网站建设 、网站开发、微信开发、APP开发、软件开发、网校系统开发、多用户商城开发、分销商城开发、微商城、一元云购系统开发、O2O系统开发、商标注册、网络营销等项目。是专业为企业提升价值的公司。
导航
返回列表
在线咨询