211 lines
10 KiB
Markdown
211 lines
10 KiB
Markdown
# 运动手环界面UI需求与说明文档
|
||
|
||
## 一、硬件与系统基础
|
||
|
||
- **屏幕规格**：1.47英寸 TFT IPS 液晶屏（对角线），分辨率建议194×368或类似，支持多点触控。
|
||
- **主控系统**：FreeRTOS 实时操作系统。
|
||
- **交互方式**：触摸+物理按键（有），支持滑动、点击、长按等手势。
|
||
- **通信模式**：支持蓝牙（BLE）和2.4G无线两种通信方式，界面需显示当前工作模式。
|
||
|
||
## 二、核心交互与特色功能
|
||
|
||
### 1. 一键报警
|
||
- **入口**：主界面下方或侧边物理按键，或在主菜单中突出显示“报警”图标。
|
||
- **操作流程**：
|
||
- 用户长按/双击报警键或图标，弹出确认界面（防误触）。
|
||
- 确认后，手环通过蓝牙/网关/手机App发送报警信号（含用户ID、时间、位置信息等）。
|
||
- UI需有报警状态反馈（如红色动画、震动提示）。
|
||
- **安全性**：需防止误触，建议二次确认或长按2秒以上。
|
||
|
||
### 2. 录音并发送
|
||
- **入口**：主界面快捷入口或功能菜单。
|
||
- **操作流程**：
|
||
- 用户点击“录音”图标，进入录音界面，显示录音时长、剩余时间。
|
||
- 支持开始、暂停、结束、重录等操作。
|
||
- 录音完成后，用户可选择发送（通过蓝牙/网关/手机App上传）。
|
||
- UI需有录音动画、进度条、发送状态提示。
|
||
- **存储与传输**：录音文件本地缓存，支持断点续传。
|
||
|
||
## 三、常规功能UI设计
|
||
|
||
### 1. 运动与健康监测
|
||
- **首页**：显示时间、步数、心率、卡路里、天气等信息，支持自定义卡片布局。
|
||
- **运动模式**：跑步、骑行、健走、自由训练等，进入后显示实时数据（配速、距离、心率、时长等）。
|
||
- **健康监测**：心率、血氧、睡眠、压力、体温等，支持历史数据曲线查看。
|
||
|
||
### 2. 消息与通知
|
||
- **消息提醒**：短文字消息、App通知，支持查看和简单回复（如快捷短语，录音）。
|
||
- **报警/录音消息**：有专属消息列表，显示报警/录音历史及状态。
|
||
|
||
### 3. 设备设置
|
||
- **亮度、音量、勿扰、蓝牙、2.4G模式切换、系统信息等设置界面**。
|
||
- **通信模式显示与切换**：主界面/设置界面需有当前通信模式（蓝牙/2.4G）状态显示，支持手动切换（如有权限）。
|
||
- **蓝牙连接管理**：设置界面支持蓝牙配对、断开、重连、可见性设置，显示当前蓝牙连接状态。
|
||
- **表盘切换**：支持多种表盘风格，长按首页切换。
|
||
- **表盘风格说明**：
|
||
- **经典数字表盘**：大号数字显示当前时间（小时/分钟），下方小字显示日期、星期，适合喜欢简洁、易读时间的用户。
|
||
- **指针模拟表盘**：模拟传统手表的时针、分针、秒针，配合圆形刻度，可嵌入步数、心率等小型圆环。
|
||
- **运动数据表盘**：主区域突出显示步数、心率、卡路里等运动数据，时间为次要信息，适合注重运动健康的用户。
|
||
- **信息聚合表盘**：同时显示时间、天气、步数、心率、电量等多项信息，采用分区或卡片式布局，支持自定义显示项。
|
||
- **极简艺术表盘**：以艺术插画、极简线条、色块为主，时间/日期以小字显示，适合追求个性、时尚的用户。
|
||
- **动态/动画表盘**：背景或元素有动态效果（如心跳、波浪、运动人物动画），动画可与步数、心率等数据联动。
|
||
- **照片/自定义表盘**：用户可上传照片或选择图库图片作为背景，时间/数据以悬浮方式显示，支持自定义字体、颜色。
|
||
- **表盘设置**：支持表盘样式、颜色、字体、信息显示项等自定义设置。
|
||
|
||
### 4. 其他常用功能
|
||
- **闹钟、秒表、倒计时、查找手机、天气、遥控拍照等**。
|
||
|
||
## 四、UI风格与交互细节
|
||
|
||
- **风格**：简洁、直观、运动感强，色彩明快，图标大且易识别。
|
||
- **字体**：高对比度，适合户外强光下阅读。
|
||
- **动画**：交互有反馈（如按钮按下、滑动切换、报警/录音时的动态效果）。
|
||
- **适配**：所有界面适配1.47英寸长条形屏幕，重要信息优先显示，支持上下滑动查看更多内容。
|
||
|
||
## 五、特殊注意事项
|
||
|
||
- **低功耗优化**：UI动画、亮度、刷新率需兼顾续航。
|
||
- **误触防护**：报警、录音等关键操作需二次确认或长按触发。
|
||
- **无障碍支持**：高对比度模式、大字体、震动反馈等。
|
||
|
||
## 六、原型图与界面流程图（文字版）
|
||
|
||
### 1. 主界面（卡片式滑动）
|
||
|
||
- 每屏为一张功能卡片，内容包括：
|
||
- 时间/日期/电量/蓝牙/2.4G模式（主卡片，需显示当前通信模式及连接状态）
|
||
- 步数/运动量
|
||
- 心率/健康
|
||
- 运动快捷入口
|
||
- 消息/通知
|
||
- 录音/报警（可单独卡片或与消息合并）
|
||
- 左右滑动切换卡片，点击/长按进入详情或功能页。
|
||
- 物理按键可自定义为一键报警、录音等高优先级功能。
|
||
|
||
### 2. 运动模式流程（示意图+说明）
|
||
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ 运动模式选择卡片 │
|
||
│ [跑步] [骑行] [健走] ... │
|
||
└─────────────────────────────┘
|
||
↓ 选择后进入
|
||
┌─────────────────────────────┐
|
||
│ 跑步模式详情 │
|
||
│ 距离: 2.1km 心率: 120 │
|
||
│ 配速: 6'00"/km 时间: 12:45│
|
||
│ [暂停] [结束] │
|
||
└─────────────────────────────┘
|
||
↓ 结束后
|
||
┌─────────────────────────────┐
|
||
│ 运动总结 │
|
||
│ 距离、配速、心率曲线等 │
|
||
│ [返回] [分享] │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
- 运动模式入口为卡片或图标，左右滑动选择运动类型。
|
||
- 进入运动后，主界面实时显示核心数据，底部为暂停/结束等操作图标。
|
||
- 运动结束后自动进入总结页，显示本次运动数据和历史对比。
|
||
- 所有操作按钮（如暂停、结束）均优先用图标，必要时下方配小字说明。
|
||
|
||
### 3. 健康监测流程
|
||
- 首页 → 健康（图标/卡片）→ 选择心率/血氧/睡眠/压力/体温
|
||
- 进入详情页：显示实时数据与历史曲线
|
||
|
||
### 4. 消息与报警/录音流程
|
||
- 首页 → 消息（图标/卡片）→ 消息列表（来电/短信/报警/录音）
|
||
- 报警/录音消息可查看历史、状态、重发
|
||
|
||
### 5. 一键报警流程
|
||
- 首页/物理按键/快捷入口 → 长按/双击报警 → 弹出确认界面
|
||
- 确认后报警，显示报警动画与反馈
|
||
- 报警历史可在消息中心查看
|
||
|
||
### 6. 录音并发送流程
|
||
- 首页/快捷入口 → 录音 → 录音界面（开始/暂停/结束/重录）
|
||
- 录音完成后可发送，显示发送状态
|
||
- 录音历史可在消息中心查看
|
||
|
||
### 7. 设备设置流程
|
||
- 首页 → 设置（图标/卡片）→ 亮度/音量/勿扰/蓝牙/2.4G模式切换/系统信息/表盘切换
|
||
|
||
### 8. 其他功能流程
|
||
- 首页 → 更多 → 闹钟、秒表、倒计时、查找手机、天气、遥控拍照等
|
||
|
||
---
|
||
|
||
**建议：**
|
||
- 可用墨刀、Axure、Figma等工具根据上述流程绘制高保真原型图。
|
||
- 每个流程节点建议配有界面草图（如有美工/交互支持可补充）。
|
||
|
||
---
|
||
|
||
## 七、表盘风格示意图（文字版）
|
||
|
||
> 以下为每种表盘风格的界面布局文字示意，便于设计师或开发参考：
|
||
|
||
### 1. 经典数字表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ 12:45 │ ← 大号数字时间
|
||
│ 2025/05/28 │ ← 日期
|
||
│ 周三 电量 蓝牙 │ ← 状态栏小图标
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
### 2. 指针模拟表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ (圆形表盘) │
|
||
│ 时针/分针/秒针 │
|
||
│ 步数/心率小圆环/指示灯 │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
### 3. 运动数据表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ 步数: 8,888 │
|
||
│ 心率: 78 bpm │
|
||
│ 卡路里: 320 kcal │
|
||
│ 时间: 12:45 │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
### 4. 信息聚合表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ 12:45 天气: 晴 28℃ │
|
||
│ 步数:8888 心率:78 电量:90% │
|
||
│ 运动: 跑步 2.1km │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
### 5. 极简艺术表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ (插画/色块/极简图形) │
|
||
│ 12:45 │
|
||
│ 05/28 │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
### 6. 动态/动画表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ (动态心跳/波浪/运动动画) │
|
||
│ 12:45 步数:8888 │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
### 7. 照片/自定义表盘
|
||
```
|
||
┌─────────────────────────────┐
|
||
│ (用户照片/自定义背景) │
|
||
│ 12:45 步数:8888 │
|
||
└─────────────────────────────┘
|
||
```
|
||
|
||
> 以上为文字示意，实际UI可根据屏幕比例、品牌风格进一步美化和细化。
|