数据过滤在B端产品中出现的频率比较高，也是一个很重要的模块。作为设计师，我们要设计好数据过滤功能，才能满足用户目标，提升用户体验。下面文章作者详细介绍了数据过滤的种类以及优缺点B站PC下拉★64xl.com人人都会做下拉，哔站PC下拉，我们一起来看看吧。

1.为什么需要数据过滤？

数据过滤，就是从大量的数据中筛选出一些符合我们特定条件的数据，获取特定的数据就是数据过滤。

B端产品往往比较复杂，伴随而来的数据量也非常大，因此数据过滤在B端产品中出现的频率比较高，也是一个非常重要的模块，作为设计师，一定要设计好数据过滤功能，才能满足用户的目标，提升用户体验。

数据过滤的类型

数据过滤通常可以通过两种方式实现：

过滤搜索

在B端系统界面设计中，搜索是指定任意条件进行搜索，系统搜索到条件后展示相应内容，功能比较主动；过滤是系统提供各种条件缩小范围，可以选择不同条件下搜索内容，功能比较被动。

1. 搜索

一般来说，搜索功能是用户在目标明确，知道自己要搜索什么（精准或模糊）的情况下，输入关键词进行搜索的功能。搜索框的风格基本一致，但交互略有不同。使用场景分为两种：全局搜索和特定搜索。

全局搜索

全局搜索一般是指允许用户在某个平台或数据库内使用搜索，而不受相对搜索限制的搜索方式。通俗的说，搜索范围是整个产品或系统，搜索没有任何限制。比如在桌面下拉的输入框中输入信息，就会触发全局搜索移动端关键词搜索下拉，找到输入的关键词内容，范围也是全局的，可以匹配文件名、应用名、相册内容等。

对于模块类别多、内容全面的系统，B端系统也会选择全局搜索，你只需要在全局搜索框中输入你模糊的目标信息，系统会根据输入的关键信息，搜索各个模块对应的目标字段，如果类别较多，界面也会设计一个类别tab来展示结果。

具体搜索

特定页面是指在某个模块或者页面中添加搜索功能，比如在数据表格页面中添加搜索功能，意味着搜索目标只在表格模块内容内进行搜索，搜索到的信息有限移动端关键词搜索下拉，当然也是更精准的搜索到用户想要的目标信息。

使用场景

搜索是用户指定任意关键词，平台根据条件进行搜索并展示相应内容。搜索通常针对的是整个系统和功能，在信息过滤方面相对比较模糊。可以以搜索为入口，承载更多的操作和导流，比如推荐搜索、热门搜索等。

对于B端产品来说，如果页面数据量很大，需要精准展示符合条件的信息，那么使用过滤；如果只需要用关键词定位内容，那么使用搜索。

设计原则

你可能在移动端或者网页端都用过搜索，那么如何才能设计出好的搜索呢？设计师在设计搜索时应该遵循哪些原则呢？主要有四点：

（1）渐进式呈现

我们在设计搜索结果的展示时，可以考虑渐进式的展示方式。这意味着搜索结果不应该一下子全部呈现给用户，而是采用逐渐展开的展示方式，让用户慢慢浏览结果。但要注意的是，渐进式展示的层次不宜过深，内容要符合用户的目标。

（2）可操作性

对于搜索结果，我们可以提供操作选项，比如查看详情、收藏、保存搜索结果等，这将大大增强用户与搜索结果的后续联系。

（3）结构化

结构化是指搜索结果的呈现要有概括性和条理性，结果要符合一定的规律和逻辑。注意内容层级不能太深，没有层级的内容是无法反馈给用户的。简单来说，分类就是结构化呈现的体现，内容结构化之后，用户可以更高效的进行搜索和定位。

（4）可保存

不管搜索什么内容，用户都有权利保存自己经常使用的搜索结果，保证用户以后不需要再重复搜索，也就是常见的历史搜索。这方面很多C端产品已经做得很好了，在B端产品我们也可以考虑。

2. 筛查

筛选数据的另一种方法是筛选。百度百科对筛选的定义是利用筛子让小于筛孔的细颗粒通过筛面，而大于筛孔的粗颗粒则被截留在筛面上，从而完成粗细物料分离的过程。分离过程可以看作由物料分层和细颗粒筛选两个阶段组成。物料分层是完成分离的条件，细颗粒筛选是分离的目的。

过滤是通过指定或定义系统提供或用户自定义的各种条件来缩小范围，并找出所有符合这些条件的数据。我们最常见的过滤是给出具体的条件，用户直接选择对应条件即可进行过滤，也就是常用的普通过滤。但随着B端业务的差异化和功能性，在复杂业务场景下的简单过滤已经不能满足现有的业务需求。后来推出了高级过滤功能，在不同的需求条件下会选择不同的过滤方式，满足用户的不同需求。

筛查有 3 种类型：

下拉筛选器

下拉过滤就是在系统页面的过滤区中设置下拉过滤条件，用户通过下拉选择过滤条件中的值就可以进行数据过滤。当然，过滤区除了下拉选择外，还可能有输入过滤。下拉过滤和数据过滤共同构成了过滤区。

标头过滤器

通过单击表列标题中的过滤项来过滤数据列。

标签页过滤器

标签也是一种过滤方式，默认选中一个标签，点击可以切换显示另一个标签下的内容。标签按照位置分为竖式标签和横式标签，按照样式分为卡片式标签和标签式标签。

使用场景

过滤器分为下拉、表头、标签页，根据页面和业务需求选择，如果对过滤结果要求准确，且业务数据较多，建议使用下拉过滤器，如果对过滤要求不高，且业务数据较少，则使用表头和标签页，但需要注意的是，标签页过滤器之间要有业务关联性，表头过滤器慎用。

二、常见设计方法 1、筛选区布局

从出现的位置来看，一般有以下几种常见的组合过滤类型：上下布局的水平过滤区域、左右布局的垂直侧过滤区域、内嵌表头过滤区域。

采用上下布局的水平过滤区域

在针对B端设计的页面中最常用的过滤布局方式是自上而下的布局，过滤区域置于页面内容区域上方，用户先进行过滤，再查看结果，提高了用户过滤的效率。

当过滤项少于三个时，会显示在一行中，会占据一整行的空间；当过滤项较多时，会占据页面很大的垂直空间。当内容较多时，建议增加收起和展开功能，保证整体过滤面积不会过大，提高屏幕效率比。

左右垂直侧筛分区布局

左右布局过滤区通常以选项形式进行过滤，过滤区位置相对固定，主要占据页面横向空间，当左侧过滤区超出长度时，过滤区内部滚动，一般实时触发过滤；左右布局竖边过滤区在国外网站和产品中比较常见，在国内产品中并不常见。

左右布局的好处是不影响页面垂直高度空间，以抽屉的形式展开、折叠，可以适应很多场景。但是这种过滤器会影响页面水平空间，压缩页面内容区域宽度，抽屉的展开又会挤压内容区域宽度，对内容区域内容的适应性有很高的要求。

内置标题过滤区域

表头过滤是一种复杂的过滤形式，常见于表格区域表头，是表格内置的过滤形式，适合过滤内容比较单一的表格列，最初衍生自过滤表单。

具有表头过滤功能的表格，在表头名称右侧有过滤图标，点击过滤图标调出气泡卡片，点击复选框内容可单选或多选需要展示的内容，点击一般会实时生效，生效后表头过滤图标为选中状态，表示过滤项生效，再次点击气泡卡片可调出结果。

2. 高级过滤器

高级过滤用于过滤条件较多的情况，如果过滤条件超过8个，说明过滤条件太多，如果把所有过滤条件都展示出来，过滤面积会太大，影响使用，此时可以使用高级过滤。

过滤方式是在过滤区域显示高级过滤按钮，点击高级过滤会弹出一个对话框或抽屉，对话框中会包含所有的过滤条件，用户可以点击需要的过滤条件和对应的内容进行过滤，点击确定即可生效，并显示应用高级过滤后的数据内容。对话框中会设置一个清除按钮，点击清除可以恢复过滤前的内容状态。

3.自定义过滤

自定义过滤的使用场景也是由于过滤条件太多，这种情况下也可以使用自定义过滤。简单来说，自定义过滤的做法就是将过滤条件隐藏起来，用户可以将自己认为重要、常用的过滤条件配置显示出来，形成一个过滤条件配置方案以供保存。用户可以根据自己的使用场景，配置多个过滤条件配置方案，这样就形成了多个过滤条件方案。

自定义过滤通常将选项放在一个对话框中，点击“自定义过滤”弹出对话框，勾选需要显示的条件，并根据条件的重要性设置显示顺序。

4. 基本过滤 + 自定义过滤

基本过滤+自定义过滤，就是在自定义过滤的基础上，增加几个固定的基本过滤条件，这些基本过滤条件会固定在过滤区，用户可以在这些固定条件的基础上自定义添加其他的过滤条件。

点击固定条件旁边的加号，可以添加自定义过滤条件，选择条件后，选择或输入需要过滤的重点内容，一般情况下基本过滤+自定义过滤会立即触发。