大好，我是Clippp。今天为大带来的章是「搜索」设。可能很多人认搜索设计很简单：在主页顶部设计个搜索框或者搜索图标，可以完成操作。搜索前、、后体验大家有没有仔细考虑过呢？
本文中，将介绍搜索设需了解的内，以及不同App案例中的搜索体验。
搜索产品中不可或缺的一部分，无论打哪App, 我们都能很找到搜索功能。
搜索作为一个功入口，简单的呈现方式对户来说很重要。
搜索设计见的形式有3种:
- 顶部搜索框
- 图标(放大镜)搜索
- 底部搜索导航
从视觉和优先程来看，导航>搜索框>图标。那么每种形式的优缺点是么，又分别在么时候使呢？
1. 顶搜索框
搜索框通位于App页的顶，作为一个大的触摸目标，更容易被户发现和使。
搜索框的组成一般包括容器、预设文字、操按钮。
容器通常填充为白或灰，里面带有预设的产品文案。但是容器什么时用白，什么时用浅灰呢？取决App主页的背。
计准则是始终将容器的颜色页面背景色相对比。拿歌地图和读书相比较，灰色背景下用色的搜索框，反之亦然。
当然也有例外，Airbnb在色背景上就有一个色的搜索框。为什这计呢？
为它搜索框带有阴影，能和背景作出区分，也是可设计法。
预设文作用是提示用户要搜索内容或搜索，告诉用户可以从搜索到什么。
App Store中，预设文字告诉用户可以搜索「游戏、应用、故事」，Messenger中的预设文字只「搜索」，用户提供功能入口。
预设文字内浏览类App中很常见——不仅可以展示拥的内类别，还能结合搜索趋势积极推广门内。
如微信读书的搜索框使最流行的书作为预设字，此容的曝光率，吸引户阅读。
操作按钮虽然与搜索相，但摆放的位置固定。可在搜索框，可在搜索框两侧。
哪图标/文按钮对搜索有帮助呢？最常见的是搜索框中的语音输功能和二码图标。
另外一个的搜索验的关键是能从视上区分与搜索相关的图标。
2. 搜索图标
果一款产品希望用户注浏览内容，或者不需要频繁使用搜索，以采用图标的样式将搜索口放在页面顶部。
例如，在Medium上用户通常是漫无目的地浏览内容，而不是搜索定的主题；Facebook上的用户通常只想浏览朋友的帖，少搜索内容。
3. 底部搜索导航
与前两种形式相比，底部搜索导航离用户距离最近，更容易为接触目标也被赋予更的特。
UberEats通过主页的排序和过滤，帮助用户类兴趣的餐厅，并将搜索作为底部导航的第二个标签，这用户就能够不断和探索新餐厅。
Tiktok也将搜索入放在第二导航中，完整的首页有利于为浏览视频的用户提供沉浸式的体验。
当用户想搜索某个内容，点击搜索框之该做什么呢？App应该何帮助用户搜索？
用户点击搜索框会弹出一个页面，将其定义为「搜索页」。搜索页的目的是让用户做好搜索的准备，对要寻找的内容进行提示，拓宽用户对要搜索的内容的法。
弹出的搜索页帮助产品完成个主要任：
- 用视和互告诉用户已经做搜索的准备；
- 通过页面上的内容提醒用户正在寻找的西，或者为提供可能兴趣的西。
1. 视觉和交互——做好搜索的准备
当我们有一个特定的搜索目标时，我们的注意就会全放在搜索框(或搜索图标)上，如果突然被引导到一个的页面，可会带来零碎的体验。
所以要把「搜索前」到「搜索页」的转换做得更自，让用户感仍在同一个页面上操一样。点击Facebook的搜索图标，图标通平滑的动效扩展成一个搜索框。
无论搜索在什么位置，显示搜索框的不同状态很重要，告诉用户「已经准备进行搜索」。以领英为例，分析一下从搜索前到搜索页面生哪变化：
- 从搜索中返回的方法：取消。这对所的搜索体验都必的，可以使用取消或者返回图标。
- 搜索框改变了填充色。搜索框从灰色变为白色，反映当前搜索操作处于焦点状态。
- 只留下必要的图标。二码能帮助搜索所以仍留，而左边的个人资料图标和搜索图标消失。
- 弹出光标来鼓励用户输入文字。
在某App中，搜索框在「搜索前」和「搜索页」中的位置能不相同，样做的目的是在两种验之间进行平滑的渡。
Google的搜索框向滑动展示搜索内，保证过渡动效的流畅性。
些搜索体验不可能让用户停留同一页面。Airbnb的搜索需一系列的引导将用户转移到一全屏的流程中。
键的地方在于，搜索页面在屏幕中间弹，键盘向上滑，户可通过无缝的交互从「搜索前」平滑过渡到「搜索中」。
2. 内容——提示搜索的信息
历史记录可以帮用户行针对性的搜索，因过去的趣当趣的力指标。
但是只显示历史搜索记录会将用户的注力集中过去的搜索上，而不是保持搜索的最新状。所以除了显示搜索记录外，显示推内容能拓宽用户对潜在事物的兴趣。
关键点1：「没有内容可推」
当一款产品的功能主要是为了让用户完成某个定的任或达某个目标，那它可能就没有动机去推广任何内容。
这类品会显示最近搜索记录，比如Notion是个笔记应用，负责存储用户笔记，此显示过去搜索记录来帮助用户进搜索。
关键点2：「在搜索前推广内容」
有的产品通过将各种内容提供给用户查和探索，为用户实现某个目标。歌地图的搜索框下面有热门的标签，用户可能会从标签中找兴趣的类别。
用户击搜索框后，谷歌会假设用户有特定去处，专注于帮助他们到想去地。
关键点3：「衡内容推和历史搜索」
主页上的推内容可能容易被忽略(因为它可能用户的操作无关)，但是搜索页上的热门推少会被忽视。因为用户是带着目标主动进入搜索页，所以不会略页面上的任何息。
热类。过在最近搜索页上将各美放在首位，UberEats和Doordash这类送餐App可以引导用户尝试更多餐。
热话题。展示热话题能为用户创造社区感，会让用户觉他们与更大社会保持联系。
Quora很的问答平台，它不仅显示推荐的话题，还显示了关注者的数。看到这一点，用户会：「如果一话题13万追随者，那一很好！我也其中的一员。」
门新闻。新闻类搜索具很强的时效性，用户很清楚明天的内将不同于今天的内。所以些App会对新闻或搜行实时排，向用户展示门的资讯。
Reddit展示了当前的趋势，户了解最的容，Robinhood每小时都会更华于股的章，这样户就可做及时和明智的财务择。
搜索推荐。通过算法，很多App都从户过的兴趣中推断户的好，然后断推送相似的容，如淘宝的相似商推荐。
同样的策略可应于搜索页。小红书作为一款流行App，搜索页显示根据户口味定制的推荐；Twitter的「For you」标签根据过的搜索展示的相容。
显示更与用户相关的内容以拉近与产品的距离，用户也花更的时间使用产品。
搜索细。Medium的搜索做得聪，它将搜索页面细为个步骤：先点击搜索框来浏览不同的主题，再次点击会显示光标和搜索记录。
过这分解体验，用户在搜索时获了更多信息量和更简洁体验。
以上是关于搜索前和搜索页的体验计。产品的搜索体验受多方面的响：身目的、内容种类、受众类型。
希望这篇文章能够让你了解搜索体验可能性，为搜索设计带来更晰。
欢迎关注作者微信公众：「Clip设夹」
浙公网安备33011002017549号