# 神射手数据中台 - 原型设计规范

> 📅 更新: 2026-01-31

---

## 一、设计原则

| 原则 | 说明 |
|:---|:---|
| 极简 | 苹果毛玻璃风格 |
| 高效 | 流量入口显眼、数据清晰 |
| 一致 | 5大模块统一布局 |

---

## 二、界面规范

### 2.1 页面路径
| 模块 | 路径 | 说明 |
|:---|:---|:---|
| 首页 | / | AI对话 |
| 数据接入 | /data-ingestion/* | 5个子页 |
| 标签画像 | /tag-portrait/* | 3个子页 |
| AI Agent | /ai-agent/* | 4个子页 |
| 数据市场 | /data-market/* | 2个子页 |
| 系统监控 | /monitoring/* | 3个子页 |

### 2.2 导航结构
- 左侧：5大模块 + 系统监控
- 顶部：标题、刷新
- 内容区：卡片式布局

### 2.3 交互规范
- 加载：Skeleton 骨架屏
- 转场：淡入淡出
- 反馈：Toast 提示

---

## 三、UI规范（苹果毛玻璃）

```css
/* 页面背景 */
bg-gradient-to-br from-slate-50 via-blue-50/30 to-purple-50/20

/* 卡片 */
bg-white/80 backdrop-blur border-slate-200/60 rounded-xl shadow-lg

/* 按钮 */
bg-gradient-to-r from-blue-500 to-purple-500
```

---

## 四、关联文档
- [页面结构.md](./页面结构.md)
- [../4、前端/前端开发规范.md](../4、前端/前端开发规范.md)