发布时间：2023-3-9 分类： 行业资讯
搜索看起来很简单，但有很多细节。我之前写了一篇关于搜索《交互设计基本功：如何设计一个好用的搜索框?》的文章，它帮助你普及了搜索知识，但搜索功能的设计因设备和不同场景而异。交互设计还需要大量的案例练习。这一次带来了背景全局搜索的设计案例，以帮助每个人开辟道路。
引导目录：
第1章要求背景
第2章需求分析
第3章交互设计：搜索一般状态，搜索异常状态，其他限制
第1章要求背景
类似CRM的后端管理系统，客户经理可以通过客户列表检索名称下的客户。现在添加客户的全景视图（客户详细信息），单击列表上的客户名称以打开客户的全景视图。新要求是添加全局搜索功能，通过搜索客户名称或客户编号直接访问客户的全景视图。
得到这个需求后，感觉很简单吗？它不是在显眼位置的顶部添加一个搜索框，只需要1分钟即可获得它，即使设计已经准备就绪（见下图）。但是，我们都知道搜索功能并不那么简单。换句话说，这样的设计草案并未考虑所有细节，也无法通过设计审查。
第2章需求分析
由于不那么简单，获得需求的第一步是进行需求分析。需求分析的过程和方法是巧妙的。此示例可用于以自我回答的方式分析需求：
这个全球搜索功能值得吗？ ——将门户添加到直接单客户端全景视图是值得的，并且首先保存查看列表的中间步骤，这是经常使用的。
搜索功能在哪里合适？ ——全局搜索，通常位于右上角的显着位置（个别代购源码网站位于顶部中心），遵循代购源码网站的搜索习惯。
搜索的数据量不大？ ——据了解，每个客户经理平均有1000个客户，而且数据量很小。 （这涉及从数据库中提取数据的效率）。
是否有搜索权限控制？ ——通过数据权限控制，客户经理只能以自己的名义搜索客户，并且无法搜索其他客户经理的客户。
搜索是模糊匹配还是精确匹配？ ——精确匹配，客户经理输入要匹配的客户名称/号码，该号码是唯一的标识符，用于区分同名客户，完全匹配，也意味着可以丢弃模糊搜索结果页面。 ，从搜索匹配列表中选择结果。
什么是近似交互过程？ ——输入客户名称/号码→选择客户端→跳到全景视图。
第3章交互设计
1.搜索一般状态
搜索的一般状态通常是指默认状态，焦点的焦点，输入和焦点的状态。只需列出示例图表和描述，就可以轻松理解。
默认状态：输入框提示符为：请输入客户名称/编号。
获得焦点：获取输入光标，提示不会消失。
输入：1输入，联想结果实时显示，匹配词汇突出显示; 2鼠标悬停结果列表，样式变化; 3单击列表结果，在新窗口中打开相应的客户全景视图。
失去焦点：保持输入。
2.搜索异常状态
在这种情况下，搜索的异常状态将分为两种情况，其中一种情况是客户无法搜索，即搜索没有匹配结果。在这种情况下，需要添加相应的提示，例如“找不到相关客户”;一个是客户经理输入非法字符，例如“@¥％……& *（）”这些不受系统支持。在这种情况下，您可以使用非法字符来显示或使用错误提示。输入中文字符或数字以规避方式。
但是，如果您进一步考虑，这两个例外可以合并和简化，因为客户经理的目标是搜索相应的客户而不是完成表单输入，并且他输入的内容不会保存到数据库中，所以没有必要强制输入有效。字符，我们可以将这两种情况归因于他的输入< ;;找不到相关客户。
统一处理方法是：输入内容与结果不符，或输入非法字符，统一提示“查询相关客户”。
3.其他限制
（1）数据权限
根据需求分析，客户经理只能以自己的名义搜索客户，不能搜索其他客户经理的客户。应在交互式描述中添加相应的解释性文本。
（2）匹配结果限制
例如，当搜索结果太多时，输入一个大姓氏“ldquo;张'sd;可以匹配客户的数百个姓氏，如果全部列出，则需要滚动搜索结果列表，并影响搜索效率，因此限制最多返回10匹配结果。
（3）限制“进入”键搜索，单击图标搜索
由于它是精确搜索，因此有必要从匹配结果中选择而不是将关键字匹配到搜索结果页面，因此使用键盘“ldquo;输入“rdquo;键，然后单击图标搜索。
以上是后台全局搜索的完整设计案例。它是基于背景产品的实际场景的设计解决方案。它不适用于所有场景，仅提供一些设计思路供参考。
作者：雨夜，高级互动设计师，专注于金融领域 - 智能投资顾问的方向，大部分时间都在复杂的后端系统游泳。短书：夜雨y;微信公众号：iueuxd。
本文最初由@夜雨发表。未经许可，禁止复制。
该地图来自unsplash，基于CC0协议
