侧边栏抽屉式导航(navigation drawers)分析
最近在设计一款安卓的app,忠于安卓5.1的设计规范以及对产品原型一些主要功能上的妥协,我选择了使用侧边栏抽屉式导航。
一、优缺点
优点:突出核心功能,将其他的功能隐藏掉。
缺点:
1.不易发现,导航性差
2.效率低效
3.与平台(iOS)原生导航模式冲突
4.并不是一目了然
Luis Abreu在他的一篇文章“为什么要避免使用汉堡包菜单”中一语中的的指出汉堡包菜单的问题,全文分析得很透彻,具体可以看(http://daichuanqing.com/index.php/archives/6241)
二、为什么抽屉式导航衰退
我自己讨厌抽屉式导航,认为大部分APP会使用抽屉式导航,是为了突出核心功能,将其他不重要的功能隐藏掉,以此来增加页面的简洁感与美观度。而抽屉式导航当中的内容对于用户来说点击率是非常低的。
而且随着手机屏幕越来越大的趋势,现在手机屏幕尺寸大多在4——6英寸中间,具体调查数据如下。
而下面这张图,非常直观明了的告诉了我们,为什么抽屉式导航衰退了。因为,一个需要被经常操作的入口,现在,处在了操作盲区,左上角的区域显然是不常用区域。
三、主流导航:底部导航栏
底部导航栏这是最常见和实用的,尽管会占据一些屏幕空间,但它的好处确实足够多:
·可见性强:全都在你的屏幕上
·结构清晰:最多只能五个标签
·交互方便:只需点一下,搞定
但这对icon的要求会很高,它必须要易于理解,最好底部用文字说明。
微博,微信,QQ,淘宝,intagram,美团,足记等app都是使用底部导航。
其他形式的导航还有:顶部导航,滑动导航,bag和下拉导航......
四、侧边栏抽屉式导航不好么
但是事实真的是侧边栏抽屉式导航不好么,为什么google推出material design5.0的设计规范里专门提出一栏来说drawer呢。(而且我最爱的知乎也是侧边栏抽屉式导航!!)
下面我们看下material design 的官方文档:http://www.google.com/design/spec/patterns/navigation-drawer.html
官方规范描述如下:
导航抽屉面板,从当前界面的左边划出,显示应用程序的主要导航选项。
用户可以把导航抽屉在屏幕上划动来从屏幕的左边缘或通过触摸操作栏上的应用程序图标。
随着导航抽屉的扩展,它覆盖的是内容而不是操作栏。抽屉完全扩展时,操作栏调整其内容通过替换当前的操作栏标题与上下文的应用程序名称和删除所有操作视图导航下面的抽屉里。溢出菜单设置的标准动作条目和帮助仍然可见。
也就是说,安卓官方设计规范中认为drawer应该是同时支持滑动与图标点击两种呼出触发动作,这也很适用于安卓手机大部分的大屏幕。同时这样的呼出手势,一定程度上也是很顺手的。
随着大屏手机的出现,实体键盘的减少,虚拟键盘会越来越常见。所以如果安卓采用和iOS一样的底部导航的话,会出现双重底部bar的样子,特别恶心。所以安卓5.0采取的解决方案是:导航放在屏幕上的 tab栏并且可以左右切换,加上可以拉出的侧边栏抽屉式导航。
这种呼出的交互方式是对 drawer在大屏手机中的不足的改善。同样Navigation drawer的存在于android应用中的既是必要的也是一种趋势。
随着安卓应用市场的设计规范化,侧边抽屉栏式会越来越常见,也会逐渐成为用户的一项用户习惯。但建议重要的内容还是独立出来置于主页面,侧边栏目前还只适合次级重要的功能。
最最最重要的事:使用哪种类型的导航一定要具体还是要结合自己的产品进行分析。