于B端用户而言，待办功能是相对常用的一个模块，待办模块如果设计得不合理，则可能会降低整体的工作效率。这篇文章里，作者对待办功能的设计优化做了复盘总结，一起来看看吧。

待办作为一个B端用户常用的模块，测试每天都需要在这里处理今天的全部任务，因此待办对于测试的执行者以及管理者而言具有提高工作效率的作用。通过任务清单、优先级设定、进度跟踪等功能，可以更加清晰地了解自己的任务，及时完成任务，减少遗漏和延误，从而提高整体工作效率。

一、业务场景以及难题

现有业务之中，待办是测试执行每天必看的板块，但是现有的待办出现了几个问题。

1. 空间布局拥挤，拓展性不足

现在业务之中待办分类是不断地增加（现有6个），名字相对又很长，最长的有到7个字，再加上后面多语言要翻译成英文在国外用户使用，横向空间完全不足。1920页面的拓展性不足，小屏幕更佳难以使用。

2. 视觉平整，信息对比不强烈

现有的表格之中更多的是字和填充的按钮呈现，整体的对比度较低，导致了用户识别关键信息难度加大。

3. 表格复杂操作多，操作成本高

待办针对的全部的测试角色，每个角色对于表格内容的操作项的权限和需求都是不同的，既要查看到关键的信息，又要能快速的处理任务。

二、设计优化

1. 优化空间结构，减去顶层统计

为了增加表格空间，删除顶部统计卡片，将里面的统计信息总和信息以及环比信息放置到单选选项之中，提高表格的容量，降低用户查找的成本。

2. 添加纵向展示，增加拓展性

在实际的业务之中，有的名字很长（不算英文，有的6个7个字），再加上多语言版本还有统计数和提升的数字，导致了横向空间会随着设备的变化而变小，1920空间中最多只能承受6个内容拓展性不足。

因此在横向的基础上添加了纵向展现切换模式，增强导航的内容拓展性以及直观性。

3. 导航多样化元素，强化元素对比

不仅仅在交互形式之上做了优化，也在不同的内容之上适配不同的颜色还有图标，增强内容的对比度的颜色图标与相关的任务进行绑定，降低测试相关人员记忆与选择的成本。

4. 表格元素样式优化，加强视觉对比

优化前，表格主要使用的主色底的按钮或者是蓝色的字进行链接呈现，表格内容较多，呈现方式比较单一，内容之间对比度很弱，用户查看成本较高。因此先将所有的表格内容进行分类：

1. 状态：按照动静结合分为——阶段结果（静）和当前所属阶段（动）
2. 基础信息：主要是测试要打达成的条件
3. 其他：设计到一些时间以及备注

这次的业务重点是优化状态显示，除了拥有特别语义的颜色（黄，橙，红，绿）外，其他的颜色的参考ANT Design的标准进行呈现，还有关于临期和逾期的事表达上遵循特殊语义颜色进行表达。其他类别中常见的进度以进度条的方式呈现。

5. 表格交互原话，减少操作距离

现有业务需求之中，测试相关人员要操作功能栏的内容需要移动到最右边，为了用户能更加快捷的使用。因此参考了用户常用的单击表格进行邮件选择操作，用户可以点击某个表格进行相关的操作，这里在设计的时候需要考虑到用户的操作权限，需要做好相关调研。

6. 自定义内容，加强灵活性

业务中单个表格多达15到25个，单页很长放得下，全部看完需要滑动多屏进行查看。在交互上添加了自定义操作，用户可以根据自己的喜好将表格定制为自己觉得合适的表格顺序以及内容。

7. 操作功能收纳，增强功能区兼容性

现有的功能区是根据用户权限做的显示，常见的有4个至7个，导致了笔记本的适配效果以及功能的拓展性极差。所以，在交互上进行了收纳的操作，除了高频的详情以及编辑还有流程节点外，其余的由“更多”进行收纳，用户点击查看即可。

三、未来规划

现有的右键原位操作只能支持单个，第二次迭代的会优化群宇选择优化项。

四、效果验证

效果验证从主观和客观2个角度上进项思考：

1. 主观：问卷调研用户满意度提高12.3%。
2. 客观：单页表格容量从17提升到24，用户编辑效率提高23.6%

总结

UX设计师工作时候除了要思考业务之外，更要思考用户到底需要什么设计。最好的设计是“没有设计”。