“子微,你们设计数据看板的时候,一般先看哪里?”
上周一个刚接手运营后台的同事在微信上丢过来这个问题,附了一张他正在改的看板截图——密密麻麻的数字卡片、折线图、环形图全挤在第一屏,每个模块都带了彩色标签和微动效。我盯着那张图看了几秒,想起自己第一次做看板时也犯过一模一样的错。
那场翻车教会我的事
去年我做第一个数据看板的时候,成就感几乎全来自“装了多少东西”。日活、留存、转化漏斗、渠道分布、用户画像……恨不得把所有指标都塞进首屏。评审那天,产品经理问了一个让我至今记得的问题:“这个页面的核心动作是什么?”
我愣了一下,发现自己答不上来。
那个看板没有核心,只有堆砌。用户进来之后,光标在屏幕上晃了好几秒才能找到一个切入口。上线后数据反馈也很直接——平均首屏停留时间比预期高了将近三秒,但关键指标的点击率却低得可怜。
后来我花了一周重新梳理,把那张看板推倒重来。核心思路很简单:先问用户进这个页面到底要做什么,而不是“我能展示什么”。
首屏最该检查的三个东西
那次翻车之后,我给自己列了一个清单,每次做看板或后台列表页时,都会先过一遍。这里分享三个最容易被忽略的点:
第一,首屏能不能让用户看懂“现在是什么状态”
用户打开看板,第一反应不是看数据,而是确认时间范围和当前状态。如果首屏的日期选择器或者状态筛选器藏得太深,用户就会产生“这个页面是不是空的”错觉。我之前一个项目里,因为空状态只放了一句话“暂无数据”,没有给下一步动作,结果运营在群里问了三遍“是不是系统坏了”。现在我的做法是:如果页面没有数据,至少放一个新建或导入的入口,让用户知道下一步该做什么。
第二,主操作按钮是不是真的“主”
很多后台页面里,删除、导出、批量操作这些高频动作反而比“提交”或“保存”做得更显眼。我见过一个订单列表页,导出按钮用了品牌色,而“确认发货”是灰色。用户每次发货都得瞄一眼才能找到按钮。后来我把发货按钮放到了列表行的最左侧,用了品牌色,导出改成了次级样式。改动不大,但发货效率提升了大概20%。
第三,文案是否和业务真实动作一致
这是个特别容易踩的坑。比如“详情”按钮后面跟着的不是详情页,而是编辑弹窗;或者“查看”按钮点了之后跳到一个完全不相干的报表。我有个习惯:设计完页面之后,自己把所有按钮点一遍,再让业务方走一遍,看文案和实际动作有没有对不上。对不上的地方,就改文案或改交互,绝不将就。
空状态和错误态,最能看出设计师的功底
这句话是我从前辈那儿听来的,自己做项目多了才真正体会到。
正常页面大家都会设计,但遇到加载失败、数据为空、权限不足这些边界情况,很多人就敷衍了事——放一只小狐狸、写一句“暂无数据”就结束了。可用户真正记住的,恰恰是这些“卡住”的时刻。
上次做一个数据看板的加载态,我专门画了一个简单的骨架屏,让用户在等待的时候能看到模块的大致轮廓,而不是白屏。后来内部测试时,运营同事反馈说:“这个加载感觉快多了。”其实加载时间没有变,只是心理等待感变短了。
一些不一定对,但值得试试的做法
做看板这件事,我到现在也不敢说自己完全做对了。每个项目的数据
留给自己的备注
设计没有唯一正确答案,这篇只是一次取舍记录。
好体验来自克制