当前位置: 首页 > 科技观察

一篇二会|搜索功能模块设计

时间:2023-03-15 16:56:26 科技观察

用户在使用产品和享受功能服务之前,首先要学会如何获取产品中的信息,而获取信息的入口就是搜索。新用户只是简单的浏览和消费内容,而老用户对搜索的需求会越来越高。用户从刚接触产品到经常使用产品,最终成为忠实用户。一个搜索功能分为前后端,复杂的搜索功能还有算法介入。由于搜索是用户集中且必经的路径,因此很多产品经理会将搜索作为广告转化入口的落地页。以下是搜索功能背后的逻辑和用户路径。▲从上图可以看出搜索功能的逻辑。在不同的产品形态中,用户在搜索功能中显示的结果是相同的。但在操作、逻辑和功能复杂性方面存在差异。例如,APP和PC显示的信息量有很大差异,用户操作也有很大差异。手指与移动终端的交互需要更大的区域,而鼠标可以进入较小的区域进行操作。不管是什么产品形态,产品经理也需要抓取用户搜索下的场景列表。这里我分4个部分来解释。一个搜索功能只要满足这四个部分,就是一个简单实用的搜索功能。搜索功能场景:用户在使用搜索功能时,会出现3个场景,4个纬度:搜索前、搜索过程中、搜索结果页面、搜索数据记录。它们分别对应:提问、寻找答案、阅读答案、系统记录。▲搜索下的用户场景app,PC端的搜索前端设计下面是如何完成各个表单的简单设计。APP前端设计:APP中的一次搜索也会有前三种场景。1.搜索前的场景是解决用户如何高效的提出问题并解决问题的场景。搜索入口是用户进入搜索的关键,同时适当地为用户提供搜索关键词引导。搜索入口分为:直接展示型、功能商店型、独立标签型、特殊型。以下图中的亚马逊为例。搜索功能以输入框的形式直接显示在屏幕上。这是最常见的设计方式,也是大型电商应用通常采用的形式。功能布局如下图以虾米音乐为例。与功能暴露型类似,只是搜索功能弱化为图标,点击后展开为搜索框。IndependentTab,以下图中的Snapguide为例。它是最重要的搜索功能形式,许多应用程序将其命名为Discover或Explore。除了基本的搜索功能外,这个选项卡还增加了很多操作内容。特殊类型,以下图中的Airbnb为例。搜索功能会以图标的形式放在页面中间,在Android设计中经常以FAB的形式出现在屏幕的右下角。▲4种搜索入口以下案例直接在搜索功能中提供引导部分。对于新用户,可以在搜索页面添加toast引导,或者直接添加固定的搜索导航栏完成引导。▲搜索引导导航栏部分▲微博预搜索引导如果用户有历史数据,也可以根据数据维度提供搜索引导,增加用户搜索转化。或者在运营中推广相关的搜索关键词▲根据用户习惯搜索关键词2、搜索中的这个过程是为了快速匹配用户想要的具体内容,减少用户输入的痛点。在搜索中,用户正在输入内容,有些产品会在用户输入的上下文中提前显示搜索结果。比如在百度搜索中,提前判断用户需要的搜索结果,可以降低用户查找内容的时间成本,同时在系统中快速匹配到最合适的搜索答案。提供基于实时用户输入的搜索结果需要数据和系统架构的支持。这不仅是产品经理的产品设计问题,也是业务需求和用户规模需求的问题。▲输入中的用户指南在app中,具有自然的系统体验优势,因此可以为用户提供单独的搜索内容输入页面;但在搜索时是切换到单独的页面还是直接显示在搜索输入框,其实需要产品经理根据用户画像和用户需求来决定。但在简单的设计中,我建议不要纠结,选择任何方案即可,因为重点是提供内容搜索的入口。▲搜索页面和搜索输入框在搜索框中输入适合短内容搜索,单独的搜索页面适合长内容搜索。3、搜索结果页内容筛选和重要信息展示成为该环节产品设计的重中之重。例如,搜索结果的排序、关键字的匹配、同时搜索的内容类型的分类也很重要。▲搜索结果页例如搜狗、今日头条的搜索结果页,先显示内容分类,再显示结果顺序。同时,匹配的关键字在结果中高亮显示,方便用户对搜索结果进行筛选和搜索。搜索结果也应该根据内容的类型单独设计。比如视频的搜索结果,比如抖音的搜索结果页,会直接播放短视频;简书和知乎上的搜索结果页面都是根据文本内容的特点做搜索关键词的匹配,然后匹配内容类型。默认情况下,首先匹配所有内容类型。▲视频内容搜索结果页面▲简书和PMTalk搜索结果页面设计在网页端。在网页端搜索是因为PC的屏幕比较大。与app搜索前、搜索中、搜索后相比,三个场景会有所不同。巨大差距。1、搜索前,和app一样,目的一样是增加搜索的点击和转化率,所以一个常见的产品设计方法是增加搜索引导。▲图片搜索引导设计文案引导,增加活动文案,将搜索内容的优势暴露出来展示活动。2、搜索时在PC端有足够大的操作显示区,可以直接在搜索框中显示搜索内容的答案。如果有数据和系统架构支持,可以实时展示结果。和app一样,搜索需要高亮显示搜索中的交互状态,包括按钮点击状态、内容输入状态、内容清空状态。3、搜索结果页搜索结果页仍然以展示重要内容、快速信息过滤、简单内容展示为主。由于PC端面积大,可以显示的结果数比app多;但是当没有结果的时候,页面体验会变差,这就需要产品经理来设计了。4、数据采集的搜索功能还是需要埋点的,方便搜索的数据迭代需求。同时,我建议在产品逻辑上,建立一个每次搜索收集用户数据ID的机制。例如在搜索前建立用户登录和注册条件判断,用户登录后才能使用搜索功能。▲搜索背后的数据关联设计搜索系统有词典和内容索引库(数据库),词典中的词与内容索引库关联匹配。当用户输入一个关键词时,如果该词在词典中存在,则可以快速在线调出内容文档。如果字典里没有这个词,那么这个搜索行为就没有结果。假设内容索引库中只有3个内容文档,分别是:doc1:站内搜索从0到1的全流程设计doc2:如何设计搜索才是正确的方式doc3:如何开始使用产品?如何设计站内搜索”,分词后,如果词典中有这个词,系统会调出对应的索引文档。索引库如下图所示。▲搜索结果背后的数据和用户每次输入的关键词都被记录为高频词。后台可以收集词的范围和非法词的处理。需要同时统计搜索页面的点击次数、停留时间、访问次数。如果在搜索中加入第三方广告位,搜索还需要通过业务转化来打通。漏斗图和时间直方图展示数据可视化,观察用户使用搜索功能的规律和偏好,进而优化搜索功能。