操作项|B端表格设计指南( 五 )


操作项|B端表格设计指南
文章插图
方案二:默认不显示,勾选激活后显示于表左上方
优点:减少了相应的视觉噪音,业务拓展性强
缺点:有一定的学习成本,没有勾选时不知道有该操作项
操作项|B端表格设计指南
文章插图
方案三:直接显示于表左下方,但需勾选激活后操作
优点:上内容下操作,符合操作动线
缺点:和分页放置一起不易于业务拓展
操作项|B端表格设计指南
文章插图
根据我司业务,最复杂的批量操作不超过3个,是可以满足业务场景的,即使后续再有新增的批量,也可以和下钻到「更多」,综合考虑后选择方案三,放置于表的左下方。
Step 3:优化信息层级
单行操作根据操作频率优先级为入职生效>详情>删除>编辑,其中编辑和删除属于低频操作,可折叠隐藏。批量操作-导出也是低频操作。最后定稿方案如下:
操作项|B端表格设计指南
文章插图
三、结语全篇的表格文章到这就结束啦~
本文提供了一个表格设计基本指南,在具体项目中,你可能需要根据产品特性和用户需求进行调整,但是表格设计的原则是通用的:

  • 从用户阅读表格的目标出发设计表格的内容和布局
  • 从提高用户阅读速度的功能角度出发进行表格的视觉设计,避免过度设计
  • 当表格指标、数据过多时,提供一些自定义的工具帮助用户自助选择出最需要的数据条目
本文由 @且曼B端设计_刘美芳 原创发布于人人都是产品经理,未经许可,禁止转载。
题图来自 Unsplash,基于CC0协议。