移动用户体验设计之列表视图与网格视图

网格视图

网格视图是标准列表视图的另一种选择。网格列表与用于布局和其他可视化演示的网格不同，网格列表由网格列表中垂直和水平排列的单元格组成。

网格列表示例。    图片来源：Material Design

内容扫描

网格视图为用户提供了更具中断性的扫描格式，使其最适用于视觉内容。通常，这些图像占据了大部分的单元格空间。

具有典型扫描模式的网格示例。    图片来源：Material Design

使用网格视图，用户的注意力能够在每个网格单元之间分布地更均匀。因此，网格视图可以优化视觉理解和区分相似的数据类型。

用户决策

用户主要依靠图像进行选择。这里需要注意的是用户在同一时刻只能看到4- 6 个网格选项。

电子商务网站的网格视图示例。

优点和缺点

网格视图有以下优点：

• 网格视图更吸引眼球 。

• 网格视图帮助用户判断项目之间的视觉差异。

• 在网格视图中，用户的注意力分布更加均匀。

但它也有下面的主要缺点：

•  网格视图需要创建更长的页面，迫使用户过度使用滚动。

在下面的示例中，你可以看到列表视图和网格视图之间的区别。

红线显示屏幕的可见部分。    图片来源： nngroup

（编辑：核心网）

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