I3.03.1explicit offline indicator设计
离线需要明确的状态指示
别名: 离线指示 · 断网标识 · offline badge · 连接状态
概念解释
设备已经不在网上,界面还长得像在网上——这是最贵的一种未知。离线需要明确的状态指示(explicit offline indicator):用稳定、可读、不能被内容淹没的信号说出「现在没有连接」,而不是等某次提交失败才让人猜。指示的是连接这一层事实,不是「哪些功能还能用」、也不是「操作会不会排队」。那两件事先要有指示,才能被问。
没有指示,离线被感知为卡顿、空白或「产品坏了」。有指示,离线变成一种可命名的模式。
机制
连接是全局模态,却几乎不占像素。人默认「能打开这个 app 就是在线」,这个默认只在失败时才被检验。失败又常常长得像别的错:接口超时、空列表、转圈不停。归因会落到内容、账号、服务器,而不是无线电。明确指示把连接从推断改成知觉:在评价鸿沟闭合之前,先把「世界是否连通」放进视野。
指示必须扛得住注意转移。一条 toast 说「网络不可用」然后消失,人切去看消息再回来,模型又回到默认在线。所以离线指示要像一种模式灯:只要还离线,灯就还在。它和内容争的是常驻槽位,不是瞬时注意力。
边界
飞行模式、系统级无网横幅已经够硬的环境,应用内可以更克制,但不能把系统横幅当成自己的状态——用户关掉系统提示之后,应用仍欠一条。弱网(高延迟、丢包)不是离线:标成离线会禁止其实还能做的请求,标成在线又会让超时看起来像故障。弱网需要自己的诚实说法(「连接不稳定」),不要挤进离线灯。局域网可用、公网不可用(内网工具、缓存站点)对「能不能做事」和「能不能同步到云」是两件事,一只灯不够,要能说出缺的是哪一段。后台同步进程自己断了、前台浏览还通,不要把整app标成离线。
怎么落地
- 在主任务视野里放一盏只要离线就还在的灯:顶栏条、头像旁的点、标题下的一行。不要只用一次 toast。
- 文案直说连接,不说「出了点问题」。离线、弱网、服务端故障三套词,不要混用一个红点。
- 进入离线和恢复在线都要变灯;恢复时灯灭,可以叠加一句「已重新连接」,但不要只靠那一句、灯却没有家。
- 验证:打开飞行模式,回到产品主屏,计时三秒。若仍无法在主视野里读到「现在没网」,指示失败。再关掉飞行模式:灯应在连接真正恢复后熄灭,而不是在按钮可点时就熄。用屏幕阅读器走同一路径,确认离线作为状态被读出,而不是只有颜色变化。