Daisywonderland

疲惫生活的温柔梦想
为自己造一个世界
世界里编织着文字·音乐·阅读
更有美食·运动
这些最好的解药
疯狂的去相信美好 活在美好里
人生最难得的是复杂之后的简单
-那就用一杯水的单纯,面对所有一辈子的复杂;

无线U递组:

概要: 商业地点以地图可视化的方式也许看起来比简单的列表展示形式更吸引人,但以地图展示地理位置的方式在移动设备上暴露出太多的可用性问题了。

 

查找地点和获取方向是移动端的用户最常用的功能。用户能够更快捷方便的通过移动端网页和应用来找到贵公司或门店的位置,对你生意能否成功起到关键的作用。在找方位上的困难会导致移动端用户转而使用你竞争对手的软件和服务。就算用户坚持使用你的软件来找位置,他们反复的操作和不良体验也会增加你的金钱成本,例如客服咨询量的增加,而这本应该是你的软件就应该解决的问题。

 

通过近期我们对门店查找和定位的移动端软件的可用性研究(这是关于我们之前对于桌面端网站定位软件研究文章的续篇,之前的这篇文章已经被放入电子商务体验设计指导原则的文章体系中),一个重要的决定商业位置是否难找到的元素就是:在设计中是否显性化的在搜索结果页中展示了一个交互式的地图,或只是一个搜索结果列表。然而问题是专门的地图软件都比较好用,但嵌入在移动版网页里的地图通常都很难操作,并且也没有很好的区分搜索结果之间的相互区别来帮助用户快速做出选择。

 


问题一:滑动触屏时关于地图被平移的困扰

 

在搜索结果页的交互式地图通常都位于整个移动端屏幕的下半部分,并且是延伸到整个当前屏幕的最下端的。这就造成了一个主要可用性问题:当用户试图想向下划动整个网页时(用户想看下位于地图模块下面的搜索结果的列表信息),他们会发现不可避免的在操作着地图内部的移动功能(而不是整个页面的向下划动)。这就出现了划动屏幕时在功能上的歧义,这块儿我们在之前的平板设备的手势问题iOS7的问题事项中都有提及。

 

当用户想在移动端划动页面时,他们通常会在触屏的下半部分划动:因为这样可以使划动的动作最大化,并且跟据用户手持设备时的状态来看,这个位置也是用户在划动触屏时最舒适的位置。通常,这个动作会使得地图里的位置和内容上下移动,而不是整个页面包括地图的模块向上移动了。

 

Coffee Bean & Tea Leaf这个移动网站在搜索结果页展示了一个交互式的地图,并且在这个地图模块的下面放置文字方式的搜索结果列表。在我们的可用性测试中,用户发现要通过向上划动来跨越这个地图来看到文字性的搜索结果列表是很困难的,他们觉得宁愿这个页面只显示搜索的结果列表。


如上图,这个地图的位置造成的问题是:当用户本想划动整个网页时,却不小心造成了在地图模块里面的移动。这种不可跨越地图的设计方式(指地图的宽度为整个屏幕的宽度,从未没有在屏幕边缘留有任何空间)更加加剧了这个问题,即如果地图模块的两边如果有留白的话,用户还可以通过划动两边的留白区域来划动整个网页。

 

一个可以减轻上述手势歧义的方法就是在地图模块两边给予留白,而不是让地图的宽度延伸至整个屏幕。这样的话用户就可以通过划动屏幕下半部分地图两边留有的区域来向下划动页面。或者页面可以在地图模块的顶部提供一个显示或隐藏地图的链接,就像下图Whole Foods做的,这样可以使得用户绕过地图来查看搜索结果列表。



如上图所示,位置搜索的结果页面上展示了展开和隐藏地图的功能,所以对于那些对地图不感兴趣的用户就可以直接去看列表模式了。

 

 

问题二:地图的位置点的展示不符合触控目标原则


手指在触屏界面操作的精准度远远不如电脑端的鼠标光标。当一个地图呈现在小屏幕的时候,搜索结果在地图上的位置点通常会重叠在一起,而原因是系统没有展示合适的比例尺。当想点击的目标元素都聚集在一起的时候,用户根本无法精准的选中某一元素,因为用户的手指相对来说很大,所以很容易一下子不小心触碰到多个位置点。


如上图所示,搜索结果页面的地图上重叠的标记图标太小和密集了,对于手指比较粗的人来说点击起来的准确度是非常低的。

 

Redfin,一个房产类的应用,尝试着解决标记图标太密集的问题。他们通过把同一区域的几个标记物聚合成一个单一的标记图标,同时在这个图标上显性化它包含的标记物数量。当用户去触碰其中一个标记图标时,地图会进一步缩进和放大,来展示具体的代表位置点的标记物。如果地图缩进放大后还是太密集了,也有可能出现含有数量的标记图标和具体的标记物同时存在。这种展现方式确实会减少默认看到的标记物数量,但对于大多数用户来说是迷茫的,所以不应该被采用。


如上图所示,当用户搜索住址时,会出现带有数字的标记图标。当这个图标被触碰点击时,这一区域会被缩进放大,并且用户或许会看到房屋的标记物和带有数量的标记图标同时存在的状态。


 

问题三:地图操作起来速度很慢又不准确

 

因为移动用户的使用场景通常都在外面,他们必须面对各种网速问题。一个很慢的网速会造成当用户移动地图的位置或者放大地图时,地图没有给予反馈。因此,当用户尝试在这种情况下操作地图时,他们经常会过度的放大地图或是移动位置时移过了头,而这都是因为网速慢操作地图时很卡,导致用户重复操作造成的。而这样慢的网站相应时间造成了用户不仅找不到他们想找的位置,同时还会让他们感觉对当前的界面已经失去了控制。当这种情况发生时,用户宁愿放弃对地图的使用,转而去看列表模式,或者被迫重新提交搜索请求。

  


结论:地图是都还值得用?

 

我们的测试用户经常会说他们进入搜索结果页面时希望看到地图的存在。然而当他们试图通过地图来选择地点的时候,上述陈列的缺点会让他们感到焦虑同时使他们在这个简单的操作上花费了更长的时间。这也是一个典型的例子来解释为什么在研究可用性问题时我们不要仅听用户说了什么,更要去关注和留意他们做了什么。

 

对于在移动端网页设计不包含地图的搜索结果页,没有一个用户会主动说他们希望有个地图模块。只要在结果列表中有显性化的“距当前的距离”这个指标存在,用户是很希望直接看搜索结果列表的。用户仅希望在详情页可以看到相应地图,或者是找方向时需要地图的功能。因此,对于移动端的网页来说,地图在搜索结果页是完全可以不展示的。

 

但在移动端的应用软件上,提供从列表模式切换到地图模式的功能是很有必要的,但前提是默认显示列表模式,因为这种模式提供了更多的信息量可以帮助用户做更好的选择(而不是在地图上还需要点击标记物图标来展示进一步信息),同时也会使得用户更加快速和容易的做出选择。就像一个用户所陈述的:如果软件显性化提供搜索结果列表的话,会比看地图更加有效。所以只要在搜索结果列表中提供了最近位置点的排序列表,它所带来的帮助会比在我脑海中徘徊可视化地图要好很多。



原文地址:

http://www.nngroup.com/articles/mobile-maps-locations/


译者:

1688事业部/交互设计师/王冠世

阿里云UED/交互设计师/ 戴艳


校对:巫俊岚




上一篇 下一篇
评论
热度(3)
©Daisywonderland | Powered by LOFTER