59 lines
1.2 KiB
Markdown
59 lines
1.2 KiB
Markdown
# 神射手数据中台 - 原型设计规范
|
||
|
||
> 📅 更新: 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)
|