H2.02.1empty state as onboarding surface设计
空状态是最自然的引导位置
别名: 空态引导位置 · zero-data onboarding · 工作区教学
概念解释
首次上手要选一个教学表面:全屏导览、叠在界面上的气泡、邮件,或内容还没出现时的工作区本身。空状态作为引导位置,是把「这里将来装什么、怎样出现第一项」写在内容本来会占据的坐标上。它不是在讨论空白要不要分类成无数据或无结果——那是空状态作为反馈组件的诊断问题。这里谈的是上手流程该把课放在哪:放在人已经注视、而且马上要往里填东西的那块板上,而不是另开一层来抢注视。
机制
第一会话里注意力只有一份。导览和气泡要先把这份注意从任务上拽走,再许诺稍后还回来;空的工作区没有行可以点,当前任务本来就是「弄懂这块地方」。教学因此不必打断,它就是那块地方的职责说明。空间上,说明和未来对象重合,日后列表填满时,人仍能用「原来第一项是从这儿长出来的」当锚,不必回忆遮罩上的句子。时间上,空只存在于还没有内容的窗口,教学会随第一项的出现自动结束,不需要另做「已看过」的开关。把课放到别的通道,等于放弃这段没有竞争信息、且长度正好覆盖无知期的版面。产品常把空状态留给插画,把课做成进门导览,是把最合适的表面空着,再用更贵的打断去补。
边界
容器被筛空、加载失败、权限看不见,都不是「还没开始用」,在那些空上做上手教学会教错原因。老用户删光内容后的空也不是首次表面,再放欢迎语是把清空当成入门。多面板产品里只有一个容器是空的、其余已有数据,只应在那个空容器上说话,不要因为「还有一个空」就弹出全局导览。演示账号或样例填满了工作区,这条位置就消失了,教学必须改走别的表面,而不能假装空还在。
怎么落地
- 把首次要教的那句话写进该用户、该容器从未有过内容时的工作区,不要另做一层进门课来重复它。
- 只在无数据这一种空上启用上手模板;筛空、出错、权限空走别的文案,不要借用上手插画。
- 第一项创建成功后立刻撤掉上手空态,不要残留「开始使用」和真实列表抢位置。
- 验证:挡住导览和气泡,只留工作区,问没见过产品的人「这里是干什么的、第一项从哪来」。答不上,课就没放在这个表面上。