导航是产品设计的重头戏，Web端设计的时候是在考虑如何将操作展示给用户，而Mobile的设计更多的时候则是考虑如何将操作巧妙的隐藏起来。但这种隐藏实际上是为了核心功能的突出。　　iOS导航模式基本都是基于iOS系统自身的一些模式，随着iOS新产品的不断出现，新的导航方式也随之更新。在这里，说一下“抽屉式”的导航方式。　　当然，抽屉式导航是作者自己给这种导航方式取的名字，至于学名叫什么，小编也不知道。这种导航模式一般采用将导航主体隐藏在app侧边的方式，以一个按钮来呼出导航，在使用完成之后在使用相同的按钮隐藏起来。一拉一缩，从形象上与抽屉类似，于是就这样称呼他。　　根据不完全的考证，这种导航方式始于Facebook。在最早的Facebook App中，一直采用了比较保守的九宫格导航方式，随着FB的发展，这种很重的导航方式会导致用户Timeline的展示被很大程度上弱化，虽然FB也曾尝试在用户进入App的时候直接进入Timeline而不是这个九宫格导航。　　但是，显然这种优化还不是足够好。于是，在2011年11月左右，FB发布了新的iOS和android客户端，其中一个重要的变化就是导航模式的变化，推出了新的抽屉式的导航，同时强化了对Timeline的展示。　　FB推出这种新的导航模式不久，Gmail的iOS版本同样采用了这种导航模式，再之后path 2.0版本也采用了这种抽屉式导航并将其演变到极致。至此，这种抽屉式的导航模式迅速窜红与iOS产品设计中。　　简单的定义　　一般控制抽屉的把手出现在App的左上角，以按钮的形式出现，点击按钮之后抽屉被拉开，按钮被拉到App的右上角，左侧区域被拉开(抽屉)后显示出导航内容。　　导航的内容可以是以列表形式展示的常规2级导航，也可以将一些非常用的快捷操作入口直接放进来，如FB的搜索。具体形式如下图　　当然，这种抽屉也存在一些变种，目前以Path和Sparrow较为突出。Path不仅将主导航作为一种抽屉，同时底部的操作按钮也是一种变种的抽屉;而Sparrow则增加了抽屉的层级，在一级抽屉被打开之后还可以再继续拉开一层抽屉。另外，米途订酒店则将全部的酒店预订过程化作一种抽屉，也是一种很不错的形式。　　另外，对于一些需要用到消息提醒的应用，抽屉的出现会给消息的展示带来新的麻烦，因此，很多的抽屉导航会将消息展示在Title区域里，以一个入口的形式来展示。典型的如Facebook、快捷酒店管家。　　抽屉导航的核心思路　　抽屉式导航的核心思路是“隐藏”。隐藏非核心的操作与功能，让用户更专注于核心的功能操作上去。个人认为，隐藏的思维是移动产品设计中最核心的一个思想。上周在极客公园分享了关于如何应用缩小、隐藏、赋加的思路来做移动产品设计的话题，而这个思路中最最核心的恰恰是隐藏。　　Facebook中，用户核心的操作是阅读Timline，所以抽屉里隐藏了所有其他的操作;Path中，用户的核心操作还是看好友的 Timeline，所以抽屉里隐藏了其他的操作，同时UGC的操作又必不可少，因此Path在左下角也用了一个抽屉;在Sparrow里，用户看新邮件的频率大于查看归档邮件的频率，因此抽屉里隐藏了邮件类型等操作，同时为了平衡发邮件的需求，在右下角单独留了一个入口;在快捷酒店管家里，用户的核心操作是通过地图寻找附近的快捷酒店，所以抽屉里隐藏了切换城市等其他操作……　　这种导航方式会逐渐流行，推测的依据就是随着移动产品设计的演进，越来越多的产品设计师开始认识到只有让核心更突出才能提高整体产品的体验，只有不断降低用户的干扰才能不断提高用户的使用效率。　　而不适合抽屉式导航的App则有　　需要用户不断在导航间进行切换的App、没必要有太多导航的App、或者核心功能就是一堆入口的App。

　　推荐阅读

　　inline-block元素间距去除掉方法介绍(图文教程)

一、现象描述真正意义上的inline-block水平呈现的元素间，换行显示或空格分隔的情况下会有间距，很简单的个例子：<input /> <input type="submit" /> 间距就来了~~我们使用CSS更改非inline-block水平元素为inli>>>详细阅读

本文标题：抽屉式导航的设计更能让用户专注于核心的功能

地址：http://www.17bianji.com/kaifa2/CSS/16437.html

 1/2    1