【导航基础】天猫店铺用户体验设计

作者:onhoo
点击数:

您现在的位置:暗号设计>>设计观点>>天猫店铺体验设计>>
发布时间:2013年06月20日

我们现实生活中的出行,都会依赖地图,公交站牌,路标,指南针,太阳的位置,周围熟悉的建筑物等等……各种来帮助我们了解自己在什么地方?去哪里?怎么去。我们时时刻刻都在努力识别自己所在的物理空间。如果有一天在一个陌生的地方醒来,周围是陌生的环境。我们会恐慌,第一反应就是弄清楚自己在哪……。当然这种情况在现实世界不多见,通常情况下我们在哪里睡的,还会在哪里醒来。

什么是导航?

我们现实生活中的出行,都会依赖地图,公交站牌,路标,指南针,太阳的位置,周围熟悉的建筑物等等……各种来帮助我们了解自己在什么地方?去哪里?怎么去。我们时时刻刻都在努力识别自己所在的物理空间。如果有一天在一个陌生的地方醒来,周围是陌生的环境。我们会恐慌,第一反应就是弄清楚自己在哪……。当然这种情况在现实世界不多见,通常情况下我们在哪里睡的,还会在哪里醒来。

但是在互联网的虚拟空间里,这确实再常见不过的事情了,我们通过搜索引擎进入一个全新的网店,像机器猫里的任意门一样我们可以在任何地方穿越到任何我们想去的其它地方。

在互联网的信息空间里穿梭的唯一限制是你知不知道目标页面的超文本链接地址。

因此我们还是需要知道我们在哪?我们要去哪?以及怎么去?

网店导航系统的设计就是为了解决这些问题。帮助用户建立位置感,方向感。提供穿梭时空的任意门同时保证用户不迷路。

网店内部的主要导航元素可以大至分为:全局导航;区域导航;情景导航三类。

 

全局导航(Global Navigation)

全局是指在网店的任何位置都会出现的导航元素,通常处于网店的顶部,全局导航里集中了网店用户会用到的主要功能。

因为全局导航的高曝光率(网店的每个页面都会出现)因此通常这里出现的内容并不单纯和用户目标相关,它还和企业的商业目标相关,例如:某些重点业务的用户访问频率并不高,但是目标页面的业务是企业未来发展的重心,这时也会出现在全局导航里。

全局导航的设计除了保证用户可以快速到达常用页面之外,还有一个重要作用就是可以快速回到起始位置,例如:“首页”,“所有商品结果列表页”。因此它还起到了“逃生仓”的作用。就是当用户迷失时可以随时回到熟悉的信息空间,重新建立位置感和安全感。因此要保证全局导航的设计具有一致性和稳定性:位置一致;形式一致;内容一致。经常变化全局导航会对网店的忠实用户产生非常消极的影响。他们找不到自己熟悉的内容会产生挫败感。

全局导航的内容通常包含:logo,收藏链接,首页链接,搜索;主要经营类目……。

Gap天猫旗舰店的全局导航

Gap天猫旗舰店全局导航在各个页面的应用

局部导航(Local Navigation)

局部导航是用户在网店的某个信息空间内的活动需要用到的重要入口,局部导航反映的是真实的内容结构,通常它支持:返回父级目录,进入子级目录,在同级目录间跳转三种类型的行为。

网店内部的局部导航通常是店铺左侧边栏的商品分类列表,商品分类为买家提供了按照类目筛选商品的途径,买家通过不同的分类维度以及排序方式来筛选自己的目标商品。

 

分类维度包括:

按更新时间维度

按商品品类维度

按风格维度

……

情景导航(Contextual navigation)

情景导航,又叫上下文导航,这种类型的导航通常存在于描述性的文本或图片链接中,跟当前内容密切相关,但不存在逻辑关系。

如以下截图,截自黑色短裙的商品描述页面,在对黑色短裙进行展示的时候,同时提供了相关搭配商品(衬衣),和类似商品(同款红色短裙)的链接。这种导航元素就属于情景导航元素。

 

其它导航元素

面包屑

面包屑是用来确定用户在网店中所在位置的一种重要的导航辅助工具,这个名词来源于格林童话中《糖果屋》的故事,故事中的主人公为了避免在森林中迷路,在沿途洒下面包屑作为回家的线索。

如下图:淘宝的搜索结果列表的面包屑导航

面包屑导通常在页面顶部水平出现,一般会位于标题或页头的下方。它们提供给用户返回之前任何一个页面的链接(这些链接也是能到达当前页面的路径),在层级架构中通常是这个页面的父级页面。面包屑导航提供给用户回溯到网店首页或入口页面的一条路径,首页>分类页>次级分类页……

网店内的面包屑导航

淘宝平台目前尚未提供商品详情页的面包屑导航功能。

但是商品详情又是绝大多数店铺的主要流量入口,因此如果商家在商品描述页面能提供面包屑的导航路径,对买家确定自己在当前店铺的的位置感和方向感将有很大帮助。