【交互基础】系列之解析移动端导航设计模式(3)

8.3如下图所示的百度网盘、网易邮箱大师，对同一个类别下的不同视图间进行导航，而不是跳转到完全不同的类别，原生的Spinner控件的运用比较少了，现在国内的应用都做了差异化的运用（话说回来，在能实现目标的情况下，设计本不因拘泥于规范）。

二.内容界面结构

内容界面结构主要表现有：列表式导航、宫格式导航、陈列馆式导航、卡片式导航等 。内容界面结构导航，顾名思义，是针对内容界面的呈现、布局所整理出来的导航设计模式。大多用于次级导航，有少数情况会用于主导航。

1.列表式导航

当界面信息的种类比较单一，或者只是作为信息的链接入口时，我们可以使用列表式结构。这种结构可以高效、清晰地展示信息，可以容纳的信息比较多。一般做为次级导航使用，在少数应用中做为主导航使用。

优势：

列表式的信息格式比较一致，延展性很强，可以不断地增加信息。导航效率较高，可引入搜索功能。适合层级较深的信息结构。可以方便地进行分组分类。

劣势：

当同级内容过多时，由于形式的统一，用户浏览容易造成视觉疲劳。列表式可能有多层级，用户需在每个页面选择一次进行导航，直至到达目标位置，并且模块之间的切换需要返回到列表主页，操作步骤较多。如果列表中信息量比较庞大，往往需要加入搜索功能，否则用户寻找信息会很困难。

1.1列表式导航作为主导航，必须满足层级浅且内容平级的条件。如下图所示，iOS中的设置、QQ邮箱是为数不多的用列表式做为主导航的应用。

1.2列表式导航作为次级导航来展示二级甚至更深层级的内容，多用于个人信息、辅助功能、设置、信息列表等，十分常见。

1.3列表式导航作为次级导航展示种类单一的信息，如iOS信息应用，微信的消息列表等。

2.宫格式导航

宫格式（又称跳板式）主要作为信息聚合的入口，在这种界面中，用户80%的行为都在寻找信息入口。信息呈现的内容比较少，但是多个项目选取的效率比较高。

优势：

宫格式结构适合作为信息或平台的入口，为产品或项目信息提供聚合的载体。适合承载订阅类产品，或众多属性差异非常明显的分类信息。各个分类模块可以由不同团队独立开发再聚合汇总在应用中。宫格式结构具有较强的延展性，可以无限扩展内容。

缺点：

宫格越多，用户的选择压力越多。席克定律指出，一个人面临的选择越多，压力越多，这是宫格式无法避免的劣势。无法在多入口间灵活跳转，不适合多任务操作。用户无法第一时间看到信息。由于宫格式结构是信息或平台的入口，所以具体信息往往隐藏在次级页面，所以要看到具体信息，要多操作一步。

因为以上的缺陷，所以宫格式导航直接作为主导航使用的较少，往往作为二级页面使用，以图形的形式呈现出来。

2.1宫格式导航被广泛运用于各平台操作系统，如下图所示iOS与Android手机系统界面。

2.2如下图所示，微店、美图秀秀是为数不多的采用宫格式导航做为主导航的应用。

2.3当前，主要是利用宫格式导航的扩展功能来做次级导航，与标签式导航以及其他类型的导航模式共同构成整个应用的导航系统。如下图所示，微信钱包中的其他应用服务、ZAKER新闻中的频道就是采用的宫格式做为次级导航。

3.陈列馆式导航

陈列馆式导航设计区别于宫格式，在于可用来呈现实时内容（经常更新、视觉效果直观的内容），如新闻、菜谱、视频或照片等，内容彼此独立、无层级关系。可以采用网格布局或轮盘布局，还可以采用幻灯片模式进行展示。一般做为次级导航使用。

优点：

与列表式、宫格式相比较，陈列馆式表现形式、视觉效果更加丰富。展示直观，且方便浏览经常更新的内容。

缺点：

不适合展现顶层入口框架。界面内容较多时，容易造成视觉疲劳。

3.1网格布局

3.2轮盘布局，半隐藏部分内容，指引用户左右滑动察看。

3.3瀑布流网格布局，瀑布状的上下布局，引导用户的视觉方向，体验流畅，吸引用户浏览并沉浸其中。

4.卡片式导航

卡片式导航的原型是扑克牌，模仿了扑克牌中常见的切牌、洗牌、弃牌、翻牌等手法，是一种比较新颖的导航设计模式。

优点：

方式新颖，配合操作动效，比较吸引用户。页面内容整体性强。

缺点：

不适合展示过多页面，只能逐个察看，浏览效率低。不能跳跃性地察看间隔页面，只能按顺序察看相邻页面。各页面结构内容相似，容易忽略后面的内容。

如下图所示，秒拍的热榜、探探都是采用了卡片式导航。

5.仪表盘式导航

仪表式导航提供了一种度量关键绩效指标（KPI）是否达到要求的方法。经过设计以后，每一项量度都可以显示出额外的信息。这种主要的导航模式对于商业应用、分析工具以及销售和市场应用非常有用。但不要载入过多信息，对于要展示的关键指标或数据需经过仔细研究再做决定。

优点：

1.使数据更加生动直观易读

注意：

2.有特定的使用场景， 在需要使用关键指标或数据作为应用入口的时候，可以采用仪表盘式。

如下图所示，支付宝的资产管理使用了仪表盘式导航。

6.轮播式导航

当应用的信息足够扁平的时候，可以尝试使用轮播式导航。

优点：

1.这种方式最大程度保证了页面的简洁性和内容的完整性，一般都结合页面指示器（即小圆点），操作方便，左右滑动切换。

编辑：未知