[思考]设计更好的搜索功能

>搜索功能作为寻找目标内容的快速入口,存在于很多的应用当中;在不同的使用场景下,搜索功能也变得更加懂你。这篇文章将谈及搜索的适用范围,功能细分,和其他部分闲话。

基础形式

就我个人观点而言,搜索是一个非主要功能(不涉及独立搜索,如Google、Bing等),临时的中间态,用户不会在这个操作上长时停留,应该尽快前往目标内容,搜索过程就像游戏中施放传送时的施法吟唱。

在web/pc平台上,大都是以 input+button 或 search icon的形式存在于界面上,如下图:

在移动端上,也会是search bar的形式存在,而且大部分会处在操作较少的上半屏区域,搜索功能作为对内容的补充,是一个用户操作动机较强的功能,大多数app都是滑动向下浏览,上部的搜索不太容易干扰到用户的操作,实际中也会根据产品自身对搜索功能的定义,做出一些差异性的设计(例如作为tab项加入到bottom bar中去)。

接下来会通过搜索操作的过程顺序,分析个中的设计方法。

一、搜索框的默认状态(default)

即使你不去使用搜索功能,一个搜索框也会默认的传递出一些信息。常见的方法就是在输入框中默认放入一些灰字内容。

1.在搜索框中放置用户先前搜索过的相关词,方便用户对之前的搜索内容进行二次浏览,也会添加搜索词云的交替呈现形式,增加多搜索词的曝光率。

例如天猫就会根据我之前搜索的搜索词(红枣),默认显示脆枣,脆冬枣,冬枣等相关词,刺激感兴趣的用户前去了解,进行操作。

通过相近搜索词引导用户搜索

2.在搜索框中放入近期活动信息,增加用户对活动的参与度,这会有平台或企业近期的运营策略相关,作为一个用户了解参与的活动入口。

例如京东为了推广年货节,引入了灰字吸引用户搜索了解内容。

3.引入搜索类型提示,用户对一个宽泛的搜索框,可能会各种不同的搜索目标,通过加入灰字对搜索词类型进行说明,可以减少一些没有结果的搜索操作。

例如知乎对搜索类型进行了说明,告知用户搜索类型为问答、文章、话题和用户。


二、触发

在用户激活操作,还未输入时的状态,这时会给用户提供一些能够帮助他们快速搜索的辅助信息,依然是前往搜索内容的加速器。

1.提供搜索记录和当前热搜,搜索一些当前的热点和之前搜索过的内容,都是去提供一些可能性来与用户心中的搜素目标进行匹配,就像是“你到了餐厅坐下来,服务员向你介绍了一些招牌菜品并询问要不要来份上次吃过的炒菜”,这远比“服务员仅询问你吃什么然后自己去翻菜谱”来的更加方便一些。

例如微博作为热点聚集地,所以在触发搜索框后对话题性内容做出了展示。也会根据平台的差异,调整搜索记录和热点的比例(微博最多只显示两个搜索记录词)。


提供热搜内容的微博

2.对潜在的搜索内容做大类划分,将可能的搜索内容按大类划分,用户自行选择目标类型再进行搜索,对于无关的搜索类型可以在展示页之前就进行过滤。

例如QQ浏览器,用户搜索的内容过于庞杂,一个大类的划分可能会提高不少效率,就像搜索一部电影名称,结果可能是包含新闻、影评、海报、视频等多种类型,过多的内容交织,采用这种方法可以减少用户的筛选工作。

对搜索内容提供预先划分

3.提供其他搜索方式(语音、拍照),搜索的使用场景非常多样,单纯的文字输入不太能够覆盖到所有场景,我可能在不方便打字的时候使用语音搜索,或者在不知道该如何描述的时候拍一张照来搜索是什么。

例如天猫在触发搜索,会提供拍照搜索和语音搜索的功能。

提供拍照和语音的搜索方式

4.识别剪切板内容,这一类的识别较为特殊,抓住的还是:复制->粘贴->搜索 这一较高频率的搜索过程,但是因为剪切板中的内容会很多样,盲目的识别再让用户取消就有点多此一举了,所以QQ浏览器中会注意识别是否为地址字段,猜测用户可能会选择前往(好像某段时间也能识别短时间内的新图片,后来拿掉了)。

这里的搜索识别了我剪切板中的Bing地址

三、输入

到了输入过程的时候,设计的目标依然是以降低用户搜素成本,尽快离开前往目标内容。

1.实时模糊匹配,从用户开始输入第一个字的内容后,就开始相应的匹配,通过罗列出一些可能的搜索项来帮助用户快速前往。这里还会存在两点需要注意的内容,就是匹配内容的界定和对匹配信息的递进。匹配内容的界定可能会按照“当前用户的搜索频次”和“之前的搜索内容关联度”进行处理。对匹配内容的递进,不仅是在罗列项中的上下顺序,还有对搜索内容详细程度。

例如高德地图,会在匹配词越多时,提供更详尽的匹配词信息。望京公园的信息,在搜索词从“望京”到“望京公园”的呈现不同,匹配程度更高时放在了更上方的位置,并提供了小门和交通信息。

高德地图中,搜索匹配信息的呈现方式

2.按照类型对匹配信息区分,如果上一步没有对搜索的分类,那么可以在匹配结果中进行划分,信息的类型看起来更加丰满和有条理。

例如知乎会按照之前在搜索框内的提示信息,对搜索结果进行分类。

bilibili的搜索结果包含话题、内容等多个类型的匹配分类

四、结果

搜索结果的呈现也是多样化,会根据产品自身对内容的组织来进行设计,列表,卡片都是解决的方法。这里不进行更多的讨论。想要提及的是在天猫中的一个有意思的设计,将搜索结果在样式上标签化,这一交互形式可能是因为,在业务上功能间的冲突而做出的调整,拍照功能和清楚搜索框在摆放位置上的冲突,所以对搜索的关键词做出异化,同样也能方便快速清除,重新搜索,那么这样方案是一个优秀的设计吗?:)

搜索词样式的特殊设计
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,835评论 4 364
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,598评论 1 295
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,569评论 0 244
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,159评论 0 213
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,533评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,710评论 1 222
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,923评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,674评论 0 203
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,421评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,622评论 2 245
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,115评论 1 260
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,428评论 2 254
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,114评论 3 238
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,097评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,875评论 0 197
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,753评论 2 276
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,649评论 2 271

推荐阅读更多精彩内容