创意预览图

食堂实时监控系统UI界面设计,参考图例的蓝紫色渐变简约风格,顶部标题栏显示“食堂实时监控”,左侧为食堂各部位监控点位列表(后厨操作间、备餐间、餐厅大厅、洗消间、食材仓库、入口通道),右侧主区域为多分屏

用户头像

1q5brjneeng...

2026.08.19
[主图-3] 淘宝/天猫风格场景应用图,展示学校食堂明厨亮灶真实使用场景,专业场景感。 [统一基调] 淘宝/天猫数码家电风格,专业、品质、细节,冷灰/深灰高级背景,主标题白色或深灰色粗体无衬线字,辅助文字浅灰色,强调色用科技蓝,卡片与图标统一圆角矩形样式,整体简洁高级不堆砌,传递专业靠谱的品质感。 [画面] 真实学校食堂后厨场景,干净明亮的现代化明厨亮灶环境,厨师穿着白色工作服在不锈钢操作台前工作。半球摄像头吸顶安装在厨房天花板上,位于画面上方,呈俯视角度。画面中有半透明的蓝色AI检测框轻轻框住工作人员,标注"岗位值守检测",检测效果克制专业。右下角有一个圆角矩形监控画面小窗,显示食堂区域人流管控检测示意。整体场景真实自然,科技感融入场景不突兀。 [光影质感] 真实室内厨房光照质感,灯光明亮干净,产品安装在天花板上有自然光照,检测框为淡蓝色半透明科技效果,整体真实专业。 [配色] 场景以白色、不锈钢银色的真实食堂色调为主,科技蓝用于检测框、标签和小窗框,标题文字白色配深色半透明底。 [文字版式] 画面左侧叠加半透明深灰色条,上面放主标题"明厨亮灶 智能值守",白色粗体大字。下方小字"岗位在岗检测 食堂人流管控",字号缩小50%以上,浅灰色。检测框标签用小号白字配浅蓝底。 [输出要求] 1:1正方形比例,2K分辨率,场景真实自然,产品安装关系合理,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。[主图-3] 淘宝/天猫风格场景应用图,展示学校食堂明厨亮灶真实使用场景,专业场景感。
[统一基调] 淘宝/天猫数码家电风格,专业、品质、细节,冷灰/深灰高级背景,主标题白色或深灰色粗体无衬线字,辅助文字浅灰色,强调色用科技蓝,卡片与图标统一圆角矩形样式,整体简洁高级不堆砌,传递专业靠谱的品质感。
[画面] 真实学校食堂后厨场景,干净明亮的现代化明厨亮灶环境,厨师穿着白色工作服在不锈钢操作台前工作。半球摄像头吸顶安装在厨房天花板上,位于画面上方,呈俯视角度。画面中有半透明的蓝色AI检测框轻轻框住工作人员,标注"岗位值守检测",检测效果克制专业。右下角有一个圆角矩形监控画面小窗,显示食堂区域人流管控检测示意。整体场景真实自然,科技感融入场景不突兀。
[光影质感] 真实室内厨房光照质感,灯光明亮干净,产品安装在天花板上有自然光照,检测框为淡蓝色半透明科技效果,整体真实专业。
[配色] 场景以白色、不锈钢银色的真实食堂色调为主,科技蓝用于检测框、标签和小窗框,标题文字白色配深色半透明底。
[文字版式] 画面左侧叠加半透明深灰色条,上面放主标题"明厨亮灶 智能值守",白色粗体大字。下方小字"岗位在岗检测 食堂人流管控",字号缩小50%以上,浅灰色。检测框标签用小号白字配浅蓝底。
[输出要求] 1:1正方形比例,2K分辨率,场景真实自然,产品安装关系合理,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。
[主图-3] 校园食堂明厨亮灶场景应用图,展示AI监控在学校食堂的实际使用场景。 [统一基调] 淘宝/天猫数码家电风格,专业科技感,主标题白色粗体无衬线字,辅助文字浅灰蓝色,强调色用荧光科技蓝,卡片与图标统一圆角矩形样式,整体智能高端不堆砌。 [画面] 真实学校食堂后厨场景,干净明亮的明厨亮灶环境,多位厨师穿着白色工作服在操作台前工作。半球摄像头吸顶安装在厨房天花板上方,呈俯视角度,产品位于画面上方。画面中有半透明的蓝色AI检测框框住厨师人员,标注"岗位值守检测",旁边有一个状态指示图标显示在岗正常。右下角有一个监控画面小窗,显示食堂打餐区域的人流管控检测效果,标注"人流管控"。 [光影质感] 真实室内厨房光照质感,灯光明亮干净,产品安装在天花板上有自然光照,检测框为半透明蓝色科技光效,整体真实且有科技感。 [配色] 场景以白色、不锈钢银色的真实食堂色调为主,科技蓝用于检测框、标签和强调元素,标题文字白色配深色半透明底。 [文字版式] 画面左侧叠加半透明深色条,上面放主标题"明厨亮灶 智能值守",白色粗体大字。旁边小字"岗位在岗检测 食堂人流管控",字号缩小50%以上。检测框标签用小号白字蓝底。 [输出要求] 1:1正方形比例,2K分辨率,场景真实自然,产品安装关系合理,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。[主图-3] 校园食堂明厨亮灶场景应用图,展示AI监控在学校食堂的实际使用场景。
[统一基调] 淘宝/天猫数码家电风格,专业科技感,主标题白色粗体无衬线字,辅助文字浅灰蓝色,强调色用荧光科技蓝,卡片与图标统一圆角矩形样式,整体智能高端不堆砌。
[画面] 真实学校食堂后厨场景,干净明亮的明厨亮灶环境,多位厨师穿着白色工作服在操作台前工作。半球摄像头吸顶安装在厨房天花板上方,呈俯视角度,产品位于画面上方。画面中有半透明的蓝色AI检测框框住厨师人员,标注"岗位值守检测",旁边有一个状态指示图标显示在岗正常。右下角有一个监控画面小窗,显示食堂打餐区域的人流管控检测效果,标注"人流管控"。
[光影质感] 真实室内厨房光照质感,灯光明亮干净,产品安装在天花板上有自然光照,检测框为半透明蓝色科技光效,整体真实且有科技感。
[配色] 场景以白色、不锈钢银色的真实食堂色调为主,科技蓝用于检测框、标签和强调元素,标题文字白色配深色半透明底。
[文字版式] 画面左侧叠加半透明深色条,上面放主标题"明厨亮灶 智能值守",白色粗体大字。旁边小字"岗位在岗检测 食堂人流管控",字号缩小50%以上。检测框标签用小号白字蓝底。
[输出要求] 1:1正方形比例,2K分辨率,场景真实自然,产品安装关系合理,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。
[主图-4] 多场景应用矩阵图,展示电梯、教室、办公室等多场景AI监控应用。 [统一基调] 淘宝/天猫数码家电风格,专业科技感,深蓝科技渐变背景,主标题白色粗体无衬线字,辅助文字浅灰蓝色,强调色用荧光科技蓝,卡片与图标统一圆角矩形样式,整体智能高端不堆砌。 [画面] 画面顶部中央放置半球摄像头产品,占画面约25%,产品下方有蓝色光线向下发散,连接到下方四个场景小窗,形成"一台设备覆盖多场景"的视觉逻辑。下方采用2×2场景矩阵布局,每个场景小窗展示一个应用场景:左上是电梯轿厢内监控场景,标注"电梯安全监控";右上是教室课堂场景,标注"教室智能监控";左下是办公室场景,标注"办公区域安防";右下是食堂后厨场景,标注"后厨岗位值守"。每个小窗内都有淡淡的AI检测框效果。 [光影质感] 产品光影与首图一致,场景小窗为真实场景摄影质感,连接光线为柔和科技蓝光效,整体层次分明。 [配色] 背景深蓝色,场景小窗为真实场景色,连接光线和边框用科技蓝,文字白色。 [文字版式] 画面顶部主标题"四大场景 智能覆盖",白色粗体大字。每个场景小窗底部有半透明深色条,上面放场景名称标签,小号白色字。 [输出要求] 1:1正方形比例,2K分辨率,产品清晰,场景丰富,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。[主图-4] 多场景应用矩阵图,展示电梯、教室、办公室等多场景AI监控应用。
[统一基调] 淘宝/天猫数码家电风格,专业科技感,深蓝科技渐变背景,主标题白色粗体无衬线字,辅助文字浅灰蓝色,强调色用荧光科技蓝,卡片与图标统一圆角矩形样式,整体智能高端不堆砌。
[画面] 画面顶部中央放置半球摄像头产品,占画面约25%,产品下方有蓝色光线向下发散,连接到下方四个场景小窗,形成"一台设备覆盖多场景"的视觉逻辑。下方采用2×2场景矩阵布局,每个场景小窗展示一个应用场景:左上是电梯轿厢内监控场景,标注"电梯安全监控";右上是教室课堂场景,标注"教室智能监控";左下是办公室场景,标注"办公区域安防";右下是食堂后厨场景,标注"后厨岗位值守"。每个小窗内都有淡淡的AI检测框效果。
[光影质感] 产品光影与首图一致,场景小窗为真实场景摄影质感,连接光线为柔和科技蓝光效,整体层次分明。
[配色] 背景深蓝色,场景小窗为真实场景色,连接光线和边框用科技蓝,文字白色。
[文字版式] 画面顶部主标题"四大场景 智能覆盖",白色粗体大字。每个场景小窗底部有半透明深色条,上面放场景名称标签,小号白色字。
[输出要求] 1:1正方形比例,2K分辨率,产品清晰,场景丰富,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。
[主图-4] 淘宝/天猫风格多场景应用图,展示电梯、教室、办公室、食堂四大场景,专业矩阵布局。 [统一基调] 淘宝/天猫数码家电风格,专业、品质、细节,冷灰/深灰高级背景,主标题白色或深灰色粗体无衬线字,辅助文字浅灰色,强调色用科技蓝,卡片与图标统一圆角矩形样式,整体简洁高级不堆砌,传递专业靠谱的品质感。 [画面] 画面顶部中央放置半球摄像头产品,占画面约20%,产品下方有淡淡的蓝色光线向下发散,连接到下方四个场景卡片,形成"一台设备覆盖多场景"的视觉逻辑。下方采用2×2场景矩阵布局,每个场景卡片为圆角矩形,带细微阴影:左上电梯轿厢内监控场景,标注"电梯安全监控";右上教室课堂场景,标注"教室智能监控";左下办公室场景,标注"办公区域安防";右下食堂后厨场景,标注"后厨岗位值守"。每个场景图内有淡淡的蓝色AI检测标识。 [光影质感] 产品光影与首图一致,场景卡片为真实场景摄影质感,卡片有轻微悬浮阴影,连接光线为柔和淡蓝色光效,整体层次分明。 [配色] 背景中灰色,场景卡片为真实场景色,卡片边框和连接线用科技蓝,文字白色和深灰色。 [文字版式] 画面顶部主标题"四大场景 智能覆盖",白色粗体大字。每个场景卡片底部有半透明深色条,上面放场景名称标签,小号白色字。 [输出要求] 1:1正方形比例,2K分辨率,产品清晰,场景丰富专业,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。[主图-4] 淘宝/天猫风格多场景应用图,展示电梯、教室、办公室、食堂四大场景,专业矩阵布局。
[统一基调] 淘宝/天猫数码家电风格,专业、品质、细节,冷灰/深灰高级背景,主标题白色或深灰色粗体无衬线字,辅助文字浅灰色,强调色用科技蓝,卡片与图标统一圆角矩形样式,整体简洁高级不堆砌,传递专业靠谱的品质感。
[画面] 画面顶部中央放置半球摄像头产品,占画面约20%,产品下方有淡淡的蓝色光线向下发散,连接到下方四个场景卡片,形成"一台设备覆盖多场景"的视觉逻辑。下方采用2×2场景矩阵布局,每个场景卡片为圆角矩形,带细微阴影:左上电梯轿厢内监控场景,标注"电梯安全监控";右上教室课堂场景,标注"教室智能监控";左下办公室场景,标注"办公区域安防";右下食堂后厨场景,标注"后厨岗位值守"。每个场景图内有淡淡的蓝色AI检测标识。
[光影质感] 产品光影与首图一致,场景卡片为真实场景摄影质感,卡片有轻微悬浮阴影,连接光线为柔和淡蓝色光效,整体层次分明。
[配色] 背景中灰色,场景卡片为真实场景色,卡片边框和连接线用科技蓝,文字白色和深灰色。
[文字版式] 画面顶部主标题"四大场景 智能覆盖",白色粗体大字。每个场景卡片底部有半透明深色条,上面放场景名称标签,小号白色字。
[输出要求] 1:1正方形比例,2K分辨率,产品清晰,场景丰富专业,文字清晰可读,无变形、错字、模糊、杂乱、水印、平台Logo。禁止出现极限词、违禁词。
「图片1」### 顶部导航栏 - 左侧:返回箭头 `<` - 中间标题:**告警** - 右侧:更多菜单图标 `⋯` ### 2. 顶部 Tab 标签栏 当前页面处于告警管理相关模块,Tab 包括: - 控制 - 档案 - 动态 - 维保 - 巡检 - **告警**:当前高亮 - 生命周期 说明这是一个设备全生命周期管理系统,告警只是其中一个子模块。 --- ### 3. 告警概览区 位于页面顶部,用三个数字卡片展示告警统计: 表格 | 指标 | 数值 | 说明 | | --- | --- | --- | | 今日告警 | 2 | 当天产生的告警数量 | | 待确认 | 1 | 尚未处理确认的告警 | | 已恢复 | 1 | 已经恢复或关闭的告警 | 右上角有一个蓝色标签:**1 待确认**,提示当前有待处理告警。 --- ### 4. 告警明细区 这是页面核心内容,展示两条告警记录。 #### 第一条告警:画面遮挡告警 - 类型:**画面遮挡告警** - 时间:2026-06-09 10:23 - 状态:**待确认**,橙色 / 黄色标签 - 风险等级:**高** - 设备名称:暖通演示楼 / 2F / 二楼东侧 - 事件描述:AI 值守 核查遮挡摄像头角度 这条属于**视频 / 摄像头类智能告警**,系统识别到摄像头可能被遮挡,需要人工确认。 #### 第二条告警:心跳延迟告警 - 类型:**心跳延迟告警** - 时间:2026-06-08 18:30 - 状态:**已恢复**,绿色标签 - 风险等级:中 - 设备名称:设备名称 - 事件描述:设备心跳超时,离线后恢复 这条属于**设备联网状态告警**,说明设备曾经失联,后来重新上线。 --- ### 5. 处置记录区 - 标题:**处置记录** - 内容:已生成安全事件 - 状态:**待补充** 说明系统已经生成了事件记录,但处理备注或工单信息还没有完全填写。 --- ## 三、页面业务定位 这个页面主要用于**运维人员查看和处理设备告警**,核心作用是: 1. 快速了解今日告警数量 2. 判断哪些告警待处理 3. 查看告警类型、设备位置和风险等级 4. 确认摄像头遮挡、设备离线等异常事件 5. 记录后续处置结果 --- ## 四、页面信息结构总结 ``` 顶部导航:返回 / 告警标题 / 更多 ↓ Tab导航:控制 / 档案 / 动态 / 维保 / 巡检 / 告警 / 生命周期 ↓ 告警概览:今日告警 / 待确认 / 已恢复 ↓ 告警明细:画面遮挡告警 / 心跳延迟告警 ↓ 处置记录:已生成安全事件,待补充 帮我生成APP「图片1」###  顶部导航栏

- 左侧:返回箭头 `<`
- 中间标题:**告警**
- 右侧:更多菜单图标 `⋯`

### 2. 顶部 Tab 标签栏

当前页面处于告警管理相关模块,Tab 包括:

- 控制
- 档案
- 动态
- 维保
- 巡检
- **告警**:当前高亮
- 生命周期

说明这是一个设备全生命周期管理系统,告警只是其中一个子模块。

---

### 3. 告警概览区

位于页面顶部,用三个数字卡片展示告警统计:

表格

| 指标 | 数值 | 说明 |
| --- | --- | --- |
| 今日告警 | 2 | 当天产生的告警数量 |
| 待确认 | 1 | 尚未处理确认的告警 |
| 已恢复 | 1 | 已经恢复或关闭的告警 |

右上角有一个蓝色标签:**1 待确认**,提示当前有待处理告警。

---

### 4. 告警明细区

这是页面核心内容,展示两条告警记录。

#### 第一条告警:画面遮挡告警

- 类型:**画面遮挡告警**
- 时间:2026-06-09 10:23
- 状态:**待确认**,橙色 / 黄色标签
- 风险等级:**高**
- 设备名称:暖通演示楼 / 2F / 二楼东侧
- 事件描述:AI 值守 核查遮挡摄像头角度

这条属于**视频 / 摄像头类智能告警**,系统识别到摄像头可能被遮挡,需要人工确认。

#### 第二条告警:心跳延迟告警

- 类型:**心跳延迟告警**
- 时间:2026-06-08 18:30
- 状态:**已恢复**,绿色标签
- 风险等级:中
- 设备名称:设备名称
- 事件描述:设备心跳超时,离线后恢复

这条属于**设备联网状态告警**,说明设备曾经失联,后来重新上线。

---

### 5. 处置记录区

- 标题:**处置记录**
- 内容:已生成安全事件
- 状态:**待补充**

说明系统已经生成了事件记录,但处理备注或工单信息还没有完全填写。

---

## 三、页面业务定位

这个页面主要用于**运维人员查看和处理设备告警**,核心作用是:

1. 快速了解今日告警数量
2. 判断哪些告警待处理
3. 查看告警类型、设备位置和风险等级
4. 确认摄像头遮挡、设备离线等异常事件
5. 记录后续处置结果

---

## 四、页面信息结构总结

```
顶部导航:返回 / 告警标题 / 更多
↓
Tab导航:控制 / 档案 / 动态 / 维保 / 巡检 / 告警 / 生命周期
↓
告警概览:今日告警 / 待确认 / 已恢复
↓
告警明细:画面遮挡告警 / 心跳延迟告警
↓
处置记录:已生成安全事件,待补充
帮我生成APP