跳转至

UI 竞品参考与设计原则(V1)

本文档依据仓库内 brd.md 已梳理的竞品梯队,提炼可借鉴的界面与信息结构,用于指导第一版(V1)产品设计,避免与重型仿真/指挥平台同质化竞争。


1. 竞品画像摘要(来自 brd.md

类型 代表 能力侧重 UI/体验上可借鉴点
数据驱动评估 赛飞特等 定位/音视频/对讲等多源数据、回溯标绘 时间轴 + 证据链、多源数据同屏、指标与证据强绑定
仿真/VR 灾训云等 云渲染、场景剧本、操作路径与响应时间 剧本/场次向导、步骤化引导、量化指标面板(时长、路径、得分)
综合指挥/县域平台 电信、思湃德等 监测—研判—调度—复盘一体化 阶段状态条(准备/实施/结束/复盘)、大屏式信息密度控制(后台可收敛为「工作台卡片」)
桌面演练/AAR Preppr、Continuity2 等 情景、角色、证据捕获、评分与 AAR 角色视角切换证据库、结构化复盘与行动项
垂直行业 华数达(民航)等 行业检查单、流程闭环 检查表/指标树、合规状态与待办一目了然

本产品差异化(UI 层要显式表达):对齐 GB/T 46792-2025 的模板、指标体系与报告体例;弱化「仿真大屏」,强化「可量化、可追溯、可交付」。


2. 整体信息架构(对齐 PRD 一级模块)

docs/PRD-应急演练评估数字化平台.md 一致,主导航建议固定 8 项(统计分析可标「Beta」或 V1.1):

  1. 工作台:待办、逾期整改、进行中场次、今日任务
  2. 项目管理:客户 / 项目 / 场次 / 成员
  3. 模板中心:指标、权重、规则、报告映射、版本
  4. 现场评估:按场次的录入、附件、问题随手记
  5. 报告中心:生成、版本、导出、签收
  6. 整改跟踪:任务看板、状态、验证、证据
  7. 统计分析:闭环率、平均分、耗时分布(V1 可先简版)
  8. 系统设置:租户、角色权限、审计、集成

3. 竞品导向的页面级参考

3.1 工作台(对标:指挥/复盘类「总览」+ Preppr「待办驱动」)

布局建议

  • 首屏三列:我的待办 | 进行中的项目/场次 | 风险与逾期(整改超期标红)
  • 次级:最近动态(时间线:谁改了评分、谁上传了证据、谁发布了报告)

组件参考

  • 赛飞特式「强证据」:每条待办可展开看到关联 指标缺口未上传证据
  • 电信式「阶段感」:项目卡片展示状态机:待启动 → 进行中 → 待审核 → 已完成 → 已归档

3.2 项目管理(对标:县域平台「组织—任务」+ 行业检查单「结构化」)

项目详情页 Tab

  • 概览(目标、标准版本、评估类型自评/第三方、是否简化流程)
  • 场次列表(时间、地点、状态)
  • 成员与分工(组长/成员/客户方)
  • 附件与证据(按场次聚合)
  • 审计摘要(导出、签收、权限变更)

交互原则

  • 3 步内创建项目并绑定模板(PRD 验收);创建向导放在右侧抽屉或分步表单。

3.3 模板中心(对标:桌面演练「情景/规则」+ 国标「指标体系」)

核心界面

  • 左侧:指标树(维度 → 指标 → 子项)
  • 右侧:指标编辑器(类型:数字/时间/文本/枚举、权重、必填、评分规则、证据要求)
  • 底部:报告字段映射(指标/问题 → 报告章节占位符)

版本策略可视化

  • 草稿 / 发布 / 停用时间线;已引用该模板的项目只读快照说明(避免误改历史)。

3.4 现场评估(对标:赛飞特「时间轴+证据」+ 灾训云「量化面板」)

主界面:双栏

  • 左栏:场次信息与时间轴(关键节点:发令、上报、到场、疏散完成等,可点选插入时间戳)
  • 右栏:当前选中指标的 录入控件 + 证据缩略图列表(照片/短视频/音频)

辅助能力(V1 建议)

  • 快速问题登记(悬浮按钮):严重级别、建议、关联指标(可选)
  • 离线友好(P1):先不做复杂离线,V1 可做「保存草稿 + 失败重试提示」

3.5 报告中心(对标:Preppr「AAR/证据」+ 国标报告结构)

列表字段

  • 报告编号、版本、类型(完整报告 / 问题清单)、生成时间、生成人、签收状态

详情

  • 左侧章节大纲(与附录 E 类结构对齐的占位)
  • 右侧「数据来源」面板:展示每个章节绑定的 指标聚合值证据引用

3.6 整改跟踪(对标:行业闭环「任务—验证—关闭」)

看板列

  • 待分派 | 进行中 | 待验证 | 已关闭 | 已逾期

任务卡片必备

  • 责任主体、截止时间、关联问题、验证方式、证明材料入口

4. 视觉与组件规范(简版,便于落地)

维度 建议
风格 B 端政务/安全 的克制风:高对比度状态色、少装饰、表格 + 抽屉为主
主色 深蓝/墨绿底 + 安全橙用于告警与逾期(避免大面积荧光色)
数据展示 指标卡:规定值 vs 实测值 vs 得分 三列对齐(体现国标「量化优先」)
密度 默认「中密度」;支持用户切换紧凑模式(评估员场景)
移动端 V1 以 H5 适配 为主:现场页单列流式布局,大按钮区

5. 刻意不做(与竞品错位)

  • 不做「仿真沙盘/数字孪生大屏」作为默认首页(除非单客户定制项目)。
  • 不做重硬件绑定入口为必选步骤(定位/无人机等作为「可选扩展」模块文案)。
  • 不把「AI 评估」作为首屏核心卖点文案(可放二期能力位),首屏强调 国标对齐与可验收交付物

6. 验收用 UI 检查清单(与 PRD 挂钩)

  • 角色登录后菜单与数据范围符合 RBAC + 项目范围
  • 现场页:每条指标可追溯到操作者、时间、终端类型(文案或字段层体现)
  • 报告页:版本号、导出记录、签收状态可见
  • 整改看板:逾期规则与筛选可用
  • 关键页面在 1280×720 与移动端宽度下无严重遮挡

7. 参考链接(官方/公开资料自行补充)

竞品多为商业系统,无统一公开 Demo。后续建议在立项阶段收集:

  • 3~5 个竞品官网产品页截图(脱敏)
  • 1~2 个客户现有系统截图(脱敏)
  • 国标附录 A/B/E 打印样表(作为线框图对照)

本文档随设计稿迭代更新版本号即可。