什么叫“移动互联网产品的设计模式”呢？所谓的设计模式，也就是行业内经过多年的沉淀以及优化而得出来的一些普适性结论，可以直接借鉴甚至复用到我们的产品设计中去。移动互联网产品设计经过多年的发展，已经沉淀下来了很多设计经验，把这些设计经验归纳总结起来，便会产生一些稳定的设计模式。设计师在设计移动互联网产品的时候合理地借鉴和运用这些设计模式，便会大大地提高工作效率。比如你在设计APP的过程中，设计模式会告诉你可以选择或者考虑哪些组件，哪些组件可以实现这个功能，又有哪些组件可以更好地实现这个功能等等。

那什么是导航呢？导航类似于书的目录，拿起一本书，你就可以通过目录大概知道这是一本什么样的书、有哪些内容以及这些内容是如何分布的。APP中的导航就是让用户明确自己当前的位置，且在使用产品的过程中不会迷路。正如书本目录有着一级目录和二级目录一样，APP也会有着一级导航和二级导航，并且一个APP中往往也会有着多种导航形式。

这些导航模式并不是随便乱用的，而是设计师考虑到了导航的具体适用场景之后才去选择使用的。那么接下来我们就一起了解一下移动端有哪些常见的导航模式吧。

如果APP中有几个都很重要的功能，并且它们之间相互切换地比较频繁，这个时候使用标签式导航就非常合适了。标签式导航是iOS主推的导航模式，位于屏幕底部。在Android端常见于顶部，可以避免导航与底部的虚拟按钮之间发生冲突，引发误操作。这种布局方式能让用户直观地了解到APP的核心功能。而标签的分类可以根据逻辑和重要性控制在5个以内。



但是如果标签超过5个怎么办呢？这时便衍生出了滚动式标签导航。需要注意的是，这种标签式导航需要给用户一点点提示，告诉他们在页面之外还有一些标签的存在。因为滚动式导航的标签太多了，所以它一般只能作为次级导航而存在。



标签式导航虽然好，但是却占用了屏幕大量的面积。尤其是当在同一个页面中有两个导航的时候。


 

那么有没有“瘦”一点的且和标签式导航类似的导航模式呢？有的，接下来要说的就是分段式导航。

“分段式导航”顾名思义就是采用“分段”的策略来实现导航的功能。在网易云音乐里面我们也可以看到这种分段式导航的身影。只要留出一点点空间，分段式的控件就可以塞进去，颇有见缝插针的感觉。当然它一般只是分成两段或者三段，很少会像标签式导航那样有四段或五段。需要注意的是，分段式导航一般不适合作为一级导航，而往往是作为二级导航与标签式导航嵌套使用。


 

如上所说，我们都已经了解到了标签式导航特别适用于几个功能都很重要，且相互之间切换地比较频繁的使用场景。那么，我们应该如何设计一个也是有几个功能都很重要，而且功能之间的切换也很频繁，但是只有一个功能是最重要的主导航呢？这个时候要采用的导航模式就是舵式导航了。

这种导航模式可以理解为标签式导航的一种变体。在标签式导航的基础上融合了一些个性化设计，例如在标签栏的中间位置融合Logo或者产品核心的功能点，丰富标签栏的样式，从而衍生出了舵式导航。因为重点强调了一个标签，并且放在了中间的位置，样子看上去就像一个舵，因此取名为舵式导航。


 

假如我们要设计的APP有多个功能，它除了一个特别重要的功能之外，其他几个功能都不那么重要，这个时候我们又该如何去设计呢？其实设计思路很简单，既然不太重要，我们又不可能删掉，那么就“藏”起来。

这回我们要讲的就是抽屉式导航，抽屉式导航的精髓就在于藏！藏掉不太重要的功能，从而使产品的核心功能变得更加突出，弱化导航界面，一般通过左上角的按钮或手势滑动呼出。


 

抽屉式导航相对于标签式导航来说，虽然在界面显示面积这方面占了很大优势，但是也有一个比较大的缺点：使用抽屉式导航意味着比使用标签式导航需要更多的点击次数。国外的研究也表示，抽屉式导航功能的使用频率会远远低于标签式导航。所以千万不要在抽屉式导航中放置非常重要的功能。我们看到现在的抽屉式导航已经不像几年前那么流行了，这与它的缺点是息息相关的。当然也和手机的发展以及产品业务逻辑的发展脱不了干系。

就好比资讯类产品——网易新闻等，之前文本类型的资讯固然是最主流的、核心的，但随着4G以及wifi的快速普及，用户对于图片和视频功能的需求会越来越大。所以以前设计师为了腾出更大的页面空间让用户去浏览资讯，可能会采用抽屉式导航，但是随着大屏的普及，这个需求已经变得越来越不是问题。甚至随着大屏的普及，页面左上角的抽屉式导航按钮会让用户感觉到操作困难，所以很多产品都直接采用标签式导航而放弃了抽屉式导航。

虽然抽屉式导航不太流行，但是它不至于没有用武之地。经典的莫过于打车软件。对于打车软件来说，核心的功能就是打车，其他功能相对而言都没有那么重要，所以采用抽屉式导航就再合适不过了。


 

我们刚才说到抽屉式导航的精髓就在于藏。假如你的APP中确实有着很多不那么重要的功能，那么藏起来确实没有什么问题。菜单式导航也同样具备着“藏”的意味。当用户点击该控件后，页面上便会出现该菜单的条目列表。它和抽屉式导航的功能类似，都是把条目隐藏起来。需要切换条目时，就先打开下拉菜单，再选择具体条目，从而去到目标页面。但由于导航菜单位于屏幕顶部，不适合结合手势，操作上有难度，所以不适合需要频繁切换的功能。



菜单式导航的一个具体应用就是和滚动式标签进行结合。滚动式标签的特点是显示的数目有限，但是能够实现快速切换。而菜单式导航的特点是能够显示足够多的条目，但是切换起来比较麻烦。两者结合，可以优势互补。用户可以在相邻的标签上实现快速切换，而对于看不见的标签又可以通过下拉菜单导航来浏览所有的条目。


 

上文依次介绍了标签式导航、分段式导航、舵式导航、抽屉式导航和菜单式导航的特点以及具体的使用场景。其中标签式导航、舵式导航、抽屉式导航、菜单式导航属于常见的主导航，分段式导航属于常见的二级导航。常见的主导航还有桌面式导航、点聚式导航，常见的二级导航还有走马灯、列表、图示。主导航与二级导航之间也可以相互转化。

同时，从上面我们也可以了解到有不同导航模式相互结合的情况。其实在产品设计的过程中，没有完美的导航，只有合适的导航。而这个“合适”往往会随着场景以及需求的变化而变化。我们作为一个交互设计师，首先要去了解需求，然后从需求中出发，再从需求中选择合适的设计模式，而不能为了规范而规范。

书籍推荐：《方寸指间——移动设计实战手册》

声明：本站部分文字及图片均来自于网络，如侵犯到您的权益，请及时通知我们进行删除处理。