AR在电商设计中的应用
AR在电商中的应用相对较新,因而必须易于发现且易于学习。校准问题非常普遍,用户必须全神贯注地与该陌生的功能进行交互。
随着越来越多的公司将AR(增强现实Augmented reality)功能集成到其网站和App中,AR正在慢慢地变成主流。一旦确定AR工具很有用,就必须进行周密的设计以确保可以成功使用它。
为了揭示AR功能在网购中的可用性问题,我们进行了一项有10名参与者的移动远程主持的研究。在这项研究中,我们专门研究了电商中的AR功能,旨在了解购物决策。这项研究包含了各种移动网站、App、可增强用户外观的虚拟试穿的AR工具(通常使用设备的前置摄像头或网络摄像头)和通过将物品放在用户环境中来增强用户的周围环境的“在房间内观看” 的AR工具。尽管这些功能在用例上稍有不同,但我们的大部分发现都适用于两种类型的AR工具。
PART1. AR的可发现性
因为AR是一项相对较新的技术(最初用于游戏),所以大多数用户在浏览产品时都不会主动寻找它。由此,如果存在AR工具,那它就必须非常容易被用户发现。它还应该清楚地传达它是什么,以及用为什么用户应该与它交互。
1.1 在何处以及如何推广AR
当第一次登陆网站或App首页时,许多用户会浏览该页面,查看促销和精选新商品,或者好好了解该网站是提供什么的。大多数网站并未在主页上推广AR功能。Warby Parker的网站是个例外,它在屏幕底部显示了一个浮层,以便推广App中虚拟试戴镜框的功能。这个浮层会出现在所有页面上,直到被用户关闭为止。

只有当用户无需离开AR工具的情况下浏览多个产品时,在App的主页或主界面添加到AR工具的链接才能发挥最佳效果。例如,Ulta App在主页上推广了几个虚拟的试穿工具,所有这些工具都允许用户浏览并尝试多种商品,而无需离开AR体验。
此外,启动AR工具的召唤用语应具有足够的描述性,这样当用户随后被要求获得访问其设备的相机的权限时,就不会感到意外。显示人脸图像和“试穿”一词通常是有足够强烈的暗示。相反,在Ulta App页面的上方,指向粉底色块匹配器的链接只在手机上显示了一个色块的图形,当该应用程序请求相机权限时,参与者感到很惊讶。

在我们研究中,只有一个网站Kendra Scott,在商品列表页面上推广了珠宝试戴AR功能。在商品列表上方显示为banner,我完全希望参与者由于广告盲区而忽略它。但是,令我惊讶的是,它被发现并引起用户兴奋。一位参与者立即看到banner,并说:“新的虚拟试戴,实际上很有趣。我从未见过戴耳环的虚拟试戴。” 遗憾的是,许多商品无法使用AR功能,这很快让人失望。“这个网站说可以试戴,但是我在整个网页上选择了第三受欢迎的耳环,AR功能并不可用。”因此,我明白,如果他们不是每个商品都能使用AR功能,但你会认为他们的前20或50个商品,你可以有这样的选择。” 因此,只有当你的AR工具可用于许多商品,或者至少适用于最受欢迎的商品时,才可以使用这一策略。

一旦参与者意识到存在AR选项时,他们最希望在商品列表页面上看到的是那些可以在AR中查看商品的视觉标识。参与者很快注意到AR中并非所有项目都可用,但是如果不访问每个商品的详情页,他们将无法知道哪些可用。例如,使用Etsy App的参与者抱怨说:“上面说带有这个图标的项目你可以虚拟地查看,但是你必须点击每个项目才能知道它是否这样做。当你滚动列表时,它不会告诉您。那有点烦人。”

在商品详情页,当AR功能出现在商品图片附近并使用清晰的文本标签(例如在AR中查看它,在您的空间中预览,在房间中查看或实时试用)时,AR功能最容易被发现。尽管一些参与者将AR 3D框图标识别为与使用相机查看周围的项目相关联,但相机图标似乎也可以启动作用。请注意,一些参与者根本无法识别AR立方体图标,因此它绝对不是通用图标!当被问及那个图标是什么时,一位参与者说:“我认为它看起来像一个立方体,就像一个3D立方体……但是……如果我不去使用它,我就不会知道。” 与往常一样,将图标与有意义的文本标签配对时效果最佳。

相较于使用哪个图标,AR按钮的突出位置和有意义的标签更为重要。例如,雷朋移动网站产品详情页上的纯文本“试用”按钮效果很好,并且受到用户的注意和理解。不要创建一个完全自定义的图标,因为它们可能会引起用户的困惑和误解(并且不会对采用标准的AR图标有所帮助)。不幸的是,在使用增强现实功能之后,雷朋网站将其直观的文本按钮替换为不清楚的切换按钮。这项研究的参与者不确定未标记的图标代表什么,并且不得不来回切换几次才能意识到其含义。

当用户首次在App上访问商品详情页时,通常会提供提示或新手指引层来凸显R功能。尽管弹出式窗口经常是有问题的,但由于AR是一项新的意想不到的功能,因此参与者很乐于接受中断并愿意了解它。另外,在切换页面等待直到出现商品详情页显示提示是适当的,因为用户随后可以立即尝试该工具。
但是请记住,用户可能会在没有阅读里面的文本的情况下迅速关闭弹窗;如果他们这样做,就没有简单的方法让他们再次访问该信息。例如,令Etsy App的参与者感到失望的是,该提示只出现一次,并且由于AR图标与背景融为一体很容易被忽略。她评论说:“他们应该给出更多提示,因为像我这样的人认为他们知道一切,他们会错过机会。……我认为这是一个非常酷的功能,我只是不知道要去发现它。” 另一种依赖提示弹出窗口的方法是让按钮本身更突出(如前所述),或者考虑有目的的动画(如果功能值得吸引注意力的话)。例如,当用户第一次进入产品详细信息页面时,Warby Parker App显示了一个简短的动画,介绍了虚拟试穿功能,标示了页面内容可通过下拉打开AR工具。

1.2 平台之间的无缝过渡
将AR功能集成到主要的浏览网站或应用程序中,使AR功能在购物过程中随时可用,同时也能增加用户发现和使用它们的可能性。也许由于技术限制,我们研究中只有三个网站允许用户直接在网站上使用AR功能——而其他网站只是广告宣传AR可用,但需要下载App。不管怎样,切换平台的过程远非无缝的——只有一家网站通过下载并安装该App,正确地将用户从网站的商品详情页导航到APP的同一个商品页面。

相比之下,某些网站仅提供了一个通用链接,告诉用户需要下载该App才能够使用AR功能。启动后,该应用程序仅打开了首页。此外,通用应用促销活动导致一些用户直接跳过链接,直接到应用商店寻找应用,从而消除了无缝导航到特定产品的可能性。(尽管如此,这些一般性的链接可能比那些似乎是某一产品的特定链接更具有误导性,但事实并非如此。)例如,Interior Define移动网站上的商品详情页上展示了一个促销活动(一些参与者完全忽略了这个活动,因为它位于页面的非常低的位置),让你在家里使用AR应用就能看见这件作品;这种推广具有误导性,因为它迫使人们在应用中重新定位产品。
更糟糕的是,一些参与者随后沮丧地发现,他们在网站上看到的沙发甚至无法在app中使用!浏览app后,重新访问手机网站查找商品名称,返回app直接搜索商品名称,一位参与者放弃了,并说:“显然,我找不到我感兴趣的那个项目,这有点令人失望。” 不幸的是,该问题不仅限于Interior Define,似乎在专用AR应用程序(其主要功能是就地查看商品的应用程序)中很常见,而不是将AR功能集成到主要购物应用程序中的应用程序。
PART2. 使用AR工具
让人们使用这个工具只是AR功能战役的一半。一旦用户意识到它的存在并有动力去尝试它,他们就需要能够使用它来完成他们在其预期环境中设想物品的目标。
2.1 校准是陌生且困难
启动AR工具时要克服的第一个障碍是校准。这个过程往往很困难,对于用户来说,部分原因是它太新、太陌生了(部分原因是技术需要改进)。
人们通过重复来学习,是由于他们没有很多过去的经验可以借鉴,他们不知道校准应该如何工作,以及如何最好地完成校准。如此,校准需要有帮助的、清晰的指导来教人们该做什么,并在整个过程中指导他们。
与用户场景相适应的分步说明,最适合指导用户进行校准。Etsy Appz中的AR功能在校准时提供了清晰的帮助内容,指示用户“扫描整面墙,包括其与地板和天花板相交的位置”。指定相机视图中包含的内容非常有用,否则用户将不知道要显示什么。一旦校准成功,说明将继续告诉用户点击以显示该条目。

一般的帮助说明没有反映用户当前的问题,这是没有帮助的,而且可能会使糟糕的情况变得更糟。几名参与者努力校准Best Buy AR工具,并在提示继续之前放弃了。最主要问题是对“移动更近”的重要指示,这导致一些人最终用手机触碰墙壁,试图沿着这个方向移动。
“这比我预期的花费了更多的时间。所以,我不知道该怎么办。上面写着靠近。我正在这样做,但是,好的。这实际上有点令人困惑。”
“那是一次非常不愉快的经历。我不确定需要我做什么。它一直说靠近,靠近,直到我几乎要碰到墙。在那种情况下,如果你那么近,你将无法真正看到它在空间中的样子。”
“移动更近”指令也直接与后面的提示矛盾,后者提示摄像机视图需要在墙上包括焦点(从更远的地方可能更容易获得焦点)。此外,一些参与者将此提示解释为意味着他们需要在相机的视野中举起一些东西,这是很难平衡的,也是无效的。

这些校准难题的例外是虚拟试戴工具。这不仅是因为脸部轮廓比空白墙更容易探测,而且由于Snapchat和Instagram等社交媒体平台上的各种自拍镜头和滤镜,用户更熟悉人脸。
一位参与者对Warby Parker应用程序的校准速度印象深刻,并指出:“哦,哇,这很容易做到。它自动找到了我的眼睛。我还以为需要给它定位,但它会自动找到我的眼睛和鼻梁的位置,哇,非常容易,非常有用。”

2.2 需要集中注意力
与AR工具进行交互是一项复杂的任务,需要用户集中注意力。人们把大部分注意力都花在AR视图和屏幕底部的任何chrome浏览器上。因为人们希望在此底部区域找到有关他们正在查看的产品的详细信息,与UI元素进行交互以更改商品的颜色或尺寸,选择新商品或找到其他相关工具,所以用户倾向于选择性地专注于该商品而错过了 AR视图顶部提供了其他功能。(通常,与复杂事物进行交互使用户更有可能错过屏幕外围可能有用的工具,这一发现也得到了我们对以下问题的研究的支持:使用交互式地图存储定位器。)
例如,当询问Warby Parker的移动应用程序的参与者如何对她感兴趣的一副眼镜产生第二意见时,她使用相机按钮进行了屏幕截图,而不是AR工具右上角的照片功能。 她后来解释说:“我不知道它有这个;它已经具有截图功能。我只是没有注意。它在右上角。……我想我看起来比向下更多,而那些东西在顶部,也许我只是没有注意到。……因为我要做的第一件事就是戴上画框,然后往下看,我在看描述。”
同样,一名使用Ulta手机应用虚拟试用工具的参与者一直在寻找一种完全卸妆的方法,而不是选择不同的颜色。当她几乎放弃时,她终于发现屏幕顶部出现了一个列表功能,允许她查看她所选择的所有产品,以及删除特定项目的功能。她说:“哦,你知道吗?我只是注意到顶部……一直以来,我都没看这里的顶部。现在我看到上面还有更多。现在穿着,好。……你可以在屏幕的底部一直玩,这一事实吸引了太多的眼球,以至于我并没有真正注意到顶部的图标。”

有时,这种对AR工具底部区域的关注,意味着参与者也忽略了主相机视图内的更改。例如,几名参与者在Best Buy上购买电视时,注意到AR工具中的标尺图标,并单击它以查看测量结果,但对它似乎仅在屏幕上添加定价信息感到失望,他们没有抬头,在AR视图中可以看到测量结果!一位与参与者说:“这不是我所期望的,我期望尺子出现。可以显示一些尺寸,比如长度和宽度,而图片下面只显示了价格。”

在这种情况下,更好的解决方案可能是,只将测量值添加到AR主视图(以及显示按钮被选中的视觉反馈),这样用户就可以继续查看屏幕,以发现发生了什么变化。添加不相关的价格信息和“添加到购物车”按钮会分散用户的注意力,让他们认为这是该按钮的主要功能。
结论
AR是一项令人兴奋的新技术,有潜力成为电商的有用工具。随着越来越多的网站和APP开始利用它,它将逐渐变得越来越令人期待,并且用户将学习如何使用它。在此之前,必须非常谨慎地确保AR功能具有高度可发现性、清晰的解释、简单的校准和易于交互。














































































