壹佰大咖说｜精准定位三大类移动应用导航设计，案例实战全解析

目前1905手机端的应用，选用的是选项卡时导航，但是改版前一直用的是抽屉式导航，将推荐频道作为应用启动的第一个界面。然而除了推荐频道的点击量很高之外，其他频道的点击量很低，所以当时考虑很重要的一个因素，是因为导航将其他频道隐藏太深导致，因此经过团队的讨论后，决定将导航改为选项卡导航。改版后各项数据都有所上升，体验非常直观。

2. 下拉菜单式

国外的某APP界面

在上面这张图中的应用，就是采用瞬时导航来删选不同频道的分类。

下拉式导航几年前也颇受偏爱。曾经我所在的PPTV团队，PPTV手机端1.0版本，我们所有的电影、电视剧、动漫等内容选择，都采用下拉式菜单展现。产品的交互设计也如时尚界，有一个流行趋势，这个交互设计流行了一段时间后，现在又开始了另外一种交互设计的流行。所以你会发现菜单式流行完后，视频类的产品又开始流行选项卡式的导航设计，并且沿用至今。其实用户的习惯养成，并不是我们想象中这么难。好用与可用，是不同的。但是，只要是好的设计，总是会受到用户的喜爱。

3. 转盘菜单式

在我们所有模式中，转盘菜单式是最少见的，无论是国内还是国外，使用率都非常低。究其原因，主要是由于其交互设计较为复杂，对于用户来说，使用成本太高。因此我们要谨记，能简单的，绝不复杂化。

同时，由于其操作手势很不简单和自然，因此设计任何有多个层级的菜单时应该避免采用转盘式的菜单。

为什么叫次级导航呢？因为其是在一级导航主导航下的二级分类和导航。

1. 翻页式导航

翻页式导航视觉呈现效果很强

翻页式导航通常应用在次级导航中，通常利用移动手势控制，如左右滑动，而手势的利用，在移动的交互中，往往可以达到事半功倍的效果。

因此我们在进行产品设计时，如果我们可以用手势来进行操作的功能，不要在界面上增加更多的按钮或者指示，增加流畅的交互体验所带给人的舒适感。

运用翻页式时要利用移动的手势控制，不要依赖像下一步按钮或标签页这类桌面端模式。但要注意提供视觉指示，让用户知道可以使用滑动手势。

2. 滚动选项卡式

滚动选项卡式的导航和手势的使用、动态交互密切不分。其适用于在某一个模块中显示多种类别或视图时。

滚动选项卡一般比标准的标签栏要窄，没必要作为触摸对象，进行滑动就可以进行切换，因此一定要注意动态交互设计。所以，希望大家在进行导航设计时，不仅要考虑导航本身的设计，还要考虑到功能分类和手势交互达到完美结合，这样的产品体验才能达到极致效果。

3. 折叠菜单式

折叠菜单式的导航，就是运用动态的效果，将二级的信息展开，无需跳转到新的页面，使用户在同一个页面上查看到更多的信息，不需要任何跳转。因此用户可以在一级页面就获取大量信息。这种模式比跳转到另一个页面再跳转回来更高效。

但是，一定要使用常见的图标来进行指示折叠式菜单的打开或关闭状态，避免用户产生疑问。

然而，熟悉了这么多的移动导航之后，在我们以上讲的内容中，并不是所有的设计都站在了用户的角度，有一些设计我们称之为反模式设计。

反模式也称之为陷阱，指一类通常是重复发生的糟糕的问题解决方案。通俗来讲就是一些违背现有设计规范规则，违背常用的视觉交互的方式方法，设计者出于某种目的，进行的一些没有必要或者不按常理出牌的设计。 因此，我们要特别注意，避开这些陷阱。

很多时候产品经理更像是团队中的润滑剂，面对开发人员、设计师等各种要求，务必要站在用户的角度，多方面进行慎重的思考。在面对反模式的需求时，要坚决的拒绝。但是，在拒绝的时候，要用专业知识进行支撑，这就是say no的底气。

以下内容都是反面教材，切记勿踩坑！

1. 标新立异

反面案例一：中国建设银行手机客户端

建行的转盘导航 ，交互操作非常复杂，没有办法让用户一眼看到所有的菜单分类 ，切换主菜单时，菜单会旋转，影响用户视觉 。正是这些原因，让我将这个产品从我的手机中彻底删除了。

案例二：NBC NEWS

（编辑：PHP编程网 - 黄冈站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!