设计图谱
学习路径/交互模式的语言/内容呈现模式/列表 vs 卡片 vs 网格
对比

列表 vs 卡片 vs 网格

【背景】列表/卡片/网格是不同的信息呈现模式,各有适用场景。 【步骤】1. 找三个用不同呈现模式的产品(列表/卡片/网格);2. 分析每种模式的取舍(密度/沉浸/扫描效率);3. 判断模式与内容类型的匹配。 【输出】三种呈现模式对比。

预计时长

15 分钟

任务类型

对比

观察提示

数字info_hierarchy入门

信息层级

打开主页面,前 5 秒你的视线路径是什么?产品用什么手段(大小、颜色、间距、动效)来区分信息的重要性?最重要的信息是否真的是你看的第一眼?

数字info_hierarchy入门

内容密度

屏幕上同时呈现了多少信息?是'一览无余'还是'需要滚动探索'?密度是否与使用场景匹配——快速浏览 vs 深度阅读?