H2.02.2single next step in empty state设计

空状态需给出唯一明确的下一步

别名: 空态唯一行动 · 一个主按钮 · empty-state CTA

概念解释

空的工作区已经告诉人「这里还没有东西」,上手要接着给出唯一明确的下一步:一个能结束这个空的动作,文案具体到做什么。有动作和动作唯一不是一回事。三个同级按钮(从模板开始、导入、空白创建)把空状态变成选择页,新手在还不知道哪种路径通向价值时就要下赌。这条管的是选项的数量与清晰度,不是空状态作为组件要不要带按钮,也不是填充之后会长成什么样子。

机制

空白切断了扫描线索,人进入「找一个能让这里不再空的控件」。多个同等突出的入口会把这一个问题扩成路径选择,而路径选择需要产品知识——空状态的读者恰好没有。工作记忆此时只撑得住一个目标;并列的主按钮迫使目标分裂,结果往往是什么都不点,或点了最像广告的那个。唯一不是禁止次要路径,而是次要必须降级:文字链、稍后、收进「更多」。主按钮的文案还要把动作说完(「创建第一张看板」而不是「开始」),否则唯一入口仍是模糊的门。顶栏另有一个同名创建、空状态里再放一个,看起来有下一步,实际是两个竞争焦点,新手会以为这是两件不同的事。

边界

只读角色面对合法的空(本周无待办),唯一下一步可能是「调整筛选」或「返回」,硬塞创建是越权。前置条件未满足(未接数据源、未验证邮箱)时,唯一动作应指向那个条件,而不是一个点了就失败的创建。专家清空列表后,他们已有习惯入口,空状态里再放一个巨大主按钮会挡视线,可以只留一句短说明。导入与创建在该产品里真的是两种不可合并的首步(本地文件 vs 空白文档),可以并列,但必须标明适用情境,不能两个实心按钮同样大。

怎么落地

  • 为首次无数据指定一个能结束该空的主动作,放在说明旁边;其他路径降为文字链或收进次要菜单。
  • 主动作文案写成可观察的结果(创建、导入、连接),禁止「开始」「立即体验」这种不指向对象的词。
  • 若顶栏已有创建,空状态的按钮应是同一个动作的入口,不要另起一个不同语义的主按钮。
  • 验证:拿掉顶栏,只留空状态,问新手「你下一步会点哪、点了会发生什么」。若指向分裂或说不出结果,就把选项收到一个主按钮。

延伸

  • 同组H2.02.1 空状态是最自然的引导位置 · H2.02.3 空状态需解释填充后会得到什么
  • 相邻E6.06 空状态 · H2.09 上手清单与完成度 · E1.01 按钮的层级
  • 站内检索empty-state CTA · single next step · choice overload

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/H2.02.2