通常来说，每一个app都是有导航的，对于手机屏幕如此狭小的空间来说，如何把应用上的所有内容装下，是我们需要去思考去规划的。导航模型有很多，让我们先从理解导航开始说起~

导航的作用

ios Human interaction guide上有指出

用户在使用应用的时候通常不会意识到导航的存在，直到在使用中出了问题，比如没有符合预期。 我们的工作就是用导航来帮助支持应用的结构和目的，同时又能不分散用户的注意力。 导航应该是自然的，亲切的，不应该主宰屏幕或者将用户的吸引力从内容上分散。

再来看看Material Design 上关于Navigation pattern的说明。

导航栏必须是直观的(intuitive)有可预见性的(predictable) 。

不管是新用户还是老用户都应该很容易的掌握导航的使用。 当用户在不同界面切换的时候， 他们需要浏览不同的内容，包括图标内容， 和操作， 这一系列的内容组合起来就告诉了用户你的应用里面包含了什么。

• 建立上下文联系(Communicate relationships & context)

将内容能够按照逻辑以及相关性组合，展示项目之间的关联

• 阐明操作(Illuminate Action)

指引用户从一个场景到另一个场景，既能帮助用户做出选择也能让他们自由探索。

• 聚焦注意力(Focus attention)

用导航栏来展示最重要的内容和任务。

由此可见，两者都有指出导航应该是符合预期，并且不引人注目的。一切服务于内容。

导航的分类

广义上来说，导航栏主要有以下三种类型：（根据 ios HIG）

• 分层（Hierarchical navigation）
• 扁平（Flat navigation）
• 内容或体验驱动（Content-driven or experience-driven navigation）

分层信息架构

在一个界面上只做一个选择，直到你到达目的层级。 如果你要切换到另外一个目的层级，就必须退回一些，或是一层层的往回退，直到到最初的起始点，做出另外一个选择。 我们可以在设置和邮件应用中看到这种结构

扁平信息架构

在扁平信息架构中， 用户可以在众多内容之间切换，所有的分类都可以从主屏直接访问，我们可以在音乐和App Store中看到这种导航方式。

内容或体验驱动信息架构

在内容或体验驱动的信息架构中， 导航会根据内容或体验来设计， 用户可以在内容之间自由的切换，或者说内容自身可以定义导航。 游戏，ibooks，或者其他沉浸式的应用通常都采用这种导航方式

一般来说，一个App不太可能只包含一种导航方式，通常都是相互结合的。比如说，在使用扁平信息架构方式的app中，在其信息构架下的某一类可能会用层级导航。

因此如何去设计你的导航栏是在app设计之初就要思考的问题，不管你使用哪一种导航方式， 都应该让用户时刻清楚自己所在位置，以及如何去到目的页面。 无论使用哪一种导航方式重要的是用户的访问路径要有逻辑，符合预期，并且可以追溯。

导航的设计

定义你的导航

根据Material design 的说明我们来看看关于导航设计的一些方式：

在确定你所以使用的导航之前，要确定当你的用户在使用你的应用的时候，可能会浏览的路线，以及你期望他会进行的操作。

下面以设计一个查找饭店app的导航设计为例。就设计一款找饭店的app来说， 你的用户可能会期待的功能有，预定，发菜单， 写点评等， 确认用户的使用目标，并且将这些信息按照重要性排序，从而设计出合适的导航。

盘点（Take Inventory)

确定你的用户， 并且了解潜在用户的角色， 比如是消费者，商人还是记者， 并逐一确认他们最有可能常用的任务。

确认优先级（Prioritize)

将常用任务进行优先级划分，按高中低排列， 对于重要的路径，给到优先等级。

当用户需求有所改变的时候，调整优先级。

排序 （Sequence)

用户可能会通过不同的路径到达同一个地方由此确定你的导航。

• 确认导航里最常使用的视图，并重点突出。
• 将相关的任务组合起来，并用这些组合来构建你的导航。

比如，假如用户的目的页面是查看某个饭店的信息，他们可以通过查看最受欢迎的饭店的界面，以及查询饭店的界面到达同一个目的界面。

解构（DeConstruct）

将复杂的，广泛的，模糊的用户使用情境分解到一个个小的用户活动。 这些小型的任务可能是常用的， 而且易懂的，更加能满足用户的目标。

例如， 将搜索分成几个小的任务，可以通过名字，地点，或者流行度来搜索，将这些任务放到你的导航里面去。

比如，查找饭店这个宽泛的任务可能包含了几个小任务， 比如:查找附近，按名字查找，按受欢迎度查找。这些小人物让用户在搜索的时候可能更加简单。

层级 (Hierarchy)

导航通过区分层级的方式将内容组织起来。 最顶级的场景是最重要的，顶层导航需要有良好的可达性. 并且可以连接更底层的场景。

主页（Home）

主页是应用的入口，相当于是一个应用的窗口，起到介绍整个应用以及其导航的作用。

主页上的内容可能会根据其不同的内容展示而不同，一个叙述性的主页应该包含该用户先前与应用之间的交互提示。

父子级(Parent and Child)

一个较高的层级叫做父级，下面的是子级。

比如主页面是应用上所有界面的父级。

导航（Navigation）

当你要浏览应用更深层级的时候， 你是从最顶层到最低层的。

从父级到子级称作下降式导航（descending Navi） ,反过来则是上升式导航（ascending navi）。

平级（Siblings）

有着同样父级的视图称为平级，当一个应用有着多个使用场景，并且所有的的层级都有相同的重要性， 那么通常这个应用就包含了许多平级层。

横向导航（Lateral navi）指的就是在是平级视图之间的移动

集合（Collection）

集合包含了多个拥有相同父级的项目。

链接(links)

链接允许用户快速的在没有层级关系的相邻场景之间快速跳转

交叉链接（Crosslinks）会带你去到应用的任何地方。 外部链接（External links），跳转到其他的应

小结

今天的内容都是根据Material design 和ios HIG上整理而来的，个人觉得熟读这两本心经，并仔细观察常用的应用，会对整个应用的导航设计有着更好的理解。

导航的形式多种多样，常见的比如说底部导航栏，抽屉栏，列表式导航栏等，这些导航的基本信息架构都可以分为，分层，平级，以及根据内容和体验趋势的导航，每一种导航方式都有其优缺点，我们需要做的就是找到最适合你的应用的导航方式。

接下去我们就几种常见的导航方式进一步的探讨一下~ 。