Search and Filter 搜索与筛选
搜索像问一句“我要找这个”,筛选像加条件“只看这些”。两者一起工作时,用户不用在一大堆内容里硬翻,而是逐步缩小范围,直到结果变得可判断。
关键结构图
用自己的话表达讲给别人听卡住补理解
重新讲一遍
左边是一大组卡片,上方输入搜索词和筛选条件,右边变成少量高亮结果。
What
Search and Filter 是帮助用户从大量对象里缩小范围、找到目标的组合方法。
Search and Filter 搜索与筛选是一组信息检索和结果缩小机制。搜索通常处理关键词、语义或名称匹配;筛选通常处理类别、状态、价格、时间、标签等结构条件。它的边界是帮助用户缩小结果,而不是替用户做最终判断。
StructureSearch and Filter = 输入意图 + 结构条件 + 结果反馈 + 可恢复路径
When
当用户面对大量文章、商品、模板、任务、客户、砖块或记录,并且需要按关键词和条件缩小范围时,就需要搜索与筛选。
How
先确定用户会用哪些词找对象,再确定对象有哪些可靠字段可筛选。结果变化要即时或明确反馈,筛选条件要能看见、取消和组合,没有结果时要给恢复路径。
Examples
模板库允许用户搜索 日报,再按用途、格式和难度筛选。用户能从上百个模板缩小到十几个候选。
砖块库里搜索 按钮,再按 Field 和 Form 筛选,可以快速区分 Button 控件、CTA 行动和组件状态。
来源
类型:设计系统实践 / 信息架构
事实线:搜索、过滤和排序是列表页、商品页、知识库和后台系统的基础信息查找模式。
依据:电商、文档站、数据表和设计系统中的 search/filter pattern 实践。
边界:适合结果数量较多且对象有可区分字段的场景;对象很少时,搜索筛选可能只会增加界面负担。
常见误读:不要把搜索框当成唯一入口。可发现的筛选条件和结果反馈同样重要。