最近,一些大品牌已经引入了一种新的方法在移动设备上显示了在移动设备上的表现控制,通过将它们放在“托盘”叠加在实际结果之上。这种新的设计方法解决了移动设备上的许多刻面搜索显示的主要缺点:小方面控制在单独的屏幕上放置,这迫使用户更努力地了解方面控制如何影响结果集。但是在理解为什么这是如此,让我们回到面部搜索的基础知识。

面搜索的特殊之处是什么?

分面搜索让用户通过应用全面描述搜索空间的过滤器来精炼一组结果。这种缩小范围对于需要在大型内容集中查找特定内容的用户来说是非常宝贵的。这种类型的搜索在电子商务和旅游网站,以及许多不同类型的文件和媒体收藏中都很常见。面系统包括两个关键元素:

  1. 构造复杂搜索的简单控件:提供熟悉的控件,如带有自然语言标签的下拉菜单和复选框,使普通用户能够将大量结果缩小为满足其确切条件的小集,而无需任何布尔逻辑或查询语法的专门知识。
  2. 同时显示面部控制和结果:同时显示过滤器和结果,便于用户理解两者之间的关系;理想情况下,只要用户选择了一个过滤条件,就可以通过动态更新结果集来加强这一点。

简单的滤波器控件是面位系统中最明显的组件。但是,不应低估同时显示的重要性。在刻面搜索开始流行之前,我们有“高级搜索”屏幕,具有类似的控件,用于创建复杂的搜索查询。介绍了大的差异第一面导航系统是在展示方面控制和结果与此同时,使每个过滤器的效果立即可见。这一创新体现了以下两个方面:10个可用性启发式:提供快速的系统反馈,并为用户提供控制和自由。

在移动设备上显示搜索方面的挑战

分面搜索最初是为台式机和笔记本电脑用户设计的。将这种体验转化为移动设备是困难的,因为让分面搜索对用户如此有用的东西——能够同时看到过滤器和结果——很难在小屏幕上实现。根本没有足够的空间来同时显示完整的方面和相当数量的详细结果。

直到最近,大多数手机设计师都没有尝试过同时显示界面和结果,而是选择将它们放在不同的屏幕上。但是这个解决方案迫使用户导航到面控制屏幕,进行选择,然后导航回结果集,查看选择的效果。手机网站istockphoto.com展示了为手机用户提供多方面搜索的典型方法。结果页面包括一个图标,用户可以点击它来打开facet控件(假设他们可以弄清楚这个图标的含义)。显示facet控件后,用户可以选择不同的过滤条件,但facet选择对结果的影响并不明显,因为:

  • 在此屏幕上显示任何结果都没有。
  • 页面头中显示的文件数量更新太慢。
  • 当用户向下滚动以展开并选择下面的面时,显示文件数量的标题甚至可能不可见。

由于这些限制,用户必须返回上一个屏幕,以了解他们的过滤器选择是否有效地定位最佳结果,以及它们是否已将结果缩小到可管理的大小 - 或者他们可能已应用没有结果匹配的这种限制标准。

iStockphoto.com上的移动搜索结果和facet控件
左图:与许多移动搜索设计一样,iStockphoto.com不会在实际搜索结果页面上显示分面搜索控件。相反,它需要用户导航到facet控件,在这种情况下,通过搜索栏右边缘由线条和圆圈组成的神秘图标。右:刻面控件占据整个屏幕,为了查看其选择的效果,用户必须导航回结果屏幕。

新解决方案:“托盘”覆盖以显示刻面控件

最近出现了一种为移动用户提供面搜索的新方法:在搜索结果顶部以“推出”样式的托盘显示面控件。这种设计允许结果的持续可视性:即使在方面控件打开时,也可以在后台看到有关结果的一些信息。Amazon iPhone应用程序和eBay的移动网站现在使用叠加层在同一屏幕上显示面部控制作为搜索结果。

移动小面托盘覆盖示例
亚马逊的iPhone应用程序(左)和eBay的移动网站(右)最近都推出了一个覆盖层,将搜索facet控件显示在与搜索结果相同的屏幕上。

设计模式的元素

亚马逊和易趣的设计都包含一些细节,这些细节结合在一起可以创造良好的用户体验:

  • 一旦激活,facet控件就会出现在覆盖在结果屏幕顶部的垂直面板中。
  • 结果始终在背景中可见,并且可以在用户进行面选择时看到变化。(然而,在eBay的例子中,用户很难分辨出结果是什么。亚马逊的设计更好,因为用户实际上从后台获得了有用的信息。)
  • 结果的总数总是可见的,即使用户向下滚动了一长串方面。(Amazon通过将标题固定在屏幕的顶部来实现这一点,这样即使facet列表向上或向下滚动,它仍然可见)。
  • 半透明的灰色阴影稍微掩盖了底层结果,并确保facet控件突出。
  • 刻面面板显示在屏幕的右边缘,结果的左边缘可见。(这很有帮助,因为左侧边缘更有可能包含有意义的内容;通过Amazon,您实际上可以看到产品图像。)

(你可能也注意到Amazon和eBay都使用了实际的单词-滤器精炼-作为访问facet的命令,而不是特殊符号。通常用于分面导航的任何标签缩小你的结果,改进,过滤器- - - - - -更容易理解而不是晦涩难懂图标,而且绝对值得额外的空间。)

为什么同时显示结果和方面控件很重要?

在可用性测试中,我始终惊讶于成功的人在立即理解和使用面位搜索屏幕上,往往包括许多不同的元素和控制。只要控件显示得当,大多数人就会跳转到创造和改进他们的查询。即时结果是该过程的重要组成部分,因为它们允许用户在申请错误的过滤器时立即查看,或者应用过度缩小的标准,以消除太多选项。如果您可以立即看到您的行为的影响,则这两个错误都非常容易恢复,但如果没有这种可见性,用户最终可以在繁琐的周期内完成Pogo-stancing.在结果和过滤器之间。

Amazon和Ebay所描述的facet“托盘”方法并没有提供完整的可见性,因为只有一小部分结果屏幕是可见的。但这些创造性的解决方案至少提供了一些施加过滤器的效果的可见性。用户可能仍然发现他们需要关闭并重新打开方框控制,但这种方法感觉更像扩展当前页面的一部分,而不是在不同页面之间来回跳转。

在我们的全天课程中,了解更多关于在较小屏幕上进行视觉显示的最佳方法移动和平板电脑的视觉设计