园区夜班值守
门禁、照明、能耗三路数据同屏，值班员平均定位异常耗时从 6 分钟压到 90 秒。
定位 90 s误报 -42%大屏 3 路
探索与发现 / 暗黑模式 IoT 界面
在暗黑模式里，让每一台设备都灵感闪耀
我们从 2 400 个真实设备影子中反推一套暗色物联网网站设计：以深色低明度底承托数据本身，用降饱和的绿作主色锚定「稳定」，再用暖琥珀与小面积蓝紫强调色点亮关键动作，让用户体验在夜间值守场景下依然清晰、克制、可读。
2400+
已接入设备影子，单集群上限 5 000
98%
暗色主题下表单首屏可读率
180ms
遥测数据端到端渲染时延 P95
42%
夜间值守场景误操作下降幅度
01 / PANEL
数据可视化面板：把 7 类遥测压进一屏
我们先做的是「减光」而非「加光」：把背景压到 oklch(0.15 0.03 112)，让曲线与告警成为唯一的高明度焦点。
周一周二周三周四周五周六周日
在线率99.82%
告警量37 条 / 日
平均回传间隔5 s
断连恢复中位耗时1.4 s
色彩搭配约束
暗色底上的对比最低线
正文与底色对比度按 WCAG AA 4.5:1 起算，关键数字提到 7:1；绿色主色降饱和至 0.14 chroma，避免夜间刺眼。强调色只出现在告警点与主按钮，占比不超过整屏 10%。
刷新策略
分层推送而非整页轮询
拓扑图 10 s / 指标卡 5 s / 告警流 1 s 三档节奏，整页重绘次数从 12 次每分钟降到 3 次，长稳运行内存回落约 18%。
02 / PARTNERS
合作伙伴墙：静默流动的生态底噪
模组厂 · 星隼 NB-IoT 模组量产一致性 99.5%云底座 · 岩脊 边缘节点 320 个 / 时延 < 30 ms传感 · 沐野 温湿度漂移 ±0.2 ℃ / 年网关 · 铸流 单网关并发 12 000 连接安全 · 砚山 设备证书轮换 90 天模组厂 · 星隼 NB-IoT 模组量产一致性 99.5%云底座 · 岩脊 边缘节点 320 个 / 时延 < 30 ms传感 · 沐野 温湿度漂移 ±0.2 ℃ / 年网关 · 铸流 单网关并发 12 000 连接安全 · 砚山 设备证书轮换 90 天
03 / CAPABILITY
核心能力卡片：环形排布的四根支柱
四张能力卡围绕中央的「设备接入中枢」呈放射环排布，视线由中心向外探索，正好对应物联网从连到用的四段旅程。
接入中枢2 400 设备影子在线
连接层MQTT / CoAP 双栈，重连 < 2 s
数据层时序压缩比 1:9，落盘延迟 300 ms
规则层边缘规则 200 条，命中延迟 < 50 ms
呈现层暗黑主题切换 1 次点击，无闪白
04 / GUIDE
实用指导清单：暗黑 IoT 站点的 7 条落地要点
每一条都来自真实联调踩坑，可直接抄进设计走查表。
- 01底色不要用纯黑。把底定在 oklch(0.15 0.03 112) 附近，卡片抬到 0.21 明度，靠明度差而非描边区分层级；纯黑会让深绿主色显得脏，也会放大 OLED 拖影。验证：截图转灰度后仍能看出 3 级层次。
- 02绿色主色必须降饱和。主色 chroma 控制在 0.14 以内，明度 0.72 左右，只用于按钮边、进度条与激活态；大面积区域一律交给中性面。避坑：饱和度拉满会让夜间值守 8 小时后出现明显视觉疲劳。
- 03强调色占比 ≤ 10%。蓝紫强调色只点关键数字、告警点与主 CTA，暖琥珀色承担次要点缀；两种颜色互为分裂互补，靠明度差跳出而不是靠更高饱和。走查方式：把页面缩小到 25% 目视，彩点应是零星而非成片。
- 04实时数据分区降频。拓扑 10 s、指标卡 5 s、告警流 1 s 三档刷新；用 CSS 过渡而非整块重绘。指标：整页每分钟重绘 ≤ 3 次，长稳 24 h 内存增长 < 5%。
- 05状态色语义要固定。在线=主绿、离线=中性灰、告警=暖琥珀、严重=蓝紫强调；同一语义全站只允许一种颜色，避免用户二次翻译。检查：随机抽 5 个页面，语义色一致率应达 100%。
- 06动效给降级通道。跑马灯、环形放射线、数字滚动均以加载即播放的 CSS 动画实现，元素默认就是可见终态；并在 prefers-reduced-motion 下全部静止。避坑：切勿把内容初始设为透明再等脚本点亮，无脚本环境下会整块消失。
- 07移动端先保点按区。小屏下所有按钮与导航项高度 ≥ 44 px，表格转横向滚动或卡片堆叠，长设备名强制断行。验收：320 px 视口下无横向滚动条，长英文型号不撑破卡片。
05 / SCENES
应用场景展示：三类夜班现场的真实读数
产线振动监测
振动阈值越界即触发边缘规则，本地先停机再回传，避免整线连带损失。
响应 < 50 ms停机损失 -31%规则 200 条
冷链温控追踪
温度每 30 s 上报一次，越界自动生成工单，货损率按季度核算明显下降。
上报 30 s货损 -27%轨迹 1 条/车
06 / COMPARE
解决方案对比：自建平台 vs 托管物联网平台
以 2 000 台设备规模为基准做横向对照，便于按预算与人力做取舍。
对比维度自建平台托管方案（本页范式）
首次上线周期约 12 周约 3 周
2 000 台设备月成本人力折算偏高可控且线性
暗色主题一致性需自建令牌体系内置一套令牌
边缘规则条数受自研进度限制开箱 200 条
断连恢复中位耗时3.2 s1.4 s
适用团队有专职后端与运维小团队快速验证