最近做需求接触到了分步导航的设计，在移动端大热的时代，曾经在网页端担当重任的分步导航已渐渐淡出用户的视线。
什么是分步导航？分步导航就是将一系列的过程分解成多个合理的步骤，它属于典型的线性引导方式，目的是让用户按部就班地快速完成任务。分步导航是电商类网站常见的元素，早期的天猫和亚马逊都能看到它的身影。
天猫的分步导航
分步导航的优点主要体现在三点：第一、分步导航能够合理地分块展示内容，便于用户浏览，让用户能够快速定位到关键信息，开启任务；第二、它能够为用户建立明确的心理预期。在心理学中，预期与完成度一般成正相关关系的，如果用户能够清楚知道完成任务需要经过多少个步骤，会更容易完成它，显著降低放弃的概率；第三、在复杂的过程中追踪整个流程，清晰明了指示任务路径。
虽然分步导航在移动端里的应用不及网页端的普遍，但是在一些场景设计还是挺常见的。
引导页
APP引导页的设计其实是分步导航的一种演变，通过步骤式的介绍引导用户了解新功能或优化点。由于用户在引导页停留时间不长，都是快速跳过，所以引导页的步骤也不多，一般控制在3-5步，使用滑动的小圆点来指示当前位置。
多步表单
当需要用户填写大量信息的时候，分步处理信息更便于用户操作，APP里常见的是注册。
例如全民K歌的主唱注册页面，整个注册流程总共有三步，步骤不多但是每一步的信息量并不少，因此他们使用了一个页面展示一个步骤的形式，并写明了步骤的名称，第一步是基本资料，让用户清楚步骤的顺序和内容，同时下面还标示了注册流程共三步，完成填写的百分比，有助于用户建立心理预期，估计完成任务所需的时间。
摩拜的注册流程沿用了传统的线性流程，线性或是箭头指示的优点是强调了方向，能够提升连续性，不但让用户清楚知道自己的当前位置，还能知道之前和之后步骤的连续关系。同时，它状态变化的视觉反馈也是比较清晰的，已完成项打勾，当前项有呼吸灯的动效。
Airbnb发布房间的步骤算是比较复杂的多步表单，一开始先让用户完成优先级最高的两项内容：位置和基本信息，这两项基本不用填写，可以快速完成，位置可以自动定位，基本信息选择数量；待用户完成简单的任务，目的进一步清晰后，后面的复杂任务就显得没那么难了。同时，用鼓励的语气告诉用户：还有6步就能完成任务了，鼓励他们完成任务。如果一开始告诉用户发布房间有8步，相信很多人都会望而却步，觉得投入的时间和精力太多了。由此可见，当步骤比较复杂的时候，如何合理引导他们完成流程也是至关重要的，就像我们考试做题的时候，题目很多，但是如果先简后繁，合理安排，做起来就会轻松很多。
还有一些国外的例子是建议小屏幕上横向空间有限，使用纵向分步的设计，这个也是值得我们参考的。
总而言之，分步导航的设计目的是引导用户快速完成任务，因此优秀的分步导航应该是简单易懂，能够让用户知道当前位置和步骤流程，同时也具有视觉吸引力，起到良好的引导和反馈作用。
参考资料：
《网站中导航的类别你知道几种？》http://www.noonenet.cn/newshtml/newsinfor/navi.html
《用户体验设计中的分步导航设计技巧》http://www.yunrui.co/35611.html
网友评论