火星网校
设计搜索功能，注意7个交互细节
发布时间：2024-07-02 11:42:44 浏览量：389次
笔者将从多款成熟的产品中体验搜索功能，浅谈几点心得体会。
互联网经历了从信息孤岛至网络发言权的解放，到现在解决海量信息在细化后的定向搜索和获利机制的问题，个性化多元化的内容成为互联网的现状。
搜索功能成为每个人获取信息的交互方式，用户对于搜索引擎的依赖逐渐增加，这是属于搜索的时代。
本文将结合实例，介绍符合用户体验的搜索功能应具备哪些因素？未来智能化搜索功能有哪些趋势？
以实际案例分析搜索功能，希望对你有帮助。
一、设计搜索功能的目的
获取信息的便捷性：随着智能手机普及和网络响应速度的提升，用户从互联网中获取信息的途径更加便捷。
解决搜索的低效率：完善搜索功能的目的是提高用户获取信息的交互效率，方便用户从海量信息中精准快速的找到相关内容，解决用户搜索效率低的痛点。
二、不合理的搜索案例
1. 案例
我打开某一个外卖APP，想找找附近有什么好吃的面食，找不到搜索功能，难道我需要从一堆米饭火锅里找面食吗？
我想去看电影，搜地图的时候，搜索框太小了，点错好几次；好朋友推荐了一个视频APP，搜索框没有搜索提示，我搜“励志”“爱情”的视频类型呢？还是搜“耐克”“蓝标”公司品牌呢？
2. 问题
《设计心理学》讲到：
“任何带来不必要麻烦的东西都被冠以‘诺曼’这个名字。当某种产品为‘诺曼门’，实际是承认了该产品的制作者没有关注用户的需求，而这正是我要传达的信息。”
虽然这些日常问题听起来微不足道，但却能够影响你的心情：或者让你心情愉悦，或是令你灰心丧气。
三、合理的搜索具备哪些因素
1. 产品的需求程度与目标用户紧密关联
不同的产品适用于不同的目标用户，此产品设计的所有功能都需要根据目标人群定义，脱离目标人群而设计产品功能相当于闭门造车，对产品设计危害极大。
资深产品经理梁宁讲述经典用户画像时，将用户分为三种典型特征：大明、笨笨和小闲。
- 大明用户对于自己的需求非常明确、非常清晰。搜索需求程度最大，并要求高精准度和高效率；
- 笨笨用户的特征是——我有大概的需求，但是还没有那么明确。搜索需求程度中等，搜索精准度要求不高；
- 小闲用户没有消费需求，就是为了打发时间。搜索需求量最小，搜索精准度和效率要求最低。
2. 搜索框的位置
产品描述：打开产品首页，搜索框位置统一放置在产品上方或右上角。
设计理由：根据目标人群对于搜索需求程度分析，产品用户搜索精准度和效率需求程度高时，搜索框位置应放置于产品上方，并以深色底做高反差对比，强调搜索框位置便于用户使用搜索。
产品用户搜索需求程度中等时，降低搜索框和底色反差对比，但搜索框的位置仍然保持在最上方，便于用户寻找和搜索；
产品用户搜索程度较低时，搜索功能弱化为icon，放置于右上角。
3. 搜索框的UI细节易于用户理解和交互
产品描述：搜索框高度通常为50pt-30pt之间，同时使用“icon”替代“搜索”文字，搜索框右侧放置语音或图片识别的搜索icon；
设计理由：根据苹果的《iPhone人机界面设计规范》，手指最小的点击目标尺寸是44 x 44像素。搜索框或搜索icon的交互区域应大于44 x 44像素。遵循人们习惯从左到右的阅读习惯，搜索icon放置于左侧，方便用户查找。
4. 搜索框增加默认文本
产品描述：美团的默认文本为用户最近浏览或购买过的外卖饭店；高德地图搜索框中的默认文本是搜索框提供的主要功能；即刻搜索框的默认文本是最近搜索热词。
设计理由：搜索功能默认文本的作用是帮助产品为用户解答能搜什么的问题。如果搜索框内无提示语，那么用户使用产品搜索时所产生的困惑和无助感极大可能使产品损失大量用户。外搜索默认文本的设计和产品目标用户应提高关联度。
5. 搜索时留存历史记录和推荐搜索词
产品描述：点击搜索框保留历史记录；同时，页面展示推荐搜索热词；
设计理由：点击搜索框后，保留历史记录，帮助用户在搜索同一内容时快速查看，节省重复输入的体验；为用户增加推荐搜索内容，提高产品相关热词或商品的点击率和购买量。
6. 搜索提示
产品描述：用户搜索时无需输入完整内容，搜索功能实时根据用户搜索词，展示相关搜索内容供用户选择；
设计理由：效率为王的互联网时代，为用户节省时间可以极大的提高用户好感度。此功能比较考验产品优化搜索关联的内容，提高准确率，准确度越高用户惊喜感越高。
7. 搜索容错率
产品描述：搜索内容出现错别字，搜索时基本不会出现错误页面，而是通过产品容错率将用户可能想搜索的内容展示给用户；
设计理由：搜索容错率的最大作用是避免将“错误搜索”或“无搜索内容”等负面状态传递给用户，造成用户使用产品的挫败，疑问甚至愤怒的负面情绪，从而流失用户。
四、总结
1. 搜索功能的变化
如果你在百度搜索诸如“打雷”或是“成龙”等，就会很形象的出现打雷的声音；成龙的个人简介、兴趣爱好、喜欢的颜色和相关人物推荐等等。又比如你上传一张图片至百度，就会自动统计与该图片相关的信息或图片来源。
2. 搜索交互的变化
用户搜索已不仅仅局限于点击搜索框、输入文字点击搜索，未来更多的趋势已逐渐向语音，图像甚至AR等智能化层面发展。
甚至，搜索行为会慢慢从主动变为被动：产品通过去年一年的服装购买行为数据，推算出你今年同一季节可能需要购买的衣服类型，主动询问你是否需要搜索；通过出行记录，主动在下班时询问你是否需要搜索交通路况；很快会出现和平台无关的跨设备检索和数据搜索方式，就像不同的手机应用间可以同步共享联系人信息。
3. 搜索未来的展望
无论未来智能搜索会发展到什么程度，搜索归根到底仍然是和人交互的行为，而和人的交互就需要考虑到用户体验，搜索只是产品中很小的细节，还有更多细节等待我们学习和思考。
本文由 @蓝色弹珠 原创发布于人人都是产品经理，未经作者许可，禁止转载。
题图来自 Unsplash，基于 CC0 协议
想要了解更多关于搜索功能设计的内容吗？欢迎点击点击咨询，我们有游戏设计培训、动画培训、UI设计培训等专业课程等您选择。
热门课程推荐
热门资讯
-
怎样可以提升你的UI设计能力!第一个:站酷站酷想必是设计师都知道的一个网站,里面不止有UI设计的资源,还有其他设计的,不如:平面设计、网页设计、字体...
-
想要了解iPhone6界面设计的尺寸规范吗？这里为您详细介绍iPhone6的UI设计尺寸规范，包括界面尺寸、图标尺寸、可点击高度规范、搜索栏高度规范以及界面元素之间的距离规范。
-
3. 移动端UI设计中常见的5种APP界面类型，你get到了吗？
通过介绍移动端UI设计中的闪屏页、引导页、浮层引导页、空白页和首页等5种APP界面类型，帮助大家更好地了解UI设计的基本知识
-
将为大家介绍12个绝佳的UI设计网站,这些网站不仅可以为你提供灵感,还可以帮助你学习新的技巧,助力你的创意之旅!dribbbleDribbble 是一个面向设计师的...
-
在移动端设计中,列表页和表单页是不可或缺的部分。一个好的列表页和表单页设计能够让用户轻松地获取信息并产生点击欲望,从而提高点击率。本文将为你...
-
对于想要提高自己的设计能力和创造力的小白和UI设计师来说,这本书是一个很好的选择。4.《设计的觉醒》(IKKO TANAKA)推荐理由: 这本书是日本现代平面...
-
7. 史上最全，平面设计UI设计必备的77个国内外素材、设计资源网站
ui设计社区,大神太多了。3、behance: https://www.behance.net/ ,著名设计... 对于品牌设计师来说,除了图案素材收集之外,还有一个很重要的,就是设计故...
-
8. 设计中的色彩心理学:浅析中西方色彩的历史演变与设计应用
摘要:本文探讨了色彩的历史演变和设计应用。通过对色彩在早期文明社会中的实用运用、不同文化背景下色彩观念的差异、色彩在设计中的重要性以及新兴技...
-
想了解武汉UI设计培训班的费用是多少吗？不知道学UI设计要花多少钱？不妨看看这篇文章，了解UI设计培训班的学费价格以及学习内容。
-
探索零基础UI设计培训的时长与薪资前景。了解数字艺术教育领域的专业课程，以及培训后的职业发展机会。
最新文章
