【标题】
【社会服务赛道】安伴AnBan——端侧AI独居老人智能守护系统
【正文】 至少包含以下 4 个部分，可以增加额外的部分（比如自我介绍、经验总结、踩坑复盘等）
0. 先和大家打个招呼吧 
-
你是谁：
一名关注银发经济的独立开发者，希望用科技为独居老人带来安心守护。你是怎么用 TRAE 把 Demo 做出来的：
一开始我只是有个模糊的想法——想做一个无感守护老人的系统，但不知道从何下手。我打开 TRAE 后，先跟它描述了我的创意和痛点，它帮我梳理出了完整的产品需求文档（PRD）和技术架构方案。最让我惊喜的是，我只需要描述"我想要一个显示老人状态的仪表盘"，它就能自动生成完整的前端页面和后端API，包括Mock数据！原本以为需要花一周时间搭建的项目，在 TRAE 的帮助下一天就完成了。特别是Recharts图表和Zustand状态管理这些我不太熟悉的技术，TRAE都帮我处理得很完美。
1. Demo 简介
-
是什么：
一款基于Web的家属守护App Demo，展示端侧AI智能守护系统的核心功能。面向谁：
核心用户为60岁以上独居老人的子女家属，延伸覆盖社区养老服务机构。主要功能：
- 实时状态监控 ：首页仪表盘展示老人当前安全状态、今日活动数据（步数、活动时长、睡眠时长）
- 设备管理 ：多区域传感器状态监控（客厅/卧室/卫生间/厨房），房间热力图展示活动热点
- 预警中心 ：异常预警推送、紧急联系功能（一键拨打老人/社区/120）
2. Demo 创作思路
-
灵感来源：
中国独居老人已超1.2亿，我身边就有亲友因父母独居而日夜焦虑——打电话怕打扰，不打又不放心。现有智能设备要么是摄像头让老人觉得"被监视"，要么是手环需要充电佩戴经常忘戴。想解决的问题：
- 摔倒后无人发现：独居老人摔倒平均4小时以上才被发现，许多因延误错过最佳治疗
- 摄像头被抗拒：老人觉得被监控没有尊严，强烈排斥
- 可穿戴设备形同虚设：需要主动佩戴充电，老人经常忘记或抗拒
- 子女远程焦虑：在外工作无法实时了解父母状况
为什么做这个方向：
我选择了"无感守护"的方向——用毫米波雷达+声学+环境多模态传感器替代摄像头，所有AI推理在本地完成，数据不上传云端，真正做到隐私至上。这个方案既解决了安全问题，又保护了老人的尊严。
3. Demo 体验地址（三选一）
-
交互式可体验的HTML格式文件，请使用Zip格式打包上传到社区；
-
AnBan-Demo.zip (211.8 KB)
4. TRAE 实践过程
-
清晰展示用 TRAE 完成 Demo 开发的完整流程；
-
TRAE 完成安伴AnBan Demo开发完整流程阶段一：创意描述与需求梳理
输入 ：描述创意想法（端侧AI独居老人智能守护系统，无感、零交互、隐私至上） 输出 ：明确的产品定位、目标用户、核心功能点
阶段二：生成产品需求文档（PRD）
输入 ：“帮我生成一份完整的PRD文档，包含产品概述、核心功能、用户角色、页面详情、交互设计、设计风格” 输出 ： prd.md - 包含产品概述、4大核心功能模块、用户角色定义、页面详情表格、UI设计规范
阶段三：生成技术架构文档
输入 ：“基于PRD帮我设计技术架构，包含前后端技术栈、API接口设计、数据模型、项目结构” 输出 ： technical-architecture.md - 技术选型、API接口列表、数据模型定义、目录结构规划
阶段四：初始化项目
输入 ：“使用vite-init react-express-ts模板初始化项目” 输出 ：项目基础框架，包含Vite配置、TypeScript配置、TailwindCSS配置
阶段五：安装依赖
输入 ：“安装zustand状态管理、recharts图表、lucide-react图标、axios” 输出 ：package.json中添加所有必要依赖
阶段六：创建类型定义
输入 ：“根据技术文档创建类型定义文件，包含UserStatus、Device、Alert、History等接口” 输出 ： types/index.ts - 完整的TypeScript类型定义
阶段七：创建后端Mock API
输入 ：“创建Express后端API，包含用户状态、设备管理、预警管理、历史数据四个路由，返回Mock数据” 输出 ： api/routes/user.ts 、 api/routes/devices.ts 、 api/routes/alerts.ts 、 api/routes/history.ts
阶段八：创建前端API客户端
输入 ：“创建API客户端，封装所有后端接口调用” 输出 ： src/api/client.ts - axios封装，统一处理请求和响应
阶段九：创建状态管理Store
输入 ：“使用zustand创建状态管理，包含用户状态、设备列表、预警信息、历史数据” 输出 ： src/stores/appStore.ts - 全局状态管理，支持数据获取和更新
阶段十：创建通用组件
输入 ：“创建StatusCard、DataCard、AlertCard、DeviceCard等通用组件” 输出 ： src/components/common/ - 可复用的UI组件
阶段十一：创建页面组件
输入 ：“创建首页仪表盘、设备监控、预警中心、历史数据四个页面” 输出 ： src/pages/Dashboard.tsx 、 src/pages/Devices.tsx 、 src/pages/Alerts.tsx 、 src/pages/History.tsx
阶段十二：创建布局组件
输入 ：“创建Header和BottomNav布局组件” 输出 ： src/components/layout/ - 顶部导航和底部Tab栏
阶段十三：配置路由和入口
输入 ：“配置App.tsx路由，整合所有页面” 输出 ： src/App.tsx - 完整的应用入口，包含路由配置
阶段十四：构建验证
输入 ：“运行pnpm run build构建项目” 输出 ： dist/ - 可部署的生产构建产物
阶段十五：打包提交
输入 ：“将dist目录打包为Zip文件” 输出 ： AnBan-Demo.zip - 可上传社区的Demo压缩包
-
附开发关键步骤截图（不少于 3 张）；
-
附关键任务对话的 Session ID（不少于 3 个），用于证明作品由 TRAE 开发完成。
-
.2760211976425696:36f1a0d67541189151dd0350df0b30b5_6a45f5d8f5c285aea3ac879a.6a45f5ecf5c285aea3ac879c.6a45f5ecfabde0738bd0f7de:Trae CN.T(2026/7/2 13:23:56)
-
.2760211976425696:36f1a0d67541189151dd0350df0b30b5_6a45f5d8f5c285aea3ac879a.6a45f77ff5c285aea3ac87c7.6a45f77ffabde0738bd0f7df:Trae CN.T(2026/7/2 13:30:39)
-
.2760211976425696:1e28c46ad80e6b177b56974e6c6f34ae_6a45f5d8f5c285aea3ac879a.6a45fd82f5c285aea3ac8884.6a45fd82fabde0738bd0f7e0:Trae CN.T(2026/7/2 13:56:18)
5. 对应的报名审核通过的帖子链接
