最热门的12种导航模式

最热门的12种导航模式

用户在使用应用时，需要随时清楚了解下一步应当前往哪一页面以及如何前往该页面。如果用户无法轻松在应用中进行导航，则将很快对你的应用失去兴趣。因此，能否为移动应用设计出有效的导航功能至关重要。在投入菜单、操作栏、弹窗、按钮、箭头、链接等内容的设计之前，你需要牢记几个基本的注意事项。

导航设计的4大注意事项

在弄清自己移动应用的架构和组织情况之后，就可以开始考虑导航设计了。在此时，你需要考虑下面的几个事项：

1. 可达性

移动应用的导航功能可以说是所有界面最重要的组成部分，因此一定要保证其可达性，并把最关键的要素尽量突出，同时不要影响到内容本身。

2. 是否有意义

确保菜单、操作栏、弹窗、按钮、箭头、链接等导航要素简单明了，让用户一看就知道是什么意思以及操作结果是什么。不要弄的太过花哨，用户没有耐心去“猜”。

3. 易于理解

如果你想设计比较高级的导航功能（例如链接图片、允许滑动或其他手势导航，或者访问隐藏菜单），请务必在设计过程中保证前后一致，以便用户熟悉你所使用的模式，同时还应加入一些额外的信息（例如小箭头、文字或改变颜色或高亮等）来吸引用户注意力，并以微妙的方式对用户进行引导。不要给用户呈上“看得见摸不着的导航功能”。

4. 通用性

你的导航功能应当以一定的形式显示于移动应用的各个界面。各个导航模式不一定要完全相同，但其基本结构应当在应用内保持一致，可以根据背景进行小幅度的调整。

导航模式概述

在记住上述设计目标后，下面是本文要详细说明（对这些设计模式的更深入探讨请见我们的电子书《移动UI设计模式2014》）的几个设计模式的概览：

1. 说明与引导标记

2. 溢出菜单

3. 滑块

4. 基于内容的导航

5. 变换式控件

6. “跟随式”固定导航

7. 垂直导航

8. 弹窗

9. 滑出页面、侧边栏和抽屉

10. 无所不至的链接

11. 高级滚动条

12. 滑动视图

1. 说明与引导标记

Secret

问题

用户希望了解如何使用应用的各项功能。

解决方案

设计一套说明或教程来演示各项功能如何使用。现在很多应用都使用这种方式在用户首次启动时提供演示。这种方式可以分为两大基本方法。Secret和YouTube 等应用采用了覆盖图指南的方法，并使用“引导标记”突出显示UI中的关键部分来说明其作用。

另外，Carousel和Duolingo等应用则会在用户首次启动时以幻灯片的形式引导用户走完全部体验过程，从而有效地说明应用能够帮助用户实现哪些功能。这一引导过程同时也是收集重要信息（方便后期简单注册乃至更深入的需求）的绝佳时机，类似于设置向导。这一模式对于无法第一时间直观了解功能的应用来说至关重要，因为用户对你的应用了解越深刻，就越有可能继续用下去。

2. 溢出菜单

Whatsapp、Gmail

问题

用户希望能够快速使用附加选项或操作。

解决方案

将附加选项和按钮隐藏在溢出菜单中，这样它们就不会干扰主界面。溢出菜单在安卓系统中有着广泛的应用，其主要用于将不常用但与当前内容有相关度的选项和菜单项隐藏到操作栏中。Whatsapp和Gmail等应用对刷新和状态设置等菜单项（这些都是用户需要能够快速使用，但如果放在显眼位置会比较碍事的附加功能）就采用了这种模式。在RelateIQ中，用户可以按住主菜单项来查看子菜单，从而实现快速导航到不同视图。

3. 滑块

Uber

问题

用户希望能够在不同选项之间无缝切换。