前言
在做 B端产品的设计过程中，列表可能是用得最多的页面了。B 端产品的特点是对列表的操作会很频繁，尤其是对列表数据的筛选，那么列表的筛选都有哪些好的交互形式呢？本篇我们就来对比3种不同的列表筛选形式。
第1种：普通但简单
我们先来看最为常见的列表筛选形式，那就是在列表顶部放置一个筛选表单区，所有筛选都通过表单操作完成。考虑筛选表单可能占据太多的垂直方向空间，影响列表数据的可视范围，通常最多只展示1-2行表单，更多的筛选需要通过展开操作来进行。下面是具体的交互过程原型动图。
这种筛选的优点是技术实现简单，符合大多数列表的交互习惯；缺点是如果筛选项过多的话展开会占据比较大的垂直方向空间，导致列表数据可视区域高度比较小，而B 端产品往往使用频次高的列表会有比较多的筛选项。
第2种：表头+表单组合筛选
这种方式将部分筛选放在了表头，通常是选项类的筛选会放在表头。这种交互和 Excel 的数据筛选习惯是一致的，因此对于财务类人员来说比较友好，同时部分筛选移到了表头，也节省了筛选区的空间，因此是一种不错的选择。缺点嘛，就是技术实现难度稍微大那么一点，不过也不是那么难（应对技术的金句：这个需求很简单，好多产品都实现了）。下面是这种筛选方式的具体的交互动图。
第3种：常用+高级筛选
先说一下，这种交互形式是我偶然接触到一个做 HR SaaS 软件看到的，当时觉得挺新颖的。这家筛选的理念是遵循了“米勒法则”。
米勒法则，从心理学的角度来看，人类处理信息的能力是有限度的。根据米勒(Miller，1956)的分析，人脑处理信息有一个魔法数字7(正负2)的限制，也就是说，人的大脑最多同时处理5到9个信息(chunks)。原因是短期记忆储存空间的限制，超过9个信息团，将会使得大脑出现错误的概率大大提高。
他们将常用的几个筛选项在顶部简化为一个个下拉表单形式，以节省空间，然后再通过一个高级筛选入口满足复杂条件的筛选。下面是具体的交互动图。
这种方式最大的好处是节省了筛选区的空间，使得筛选区一行就能放得下。大部分情况下，使用基础的筛选项即可满足筛选需求，而高级筛选又能够满足低频的复杂筛选需求。缺点的话，就是输入类的筛选需要点开后才可以输入，一定程度上增加了操作的步骤。当然，技术上的复杂度也不低，弹层比较多，而且高级筛选需要和普通筛选的数据做联动处理。
如何选择？
说实话，这三种筛选形式都可以用在实际的产品设计中，不存在特别的优劣之分，可以根据自身产品的用户群体特征进行选择。
对于筛选表单不多的，可以使用第1种（如果B 端客户的显示器屏幕比较小那么不推荐）；
对于财务类产品，那么表头筛选会是首选，比较财务人员和 Excel 打交道比较多，这种方式他们上手起来很轻松；
第3种方式，个人觉得比较适合客户群体相对年轻化的产品，比较首次使用还是需要有个适应过程，但是适应后体验感还是挺不错的，而且产品形式容易标准化。
总结
本篇介绍了三种列表的筛选形式，可以看到，不管哪种交互形式其实都是站在使用者角度去考虑的，只是不同的交互有不同的考虑细节。这也是 B 端产品经理的一个基本的要求，那就是要弄清楚客户员工具体的使用环境（如显示器尺寸、色差）和使用习惯，然后再来确定产品的具体交互形式。
