(翻译)自动完成模式(Autocomplete)

问题概述

  当搜索内容难以记住或易于输错时,用户需要辅助识别搜索[1]。

示例

在这里插入图片描述

用途
  • 当可以采用多种方式输入项目内容时,用于辅助处理不明确问题[2];
  • 用于当输入的信息易于与系统中的某条特定信息匹配时。例如,用户可能忘记如何拼写单词 “Amorphous” ,但他可以输入该单词的前三个字母,然后从自动完成列表中找到该单词;
  • 用于当可以从数量可控的数据集合中提取自动完成词条时[3];
  • 用于当输入速度是一个重要目标时;
  • 用于当输入准确性是一个重要目标时;
  • 用于当项目数量过大或不便于在标准下拉框中显示时[4];
  • 如果想让用户概览所有选项,不要使用本模式。
解决方案

  在用户输入搜索内容过程中给出可能匹配的搜索项。
  本模式基于预测和识别机制,辅助用户进行搜索。用户输入搜索内容时,自动完成功能列出匹配项列表。随着用户输入越来越多的搜索内容,匹配项集合也逐渐缩小。
  允许用户使用键盘方向键、触摸或鼠标点击等方式选择匹配项,使其快速选中搜索项,而不用输入全部内容。本模式的名称来自于系统帮你完成搜索项的输入。如果匹配项集合过大,则应限制显示数量,通常显示10条匹配项。
  如果匹配项数量成百上千,或者上百万条时,应寻找匹配项的最大显示数量。通常最多列出10条匹配项。
  将匹配项集合按相关性排序,把与搜索内容最相关或最相似的的匹配项排在集合的首位,让用户快速找到其想要的搜索项。
  某些自动完成功能将匹配项集合分类成组,例如apple.com网站中就按组组织匹配项[5]。

功能实现细节

  本模式与带标签的标准文本输入框结合使用,用于与用户的搜索内容相匹配[6]。
  当用户输入搜索内容,会显示一组与之相匹配的建议搜索项,随着输入内容越来越多,显示列表也随之更新,也即缩小匹配项范围。
  建议搜索项列表通常直接显示在文本输入框下方,列表宽度与文本输入框宽度相同。
  最好突出显示建议搜索项中的哪一部分与用户输入的搜索内容相匹配,例如“Amorphous”。
  允许用户点击ESC键关闭建议搜索项列表,但如果随后用户输入更多搜索内容,会重新出发自动完成功能。

说明

  本模式能快速输入搜索内容,降低击键次数,避免内容输入错误,并提供输入内容的有效性反馈。它让设计人员给用户准备更多的匹配项列表,且不占用额外的屏幕区域。
  应用自动完成和搜索建议功能,在用户输入搜索内容时显示可能的匹配项,降低了用户的击键次数[7]。
  本模式降低了用户击键次数,提高了搜索内容输入速度。用户只需少量输入即可找到并选择搜索项,包括烦人、冗长和复杂的搜索,例如电子邮箱地址、机场名称等。
  搜索建议的附加格式可以消除歧义。如果我搜索伦敦的机场,附加格式让我区分选择的是Heathrow 机场还是Standsted 机场[8]。
  自动完成功能提供了一个反馈循环,不断地让用户缩小正确搜索内容的范围
  采用本模式,用户不用记住准确的搜索内容,只需输入其想到的内容即可,减轻了认知负担。如果用户正在搜索电子邮箱地址,但只记得域名,此时只需输入域名,就会列出所有包含该域名的电子邮箱地址让用户选择。
  本模式依赖于认知而不是回忆的原则。用户不必回忆起完整准确的搜索内容,只需键入其想到的内容,然后识别最符合的搜索内容。[9]

讨论

  基于数量巨大的数据进行匹配时,关键在于列出的匹配项要尽量接近用户想要的内容[10]。
  Google解决上述问题的方法是根据每个匹配项的历史搜索次数进行排序,而Spotlight软件(Apple的一款用于项目搜索的计算机桌面应用程序)中的解决方法是根据每个匹配项能搜到的项目数量进行排序。[11]

原文地址:http://ui-patterns.com/patterns/Autocomplete
[1]原文:The user needs recognition aided search when performing search tasks that are difficult to remember or easily mistyped.
[2]原文:Use to assist with ambiguity-issues, when an item can be entered in multiple ways
[3]原文:Use when autocomplete suggestions can be pulled from a set of data that is manageable in size.
[4]原文:Use when the number of items would be too large or inconvenient to display in a standard drop down box.
[5]原文:Some autocomplete implementations group matching items into categories. On apple.com for instance, matches are organized by groups.
[6]原文:The autocomplete pattern is used in combination with a standard input text box that is labelled to match the user’s expectation of what field will be searched against
[7]原文:Autocompletion and search suggestions save the user keystrokes by matching a user’s query with potential matches that are displayed as the query is being typed.
[8]原文:Additional formatting of a search suggestion can help remove ambiguity. If I am searching for an airport in London, extra formatting can tell me whether I am selecting Heathrow or Standsted airports.
[9]原文:The autocomplete pattern relies on the principle of recognition over recall. Instead of having to recall a full and exact text query, the user can start typing in parts of the query he or she recalls, and in turn rely on recognition to select the best match.
[10]原文:When matching on large sets of data, it is critical for the matches presented to be close to what the user is looking for.
[11]原文:Google solves this problem by ranking matches by the amount of times each query has been searched for. Apple solves the problem in Spotlight (a desktop application for searching items on the computer) by ranking matching items by the amount of times an item has been selected when that exact query was entered.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值