# 【Hello AI 科技致善】用 TRAE SOLO 打造五合一残障群体无障碍辅助 PWA
## ① 摘要
面向听障、视障、认知障碍、肢体障碍及老年群体，在日常沟通、出行、家务等场景下提供基于摄像头的手语转语音、AI 场景描述、任务分步引导、语音控制、大字交互五大辅助能力，全部由 TRAE SOLO 从零搭建，已在 Chrome / Safari / Android WebView 上完成 5 个模块的全链路自测。
—
## ② 真实场景与需求
**目标人群：** 听障、视障、认知障碍、肢体障碍人士及 65 岁以上老年群体——中国有超过 8500 万残障人士和 2 亿老年人。
**痛点描述：**
- ****听障人士****在超市、医院等场景下无法用手语与不懂手语的服务人员沟通，点餐、问路、挂号都成了难题
- ****视障人士****独自出行时看不清红绿灯、辨不出障碍物、无法感知周围环境，安全隐患极大
- ****认知障碍群体****执行"吃药"“做饭”"出门"等日常任务时记不住步骤，常常做到一半就中断
- ****肢体障碍人士****无法使用触屏操作手机，连打电话、看时间都需要他人协助
- ****老年人****面对 App 按钮太小、流程太长，“找不到、点不准、看不懂”
**现有做法：** 专业助听设备上万元、盲杖和导盲犬覆盖有限、康复训练 App 功能单一且操作复杂。免费、跨障碍、开箱即用的方案几乎没有。
—
## ③ 作品介绍
**Hello AI 无障碍辅助** 是一款基于浏览器的 PWA 应用，无需安装、支持离线，打开网页即用。
| 辅助模式 | 核心功能 | 技术实现 |
|----------|----------|----------|
| 
听障辅助 | 摄像头识别 100+ 中国手语词汇 → 实时转语音播报，支持自定义训练扩展 | MediaPipe Hands + KNN 分类器 + Web Speech API |
| 
视障辅助 | AI 实时场景描述、颜色识别、光线检测、障碍物提醒、紧急求助一键拨打 | MiMo-V2-Omni VL 模型 + 语音合成 + GPS |
| 
认知辅助 | 6 套日常任务分步引导（吃药、散步、打电话等），每步语音+文字提示 | 任务模板引擎 + 语音播报 |
| 
肢体辅助 | 全语音控制——“打开听障模式”“帮我拍照”“拨打 120”，无需触屏 | Web Speech Recognition |
| 
老年辅助 | 超大按钮、AI 新闻播报、舒缓音乐播放、天气查询、吃药提醒 | 自适应 UI + AI 聊天 + Web Audio API |
**附加能力：** 用户登录系统（JWT）、云端数据同步、高对比度/大字体/语音播报全局开关、PWA 离线支持。
> 
— 首页总览，展示五个模式卡片的主界面截图
—
## ④ 用 TRAE SOLO 实现的过程
### 任务拆解
整个项目拆成 5 轮迭代，每轮聚焦一个模块：
1. **基础框架 + 听障模块** — HTML 骨架、CSS 主题系统、MediaPipe 手势识别
2. **视障模块** — 摄像头画面分析、语音合成、障碍物检测
3. **认知 + 肢体模块** — 任务步骤引导、语音命令引擎
4. **老年模块 + 全局无障碍** — 大字模式、高对比度、AI 新闻/音乐
5. **后端 + PWA** — Express + SQLite、JWT 认证、Service Worker 离线缓存
### SOLO 能力使用
- **页面生成：** “我要一个深色科技风的无障碍辅助页面，有五个模式卡片” → SOLO 生成完整 HTML + CSS + 响应式布局
- **功能集成：** “用 MediaPipe 实现摄像头手势识别，识别到手势后用语音播报” → 完整集成代码
- **后端搭建：** “Express 后端，支持用户注册登录、JWT 认证、SQLite 存储” → 完整路由和中间件
- **迭代修改：** 每次发现 bug 直接描述给 SOLO，比如"Safari 语音播报没声音"，自动排查修复
### 关键 Prompt 示例
> “手语模块为 100+ 常用中国手语词汇生成模拟 MediaPipe landmarks 训练数据，每个词汇 18 个带噪声变体，让 KNN 分类器开箱即用”
> “后端 AI 接口接入小米 MiMo-V2-Omni 多模态 VL 模型，替代 OpenAI，实现免费的视觉场景理解”
> “老年模块的听新闻功能改为调用 AI 接口生成新闻摘要，听音乐改为 Web Audio API 播放舒缓五声音阶旋律”
### 踩过的坑
1. **MediaPipe 模型加载慢：** 弱网下经常超时。解决：添加加载进度条和重试机制
2. **Web Speech API 兼容性：** Safari 后台静音、Chrome 不支持部分中文口音。解决：浏览器检测 + 降级方案
3. **摄像头权限差异：** iOS 需要 HTTPS 才能调用摄像头。解决：统一 getUserMedia + 权限状态引导
> — SOLO 对话界面截图，展示你和 SOLO 协作的过程
—
## ⑤ 成果展示
- **在线体验：** https://hello-ai-accessibility.netlify.app （pc端体验，后续优化移动端）
- **代码仓库：** https://github.com/fuwawas/hello-ai-accessibility
- **演示视频：** [待补充视频链接]
### 功能截图
> — 听障辅助：手势识别界面，摄像头画面中显示手部关键点，底部显示识别结果和语音播报
> — 视障辅助：AI 场景描述界面，摄像头画面 + AI 描述文字 + 颜色/光线信息
> — 认知辅助：任务分步引导界面，显示当前步骤说明和操作按钮
> — 肢体辅助：语音命令控制界面，显示识别到的语音指令和执行反馈
> — 老年辅助：大按钮简化界面，8 个快捷操作按钮
## ⑥ 验证方式与下一步
### 已完成的验证
- **全模块自测：** 5 个辅助模式在 Chrome / Safari / Android WebView 上完成功能测试，核心流程全部跑通
- **演示视频：** 录制了完整功能演示视频（待上传）时间比较赶，刚忙完学校的事，才做好。。。后续上传。或者自己去上手，地址已奉上。。
- **目标用户试用：** 邀请身边有需求的朋友试用，反馈"手势识别很灵敏"“语音播报声音够大”“按钮够大看得见”
### 下一步计划！！！！！！
1. 对接大厂企业训练数据，增加流畅度和准确度，增加安全场景覆盖
2. 增加方言语音识别，覆盖更多老年用户
3. 与社区残障服务机构合作，进行真实场景测试
4. 开发微信小程序版本，降低使用门槛
5.修复已知问题，优化用户体验，主页后续会添加引导功能，更贴切残障群体的使用习惯（因个人精力有限，还有学业任务，所以后续进度可能较慢，持续更新会在github地址，敬请期待）
用 TRAE SOLO，一个人也能做出有温度的产品。科技致善，不是口号，是每一个功能背后的具体关怀。
