我们所说的多维度导航是指能够引导用户通过不同纬度:运营维度、商品自然属性维度、搜索等维度,快速浏览目标商品的导航,我们称之为多维度导航。
本次薯片会一改以往低调、沉稳之作风,先瑜伽团美女show上阵,再是以臭为首的吃喝团上阵,两轮下来大家情绪Hight到了极点,自然讨论的时候思维也是相当的敏捷,O(∩_∩)O!
本次薯片会以QQ商城网站为例,对多维度导航进行了深入探讨……
我们所说的多维度导航
主要是指:能够引导用户通过不同纬度:运营维度、商品自然属性维度、搜索等维度,快速浏览目标商品的导航,我们称之为多维度导航。
以QQ商城为例:QQ商城的多维度导航主要分为2个维度:

1、运营维度:引导用户参与不同运营主题(每日抢购、当季新品等),从而关注商品,主题可根据需要定期更换;
2、商品自然属性维度:通过商品自然属性(分类、品牌等)引导用户浏览和购买;
为什么网站会使用多维度导航
A、让用户第一时间看到最新内容(每日特价、热销新品)
B、 希望用户通过不同主题参与网站活动(当季热卖、新店促销)
C、 利用商品或内容的相关性引导用户浏览(分类和品牌)
D、 让新手用户更加方便的找到目标
……
多维度导航的优缺点分析
目前多维度导航在很多B2C型电子商务网站中被使用,如:amazon.com、shop.qq.com、mall.taobao.com等等,多维度,其优点很明显:最新内容展示,多主题引导,快速定位商品,满足长期运营需求。但是也有其不足之处:
单一维度的导航,比较适合向新用户传递整个网站的信息架构,而多维度导航很难做到这一点.


多维度导航和面包屑一起使用时,在某些维度场景下会导致面包屑无法表意清楚商品的信息结构.
QQ商城多维度浏览_面包屑示意图

上图中我们可以发现,商品的信息结构是唯一的:即:【QQ商城 > 运动服饰/配件/包袋 > 运动包袋 > 双肩包 > 商品详情】,分析三个浏览维度的面包屑表意:
1. 从”品牌维度”浏览时,面包屑【QQ商城 > 李宁 > 运动服饰/配件/包袋 > 运动包袋】
其中”李宁”这个面包屑节点并不是商品信息结构中的节点,故此面包屑表意会有歧义;
2. 从”分类维度”浏览时,面包屑完整的表意了该商品的信息结构,表意很清晰;
3. 从”运营维度”浏览时,中间过程无面包屑。
针对上述第1点的问题,经过大家讨论后提出了优化方案:经过大家讨论后提出了优化方案:
QQ商城多维度浏览_面包屑示意图_优化后

1. 只有按”分类维度”浏览时,面包屑才时时完整表意商品信息结构
2. 按其他维度浏览时,一般不出现面包屑。除非用户选择了商品分类,此时才会出现商品信息结构面包屑:

总结
信息多维度的集中展示,必然带来用户认知的负担。既要降低用户的认知负担,又要能方便用户多维度快速找到目标商品,在设计多维度导航时需要我们去平衡。
另外多维度导航与面包屑混合使用时,也特别需要注意到面包屑的表意是否会造成用户对商品信息结构的错误认知,面包屑运要慎用。
情非得已
21个Sketch实用高频小技巧2019-02-15
25款值得收藏的优秀网站模板免费下载2015-09-16
20套高质量的免费网页模版PSD素材2013-09-02
20款国外时尚大气的按钮开关PSD素材下载2013-07-31
CSS实例教程:十步学会用CSS建站2011-10-05
网页设计师:浅淡网页BANNER设计2010-09-27
网页细节教程:WEB设计精确点滴2010-09-13
网页设计中的点滴细节把握2010-09-01
总结交互组件创新的四种方式2010-06-28
最全的国外电子商务CSS模板下载2010-06-18
实例解析3种文档大屏适配方法
相关文章2632020-03-09
详细解析UI设计中搜索栏设计的技巧
相关文章6092019-03-31
UI设计师如何设计最常见的关闭按钮
相关文章4042019-02-24
设计师解读如何让扁平的网页更出彩
相关文章10302018-12-07
UI设计师需要学习的保存功能设计总结
相关文章3422018-12-07
7招表单设计设计师方法提升表单体验
相关文章5672018-12-07
UI设计师必学栅格设计原理和技巧
相关文章4992018-11-29
5个网站设计实例解析网页设计趋势
相关文章4452018-11-29
