设为首页 - 加入收藏 ASP站长网(Aspzz.Cn)- 科技、建站、经验、云计算、5G、大数据,站长网!
热搜: 公司 创业者 发布
当前位置: 首页 > 运营中心 > 建站资源 > 策划 > 正文

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

发布时间:2018-02-01 00:02 所属栏目:20 来源:产品100
导读:网格视图 网格视图是标准列表视图的另一种选择。网格列表与用于布局和其他可视化演示的网格不同,网格列表由网格列表中垂直和水平排列的单元格组成。 网格列表示例。 图片来源:MaterialDesign 内容扫描 网格视图为

网格视图

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

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

内容扫描

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

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

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

用户决策

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

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

优点和缺点

网格视图有以下优点:

  • 网格视图更吸引眼球 。

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

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

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

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

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

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

(编辑:ASP站长网)

网友评论
推荐文章
    热点阅读