这是《App产品设计指南》系列文章的第13篇内容，更多精彩可以点击下方链接查看。
在确定产品的核心价值、功能范围、信息架构后就要开始正式的产品设计环节了，也就是通常说的原型设计。
根据用户体验五要素的理论，导航是框架层要做的事情。导航相当于是App的骨架，把不同的页面，功能串联在一起；突出重点模块，让用户快速找到自己想要的东西。导航设计可以说是原型设计最重要的环节，所以一定要慎重。本文总结了目前比较常见的导航模式，分析了各自的优缺点，希望能给大家一点启发。
一、标签式导航
标签式导航的位置可以在页面底部或者顶部。
（1）导航放在页面底部是目前最常见的设计模式，菜单数量一般在3-5个，具体数量根据产品业务复杂度来制定。一般都是文字+图标这种样式，5个菜单最为常见。至于为什么是5个菜单，7±2法则法则，费茨法则可以解释这个问题。有兴趣的读者可以参考下文。
优点
直观易懂，用户能快速切换，找到对应功能场景。
缺点
菜单比较多时放不下，且底栏本身占据一部分页面高度。
微博&考拉海购
（2）导航放在页面顶部，可以支持滑动切换，能帮助用户更快地找到内容。顶部导航一般出现在资讯类App或者是比较复杂的App，通过一级或者是一级+二级导航来安排页面内容。
优点
能合理的安排信息结构，二级导航能放置更多内容，交互也比较方便。
缺点
导航在顶部的滑动操作和页面中的滑动操作可能会产生冲突，而且本身也占据一定空间。
36氪&半次元
二、列表导航
使用列表样式来进行布局，可以展现更多的内容。通常情况下会针对特殊菜单添加文案说明，红点提示，引导用户进行操作。
优点
列表导航易于拓展，便于用户理解，可以容纳更多的内容。
缺点
列表导航的样式比较单调，而且内容较多时不利于用于检索，需要通过设计分组来规避这个问题。
17K小说&蜻蜓FM
三、宫格导航
一般用于信息、功能互相独立的场景，不同入口之间没有交集。
优点
功能入口直观，便于理解，能更合理的安排内容。
缺点
一般情况下排列在前面的入口的点击率会更高，不利于其他入口的使用。
百度网盘&优酷
四、抽屉导航
通过把非核心功能的操作整合到左侧抽屉菜单，让用户集中注意力在当前页面，能更好的聚焦当前的核心功能。
优点
能很大程度上节约空间，让用户获得沉浸式体验。
缺点
抽屉菜单的入口相对较深，需要用户探索发现，不利于功能的发现。
网易云音乐&酷狗音乐
五、舵式导航
为了重点突出某个功能，重点突出每个菜单，一般情况是作为发布添加操作的入口。
优点
比较突出，同时可以折叠更多内容。
缺点
因为是二级导航，入口层级会影响用户的正常使用。
一罐&Soul
六、卡片式导航
卡片式导航能根据页面内容的变化及时更新，适合以图片为主的内容，比如美食，旅行，新闻类App，通常作为二级导航。卡片式导航可以看到宫格导航的一种延伸。
优点
每个卡片互相独立，具备冲击力，能让用户快速找到自己所需的信息。
缺点
内容过多时不利于用户检索。
红板报&QQ音乐
七、菜单式导航
通常是用于筛选一级模块下的多个选项或者模块，属于二级导航。
优点
和上一级导航衔接比较自然。
缺点
如果内容较多时会显得比较拥挤，且二次导航入口相对较深。
微信&今日头条
八、轮播式导航
适用一些选项比较少，且不频繁跳转的应用中。
优点
页面上比较简洁，这种导航通常配备大图，能让用户获得更好的体验。
缺点
不适合展示过多内容，用户很容易忽略后面的内容。
墨迹天气&一言
九、点聚式导航
当需要更多展示内容和功能，需要极端简化其入口，一般可以使用点聚式导航。
事实上舵式导航属于一种特殊的“点聚式导航”，特殊点在于它是点聚式导航和标签式导航的结合。
优点
比较有趣，交互吸引用户。
缺点
入口相对深，用户不容易发现。
简书&WPS
不同的导航有各自的特点和优缺点，我们在产品设计的过程中一般是把不同的导航组合使用，需要根据产品的功能场景，信息架构来合理的安排。希望本文能对大家有所帮助。
在写作过程中，如果有意见或者想法，欢迎有兴趣的读者添加我的微信，加入微信群一起交流探索，共同进步。
网友评论