一、项目页面概况
电厂运行总览页：核心载体为全厂机组三维数字孪生模型，展示机组功率、主蒸汽、给水等核心实时参数、介质流向、全厂负荷 24h 趋势，是调度人员第一眼查看的全厂概览窗口；
设备状态监控页：以锅炉 - 汽轮机 - 发电机 - 主变设备拓扑链路为中心，展示主辅机健康度、测点状态、设备台账、待检修清单；
能耗指标分析页：聚焦煤耗、厂用电率、水耗、单机组能效对标，搭配多时段趋势曲线、能耗占比饼图，支撑节能分析；
安全环保监控页：结合厂区点位地图、烟气排放实时数据、风险矩阵、作业票信息、隐患闭环台账，兼顾环保数据上报与现场安全管控。
二、设计定位：工业监控优先，风格服务业务
使用场景：生产调度大厅、集控室，环境光线偏暗，值班人员长时间远距离扫视； 核心目标：快速识别异常、读取工况、定位告警，降低值班人员的认知负担； 风格取舍：弱化炫技特效，延续传统仪表盘、就地控制柜的工业视觉记忆；三维模型只保留介质流动、状态变色，取消自动旋转、镜头漫游等冗余动画； 组件化思路：所有图表、指标卡、状态灯、列表、面板抽成公共组件，四张页面直接拼装，保障跨页面一致性，降低前端开发和后期迭代成本。
三、视觉色彩体系：统一语义，贯穿四张大屏
背景底色：深炭黑 + 石墨灰面板底色，低亮度，减少长时间盯屏带来的视觉疲劳，同时突出数据与模型； 主题强调色：金属橙，统一用于所有页面的模块标题栏、选中高亮、指标标题条，替代常见科技蓝，贴合重工火电气质； 状态色（全局统一）：绿色 = 正常运行；黄色 = 预警 / 亚健康；红色 = 故障 / 一级告警；灰色 = 检修 / 离线未投运； 辅助色：银灰色文字与分割线，面板仅搭配极弱细边框发光，发光强度压低，只做边界区分，不刺眼。
落地规则：颜色优先用来表达设备、测点状态，不作为装饰色。例如总览模型上的管道、设备色块，设备拓扑里的状态点，安全隐患列表的行底色，全部遵循同一套颜色规则。
四、固定五区布局，四张页面共用一套版式结构
顶部导航区（每页固定）：左侧项目名称，中间页面切换菜单：总览｜设备｜能耗｜安全；右侧系统时间、通讯状态、数据刷新标识；
左侧指标卡区（每页固定组件样式）：高密度核心 KPI 指标卡片组。
中央主视区（差异化核心）
右侧详情面板区：测点明细、设备参数、台账、隐患详情，支持点击中央模型 / 设备下钻查看；
底部常驻告警通栏（每页都存在）：滚动告警队列，分级展示告警位置、等级、发生时间，无论切到哪个页面，故障信息都不会丢失。
五、公共 UI 组件规范，全页面复用
指标卡片：固定内边距、标题条尺寸，数值平滑过渡，告警触发边框闪烁；
状态指示灯：圆形状态点，红绿黄灰语义固定，在三维模型、拓扑图、测点列表通用；
图表组件：深色底、淡化网格线，线条粗细统一，无花哨渐变填充；折线图、柱状图在能耗页、总览趋势、环保排放页保持一致；
面板容器：小弧度圆角，拒绝软萌大圆角，细银灰边框，弱外发光；
数据列表：告警列表、测点列表、隐患清单行高统一，告警行底色随等级变化；
三维交互组件：设备模型使用写实工业材质，区分金属壳体、保温层、管道；仅介质流动做平缓动画，无多余镜头动画。
六、业务逻辑设计：顺着电厂工作流排布信息
运行总览（看全厂有没有异常）→点击机组，跳转 / 下钻到【设备状态页】看机组拓扑、辅机测点 →选中单台设备查看参数与历史曲线；
从总览可切换到【能耗页】，查看煤耗、厂用电率是否超标，定位节能空间； 切换到【安全环保页】，核查排放数据、现场作业风险、隐患闭环进度。
七、工业化大屏设计痛点与这套方案的解决思路
特效过多：很多大屏在总览三维模型上加大量光效，容易掩盖红色告警。本方案限制动画，仅保留介质流动，一级告警才允许闪烁； 页面版式不统一：不同页面布局差别太大，值班人员换页面需要重新适应。本方案固定五区布局，只更换中间主视区； 状态色混乱：A 页面红色代表预警，B 页面红色代表停机，极易误判。整套 4 页锁定一套颜色语义； 集控室远距离看不清数字：统一规定工况数值字号，优先保障远距离可读，图表文字不做过小处理； 后期新增页面风格跑偏：基于组件库新增二期机组、脱硫脱硝子页面时，直接复用卡片、面板、图表组件，风格可控。
八、结语
从概念到落地，仅需一步！立即咨询，开启你的 专属数字孪生可视化方案 🔍
