155 lines
11 KiB
Markdown
155 lines
11 KiB
Markdown
# 运动手环UI图标需求清单
|
||
|
||
## 1. 主界面/卡片区图标
|
||
|
||
| 图标名称 | 用途/位置 | 详细要求 |
|
||
|------------------|---------------------|------------------------------------------------------------------|
|
||
| 电池 | 状态栏 | 极简线性风格，适合小尺寸，黑/白主色，高对比度 |
|
||
| 蓝牙 | 状态栏 | 极简线性，易识别，适合小尺寸 |
|
||
| 时间/日期 | 主卡片/状态栏 | 可合并为状态栏小图标，简洁 |
|
||
| 步数/运动量 | 卡片 | 脚印/跑步人，突出运动感，线条清晰 |
|
||
| 心率/健康 | 卡片 | 心形/心电波，支持动画，红/绿主色 |
|
||
| 运动模式 | 卡片 | 跑步/骑行/健走/自由训练等，每种模式独立图标，风格统一 |
|
||
| 消息/通知 | 卡片 | 信封/铃铛/气泡，支持未读红点，简洁 |
|
||
| 录音 | 卡片/操作 | 麦克风，录音时有动态波形/动画 |
|
||
| 报警 | 卡片/操作 | 警报铃/SOS/红色感叹号，报警时闪烁/动画 |
|
||
| 设置 | 卡片 | 齿轮，简洁，易识别 |
|
||
| 更多/扩展 | 卡片 | 省略号/九宫格/加号，表示更多功能入口 |
|
||
|
||
## 2. 其他常用功能图标
|
||
|
||
| 图标名称 | 用途/位置 | 详细要求 |
|
||
|--------------|--------------|----------------------------------|
|
||
| 闹钟 | 卡片/功能 | 闹钟图标，简洁 |
|
||
| 秒表 | 卡片/功能 | 秒表图标，简洁 |
|
||
| 倒计时 | 卡片/功能 | 沙漏图标，简洁 |
|
||
| 查找手机 | 卡片/功能 | 手机+放大镜/雷达，易识别 |
|
||
| 天气 | 卡片/功能 | 太阳/云/雨/温度计，风格统一 |
|
||
| 遥控拍照 | 卡片/功能 | 相机图标，简洁 |
|
||
|
||
## 3. 状态/操作类图标
|
||
|
||
| 图标名称 | 用途/位置 | 详细要求 |
|
||
|--------------|--------------|----------------------------------|
|
||
| 录音开始 | 录音界面 | 圆形录音键，突出 |
|
||
| 录音暂停 | 录音界面 | 暂停符号，清晰 |
|
||
| 录音结束 | 录音界面 | 方块，简洁 |
|
||
| 录音发送 | 录音界面 | 纸飞机/上传箭头，易识别 |
|
||
| 录音删除/重录| 录音界面 | 垃圾桶/重置箭头，简洁 |
|
||
| 报警确认 | 报警界面 | 对勾，绿色，易识别 |
|
||
| 报警取消 | 报警界面 | 叉号，红色，易识别 |
|
||
| 运动开始 | 运动界面 | 播放符号，突出 |
|
||
| 运动暂停 | 运动界面 | 暂停符号，清晰 |
|
||
| 运动结束 | 运动界面 | 停止符号，简洁 |
|
||
| 正在发送 | 消息/录音等 | 旋转箭头/上传动画，动态 |
|
||
| 未读消息 | 消息/通知 | 红点/高亮，支持动画 |
|
||
| 连接中 | 通信状态 | 旋转蓝牙/2.4G图标，动态 |
|
||
| 断开连接 | 通信状态 | 灰色蓝牙/2.4G图标，静态 |
|
||
| 可见/不可见 | 设置/蓝牙 | 眼睛/斜杠眼睛，线性，易识别 |
|
||
|
||
## 4. 状态栏小图标
|
||
|
||
| 图标名称 | 用途/位置 | 详细要求 |
|
||
|--------------|--------------|----------------------------------|
|
||
| 电池 | 状态栏 | 极简线性小图标，16x16px左右 |
|
||
| 蓝牙 | 状态栏 | 极简线性小图标，16x16px左右 |
|
||
| 2.4G | 状态栏 | 极简线性小图标，16x16px左右 |
|
||
| 勿扰 | 状态栏 | 极简线性小图标，16x16px左右 |
|
||
| 闹钟 | 状态栏 | 极简线性小图标，16x16px左右 |
|
||
| 消息 | 状态栏 | 极简线性小图标，16x16px左右 |
|
||
|
||
---
|
||
|
||
**通用设计要求：**
|
||
- 风格统一（线性/面性任选），适合1.47英寸小屏幕
|
||
- 高对比度，主色黑/白/高饱和色
|
||
- 主图标建议32x32~48x48px，状态栏小图标16x16px
|
||
- 支持简单动画（心率、录音、报警、通信等）
|
||
- 图形简洁，易于一眼识别
|
||
- 消息、报警等支持小红点或高亮状态
|
||
|
||
**预计总图标数量：30~40个**
|
||
|
||
---
|
||
|
||
## 图标需求明细表（建议导出Excel）
|
||
|
||
| 图标名称 | 文件名 | 用途/位置 | 尺寸(px) | 风格 | 动画帧 | 备注 |
|
||
|------------|-------------------|-------------------|------------|--------|--------|----------------|
|
||
| 电池 | icon_battery | 状态栏/主界面 | 16/48 | 线性 | 否 | |
|
||
| 蓝牙 | icon_bluetooth | 状态栏/主界面 | 16/48 | 线性 | 是 | 动画：连接中 |
|
||
| 2.4G | icon_2g | 状态栏/主界面 | 16/48 | 线性 | 是 | 动画：连接中 |
|
||
| 时间/日期 | icon_time | 状态栏/主界面 | 16/48 | 线性 | 否 | |
|
||
| 步数 | icon_steps | 卡片 | 48 | 线性 | 否 | |
|
||
| 心率 | icon_heart | 卡片 | 48 | 线性 | 是 | 动画：心跳 |
|
||
| 运动-跑步 | icon_run | 卡片 | 48 | 线性 | 否 | |
|
||
| 运动-骑行 | icon_bike | 卡片 | 48 | 线性 | 否 | |
|
||
| 运动-健走 | icon_walk | 卡片 | 48 | 线性 | 否 | |
|
||
| 运动-自由 | icon_free | 卡片 | 48 | 线性 | 否 | |
|
||
| 消息 | icon_message | 卡片/状态栏 | 16/48 | 线性 | 是 | 动画：未读高亮 |
|
||
| 录音 | icon_mic | 卡片/操作 | 48 | 线性 | 是 | 动画：波形 |
|
||
| 报警 | icon_alarm | 卡片/操作 | 48 | 线性 | 是 | 动画：闪烁 |
|
||
| 设置 | icon_settings | 卡片 | 48 | 线性 | 否 | |
|
||
| 更多 | icon_more | 卡片 | 48 | 线性 | 否 | |
|
||
| 闹钟 | icon_clock | 卡片/状态栏 | 16/48 | 线性 | 否 | |
|
||
| 秒表 | icon_stopwatch | 卡片 | 48 | 线性 | 否 | |
|
||
| 倒计时 | icon_timer | 卡片 | 48 | 线性 | 否 | |
|
||
| 查找手机 | icon_findphone | 卡片 | 48 | 线性 | 否 | |
|
||
| 天气 | icon_weather | 卡片 | 48 | 线性 | 否 | 太阳/云/雨等 |
|
||
| 遥控拍照 | icon_camera | 卡片 | 48 | 线性 | 否 | |
|
||
| 录音开始 | icon_rec_start | 录音界面 | 48 | 线性 | 否 | |
|
||
| 录音暂停 | icon_rec_pause | 录音界面 | 48 | 线性 | 否 | |
|
||
| 录音结束 | icon_rec_stop | 录音界面 | 48 | 线性 | 否 | |
|
||
| 录音发送 | icon_rec_send | 录音界面 | 48 | 线性 | 否 | |
|
||
| 录音删除 | icon_rec_delete | 录音界面 | 48 | 线性 | 否 | |
|
||
| 报警确认 | icon_alarm_ok | 报警界面 | 48 | 线性 | 否 | |
|
||
| 报警取消 | icon_alarm_cancel | 报警界面 | 48 | 线性 | 否 | |
|
||
| 运动开始 | icon_sport_start | 运动界面 | 48 | 线性 | 否 | |
|
||
| 运动暂停 | icon_sport_pause | 运动界面 | 48 | 线性 | 否 | |
|
||
| 运动结束 | icon_sport_stop | 运动界面 | 48 | 线性 | 否 | |
|
||
| 正在发送 | icon_sending | 消息/录音 | 48 | 线性 | 是 | 动画 |
|
||
| 未读消息 | icon_unread | 消息/通知 | 16/48 | 线性 | 是 | 动画 |
|
||
| 连接中 | icon_connecting | 通信状态 | 16/48 | 线性 | 是 | 动画 |
|
||
| 断开连接 | icon_disconnect | 通信状态 | 16/48 | 线性 | 否 | |
|
||
| 可见 | icon_visible | 设置/蓝牙 | 48 | 线性 | 否 | |
|
||
| 不可见 | icon_invisible | 设置/蓝牙 | 48 | 线性 | 否 | |
|
||
|
||
---
|
||
|
||
|
||
---
|
||
|
||
## 图标SVG/PNG设计规范
|
||
|
||
### 1. 尺寸规范
|
||
- 主功能图标建议尺寸：**48x48px**（可适配32x32~64x64px，保证清晰度）
|
||
- 状态栏/小图标建议尺寸：**16x16px**
|
||
- 所有图标需为正方形画布，内容居中
|
||
|
||
### 2. SVG设计要求
|
||
- 使用**纯矢量**，线宽建议1.5~2px，主色黑/白/高饱和色
|
||
- 线性图标建议无填充，仅描边；面性图标填充色需高对比
|
||
- 不要嵌入字体，所有文字转为路径
|
||
- 不要使用外部图片、渐变、阴影等复杂效果
|
||
- 图标内容居中，四周留2~4px安全边距
|
||
- 文件命名建议：`icon_xxx.svg`，如`icon_heart.svg`
|
||
|
||
### 3. PNG设计要求
|
||
- 透明背景，内容居中
|
||
- 主图标导出48x48px，状态栏小图标导出16x16px
|
||
- 需保证高对比度，适合深浅色背景
|
||
- 文件命名建议：`icon_xxx.png`，如`icon_heart.png`
|
||
|
||
### 4. 通用设计建议
|
||
- 保证所有图标风格统一（线性/面性任选）
|
||
- 关键图标（心率、录音、报警、通信等）需支持简单动画帧（如心跳、波形、闪烁、旋转）
|
||
- 图标内容简洁，避免细节过多，保证1.47英寸屏幕下清晰可辨
|
||
- 消息、报警等图标需支持小红点/高亮状态（可单独出一帧）
|
||
|
||
### 5. 交付要求
|
||
- 每个图标需提供SVG源文件和PNG导出文件
|
||
- 动画图标需提供多帧PNG或SVG序列
|
||
- 提供图标清单与命名对照表
|
||
|
||
---
|