场景-需求-行为模式-产品设计（如何满足行为模式）
一个偶然的机会，在逛手机淘宝时发现搜索的关键词粗略与详细，搜出商品的展示方式不一样，粗略搜索展示方式为卡片式导航，详细搜索时展示方式是列表式导航。通过自己的观察思考并结合一些资料对设计的根源进行总结分析，希望可以对自己以后的设计思考有帮助。
例如，搜索“大衣女”与搜索“大衣女 羊绒红色”搜索结果展示不同。
关键词不同 搜索结果不同
这引发了我对这两种展示方式的思考，列表式导航与卡片式导航到底有什么区别，分别应用于什么样的场景呢？先看两种布局的表现形式以及特点。
卡片式：往往是左右摆放的卡片，突出图片，并配文字数据信息。
列表式：往往是上下列表布局，小的图片或icon配文字数据信息。
首先这两种展示方式功能上的不同。
卡片式
1.卡片式注重图片信息对比，通过不断的滑动加载我们能够快速的通过上下左右图片的对比筛选出我们心仪的产品。
列入淘宝买大衣时，我们输入“大衣女”这样并不是很具体的搜索，可能用户只是想买一件大衣，对衣服的款式，材质，颜色等并没有具体的目标。而衣服的款式繁多，通过快速大量衣服图片的对比，用户就能够快速选出自己心仪的衣服。
2.卡片式承载的信息更丰富，交互性更强。例如，可以在卡片上进行点赞等操作。
列表式
1.列表示注重数据对大量文字信息的筛选。列表式从上到下排列，更符合用户的阅读习惯，相同字段的信息获取一目了然，能够快速筛选需要的信息。例如，淘宝搜索“大衣女 羊绒 红色”时，衣服的款式颜色对比的需求就弱于价格等信息的对比，因为款式颜色基本类似，这时候列表式就更加符合用户的目的。
另外，有时候由于粗略搜索与详细搜索的界限模糊不清，淘宝可能无法预知用户是先样式（卡片式展示）还是要对比价格（列表示展示），所以提供了两种展示方式切换的功能，是非常实用的。
2可以在一页中展示更多信息，通过上下滑动可以获得大量信息。例如新闻类APP。
应用场景不同
新闻类APP往往采用列表式展示方式，我们可以从用户场景及行为模式来分析。
用户在浏览新闻时，往往需要知道今天都发生了什么事，然后挑选感兴趣的内容深度浏览，用户的行为模式为：快速大量浏览-筛选感兴趣信息-进一步浏览。用户首先要大量浏览信息，量的需求优先于深度阅读的需求，所以列表示更加适合用户的这种行为。
使用场景不同 表现方式也不同
而一些APP更注重图片信息的筛选与对比，使用卡片式导航更加合适，例如，PinterestAPP ，我们需要对比筛选图片然后找出适合自己的目标图片。行为模式为大量浏览图片-上下左右对比-筛选-反复对比-判断选择。在这种行为模式下，对比的需求就更大一些，所以卡片式是更适合的方式。
总结
综上所述，当用户行为为大量阅读的需求优先，或者进行文字数据对比优先时更适合列表式导航。
当用户行为偏向于反复对比优先，再去做决定时，或者图片表达优优先。更适合卡片式导航。
另外，再具体的设计中还需要考虑到其他方面的需求，综合考虑来进行设计。
网友评论