Files
forsetsystem/docs/04_UI原型设计.md
shenjianZ e63267cef6 feat: 将数据集从国外员工缺勤数据替换为中国企业缺勤模拟数据
- 新增中国企业员工缺勤模拟数据集生成脚本(generate_dataset.py),覆盖7个行业、180家企业、2600名员工
  - 重构 config.py,更新特征字段为中文名称,调整目标列、员工ID、行业类型等配置
  - 重构 clustering.py,简化聚类逻辑,更新聚类特征和群体命名(高压通勤型、健康波动型等)
  - 重构 feature_mining.py,更新相关性分析和群体比较维度(按行业、班次、婚姻状态等)
  - 新增 model_features.py 定义模型训练特征
  - 更新 preprocessing.py 和 train_model.py 适配新数据结构
  - 更新各 API 路由默认参数(model: random_forest, dimension: industry)
  - 前端更新主题样式和各视图组件适配中文字段
  - 更新系统名称为 China Enterprise Absence Analysis System
2026-03-11 10:46:58 +08:00

2.1 KiB

UI原型设计

1. 设计目标

  • 界面适合毕业设计展示和答辩演示
  • 页面层次清楚,重点内容突出
  • 图表、卡片和表单布局统一
  • 兼顾桌面端展示效果与基本响应式适配

2. 整体设计风格

  • 左侧为固定导航栏
  • 右侧为主内容区域
  • 采用卡片化布局组织统计、图表和预测内容
  • 通过浅色/深色模式增强视觉表现
  • 侧边栏支持折叠,提高界面灵活性

3. 页面原型说明

3.1 数据概览页

页面组成:

  • 顶部页面头图
  • 第一行 KPI 卡片
  • 第二行趋势图与星期分布图
  • 第三行原因分布与季节分布图

展示重点:

  • 让评审快速看到系统能做总体统计与可视化

3.2 影响因素分析页

页面组成:

  • 页面头图
  • 特征重要性横向条形图
  • 相关性热力图
  • 群体对比柱状图

展示重点:

  • 模型可解释性
  • 关键因素主次关系

3.3 缺勤预测页

页面组成:

  • 页面头图
  • 左侧多卡片输入区
  • 右侧结果与风险说明整合卡片
  • 模型对比卡片

展示重点:

  • 界面紧凑、核心输入突出
  • 结果展示直观
  • 风险说明清晰易讲解

3.4 员工画像页

页面组成:

  • 页面头图
  • 雷达图卡片
  • 聚类结果表格卡片
  • 散点图卡片

展示重点:

  • 呈现人群分层能力
  • 用“典型群体”增强答辩展示效果

4. 导航设计

  • 数据概览
  • 影响因素
  • 缺勤预测
  • 员工画像

导航要求:

  • 显示图标与文字
  • 支持侧边栏折叠
  • 折叠后保留图标

5. 视觉元素设计

  • KPI 使用大数字卡片
  • 图表外层统一卡片边框和圆角
  • 表单采用卡片分组,避免长表单垂直堆叠
  • 预测结果使用重点色突出
  • 风险等级使用颜色标签区分

6. 交互设计

  • 支持模型自动选择
  • 支持查看模型对比
  • 支持深色模式切换
  • 支持侧边栏折叠

7. 答辩展示建议

  • 先展示数据概览页,说明系统整体能力
  • 再进入影响因素页解释模型逻辑
  • 然后演示缺勤预测页输入与结果
  • 最后展示员工画像页总结系统分析能力