一、自己介绍
我是 AllenCheng，今年 15 岁，是一名高中生，接触 Vibe Coding 两年了。我热爱用代码解决现实问题——不是停在想法层面，而是一定要把它做成能跑、能用的东西。
做这个项目的原因很私人。奶奶前两年过世了，但我发现关于她的记忆只有零星半点，根本拼凑不出她究竟是什么样的人。那些来不及说的话、来不及问的事，就这样没了。
市面上几乎所有"AI + 临终"产品都定位在逝后——数字分身、AI 复活、逝者对话。但临终前这个窗口期，没有人好好处理。所以我想做生命回声：一个在还来得及的时候帮助记录、引导对话的工具。初赛我做了一个纯前端 Demo，证明这条路走得通；复赛我把它打磨成了一个真正能给老人用的完整产品。
个人参赛。初赛 Demo 使用 TRAE Work 开发，复赛打磨全程使用 TRAE IDE。
二、产品简介
是什么
生命回声是一款面向老年人（特别是临终群体）及其家属的生命故事记录与关怀产品。形态为 PWA Web 应用，手机/电脑浏览器直接访问，支持添加到桌面像 App 一样使用。通过 AI 引导对话、每日打卡、经历汇总、家人共享、关怀提醒等功能，把一段人生整理成可保存、可传承的叙事档案。
面向谁
-
临终者本人：意识清醒、愿意讲述，需要无障碍体验（长辈模式）
-
家属（中年子女）：辅助操作者，代为填写信息、辅助对话、查看经历
-
安宁疗护志愿者、社工：作为工具辅助服务对象
重要边界：AI 仅提供话题引导，对话主导权始终在家人手中。本产品不替代医疗或心理专业服务。
完整功能
- 生命对话
- 6 阶段叙事引导：童年 → 青春 → 事业 → 关系 → 遗愿 → 告别，AI 根据上一个回答自然衔接
- AI 选项生成：每题给 2 个候选答案，大字号占满屏幕，可"换一换"，降低表达门槛
- 语音输入：实时语音识别（DashScope），老人说不方便打字时直接说
- AI 档案生成：6 阶段完成后整合成 800-1500 字生命叙事，可保存长图 / TXT / 复制
- 每日打卡
- 星火积累：每天记录最有意义的一段话，点亮当日星火
- 56 天日历：可视化最近 8 周打卡历史，连续打卡有迸发动画
- 我的经历
- 瀑布流卡片：小红书式双列布局，日/周/月/年经历，时间倒序
- 经历总览：顶部固定大卡片，AI 自动汇总所有经历
- 语音回放：每张卡片支持语音播放
- 家人共享
- 分享码：生成 12 位分享码，指定可见范围
- 只读查看：家人凭码查看，不可编辑
- 关怀提醒
- 多类型提醒：用药、重要日期、自定义（每日/每周/单次）
- TTS 播报：到点语音播报提醒内容
- 长辈模式
- 无障碍适配：21px 大字体 + WCAG AA 高对比度 + ≥64px 大按钮
- PWA
- 离线缓存：manifest + Service Worker，可添加到手机桌面像 App 一样使用
相比初赛 Demo 的升级
初赛 Demo 是一个近2000行的单 HTML 文件，能跑通核心对话链路但离"能用"还差很远。复赛我从安全、功能、体验、部署四个维度做了全面升级：
- 架构：纯前端单 HTML 文件 → 前后端分离（Node.js + Express 后端 + 模块化前端）
- 安全：API Key 明文暴露在前端 → 后端代理所有 API 调用，前端零密钥；AES-256-GCM 加密存储敏感数据；CSRF 防护 + CSP + 安全 Headers
- 语音：未接入（初赛帖标注"暂用不了"）→ DashScope 实时语音识别（WebSocket 流式）+ CosyVoice TTS 语音合成
- 功能：仅 6 阶段对话 + 档案生成 → 新增每日打卡、经历瀑布流、家人共享、关怀提醒、长辈模式
- 老年人适配：基础大按钮 → 完整长辈模式（21px 字体 + 高对比度调色板 + ≥64px 按钮 + TTS 播报）
- 数据存储：浏览器内存，关闭即清空 → 服务器端 JSON 文件持久化 + AES 加密，支持跨设备登录
- App 化：无 → PWA + Service Worker 离线缓存，可添加到桌面
- 部署：Vercel 静态托管 → 阿里云服务器 + 宝塔 + HTTPS + WebSocket，支持实时语音流
- 代码量：1897 行单文件 → 前后端 30+ 模块化文件
三、产品演示视频
B站链接： Trae创造力大赛复赛作品 - 生命回声LifeEcho
四、产品创作历程
灵感来源
奶奶前两年过世了，但我发现关于她的记忆只有零星半点，根本拼凑不出她究竟是什么样的人。那些来不及说的话、来不及问的事，就这样没了。
市面上几乎所有"AI + 临终"产品都定位在逝后——数字分身、AI 复活、逝者对话。但临终前这个窗口期，那些来不及说的话，没人好好处理。我想做的东西很简单：在还来得及的时候，帮他们把话说出来，记下来。
初赛 Demo
初赛我用 TRAE Work 的 Work 模式做了深度项目分析，评估可行性和合规边界，然后用 Code 模式从零搭建了一个纯前端 Demo：6 阶段对话引导 + AI 选项生成 + 档案长图保存。部署到 Vercel 和 EdgeOne Pages。复赛打磨全程切换到 TRAE IDE 开发。
Demo 证明了创意成立，但离"能给老人用"还差很远——API Key 明文暴露在前端、语音功能没接通、关闭页面数据就没了、没有老年人需要的大字体和高对比度。
复赛打磨
复赛的核心目标只有一个：把 Demo 变成真正能给老人用的产品。这个过程里解决了几个关键问题：
- 关键问题 1：API Key 明文暴露——安全重构
初赛 Demo 把 DeepSeek 的 API Key 写在前端 JS 里，任何人 F12 就能看到。复赛第一件事就是前后端分离：所有第三方调用走后端 /api/* 代理，前端一个密钥都不碰。敏感数据（生命档案内容）用 AES-256-GCM 加密后存储，即使数据文件被拿走也看不到内容。同时加了 CSRF 双提交 Cookie、CSP 头、输入校验等安全措施。
- 关键问题 2：老人用不了——无障碍适配
初赛 Demo 的字体是 16px，对比度也没考虑老年人。复赛做了完整的长辈模式：基础字体提到 17px，长辈模式 21px；覆盖整套调色板满足 WCAG AA 对比度标准；按钮点击区 ≥64px；TTS 朗读 AI 消息和提醒播报。底部 5 Tab + 每屏不超过 3 个主操作，简化流程。
- 关键问题 3：语音功能没接通——实时语音识别
初赛帖里写了"语音识别功能 API 暂未接入，暂时使用不了"。复赛接入了阿里云 DashScope 的实时语音识别，走 WebSocket 流式传输，老人说话的同时文字就出来了。TTS 调用阿里云百炼 CosyVoice（qwen-audio-3.0-tts-flash）语音合成，后端代理返回音频。这一步还踩了个坑：麦克风要求 HTTPS 安全上下文，http:// 下 getUserMedia 直接被浏览器禁用，必须配 SSL 证书。。
- 关键问题 4：数据关了就没了——持久化存储
初赛 Demo 数据存在浏览器内存里，关页面就清空。复赛加了后端 JSON 文件持久化，所有打卡、经历、档案、提醒都存服务器，刷新不丢。虽然没用数据库（单机场景 JSON 够了），但后续可以平滑迁移到 SQLite。
- 关键问题 5：备案没下来怎么上线——非标端口部署
这是复赛最后阶段的问题。作品要部署上线让评审体验，但域名备案还没批下来，80/443 端口被拦截。解决方案是用 8443 非标准端口绕开备案检查，通过 DNS 验证申请 Let’s Encrypt 证书（不依赖 80 端口），nginx 反代到 Node 服务的 3000 端口，WebSocket 升级头配好保证实时语音流通畅。备案批下来后把 8443 改成 443 就能转正。
五、TRAE 实践过程
开发模式
整个复赛作品 100% 在 TRAE IDE 上开发。我的分工是"我负责想清楚要什么，TRAE 负责把它变成能跑的代码"：我用自然语言描述需求和安全要求，TRAE 分析现有代码结构、提出方案、执行编码，然后我审核验证、反馈迭代。
后端安全架构（AES 加密、CSRF、CSP）、老年人 UX 适配、语音识别接入、PWA 改造、服务器部署配置，全部在 TRAE IDE 里完成。
开发关键步骤截图&Session ID
SessionID: .1109820202555604:896e23c23d36fec31f22643f62ced06b_6a092e3ee54367ee900c1be7.6a623eb16ea3140fa4716550.6a623eb11a3ba8188788474e:Trae CN.T(2026/7/24 00:17:53)
SessionID: .1109820202555604:2d5aada857ffa0b262d52ddc08568aad_6a092e3ee54367ee900c1be7.6a630c7b6ea3140fa4716ace.6a630c7b1a3ba8188788475f:Trae CN.T(2026/7/24 14:55:55)
SessionID: .1109820202555604:3f9cb88caa845063082f74e98b4475e6_6a092e3ee54367ee900c1be7.6a748f2787d9ceefffae1105.6a748f27fa1d78863ec2b638:Trae CN.T(2026/8/6 21:41:59)
SessionID: .1109820202555604:798e9ed5f1aa8b1b7117f08b37e70caf_6a759dec87d9ceefffae12a4.6a75b1af87d9ceefffae1320.6a75b1affa1d78863ec2b646:Trae CN.T(2026/8/7 18:21:35)
六、技术方案分享
技术栈
- 后端：Node.js + Express —— 单语言栈，和前端统一；生态成熟，部署简单
- 数据存储：服务器端 JSON 文件 —— 所有账号、对话、打卡、经历等数据均存服务器，支持跨设备登录；AES-256-GCM 加密敏感字段；后续可迁移 SQLite
- 前端：原生 HTML/CSS/JS（模块化）—— 无构建工具链，老年人产品不需要现代框架的复杂度
- AI：DeepSeek（后端代理）—— 对话引导 / 档案生成 / 经历汇总，全部走 /api/ai/* 代理
- 语音：DashScope 实时 ASR + CosyVoice TTS —— ASR 走 WebSocket 流式识别，TTS 调用阿里云百炼 qwen-audio-3.0-tts-flash（后端代理，前端零密钥）
- 安全：CSRF 双提交 Cookie + CSP + AES-256-GCM + Origin 校验 —— 前端零密钥，敏感数据加密存储
- 部署：阿里云 ECS + 宝塔 + nginx + Let’s Encrypt —— HTTPS + WebSocket，8443 端口绕开备案限制
关键实现思路
- 1. 安全架构（初赛最大问题的解决）
所有第三方 API 调用经后端 /api/* 代理，前端不持有任何密钥。敏感数据（生命档案内容）用 AES-256-GCM 对称加密后写入 JSON 文件，密钥不落盘（环境变量）。CSRF 用双提交 Cookie 模式 + Origin 校验，CSP 头限制脚本来源，输入验证中间件对所有 POST 做长度/类型校验。
- 2. 实时语音识别链路
前端 getUserMedia 采集麦克风音频 → PCM 编码 → WebSocket 发送到 DashScope → 流式返回识别文本 → 实时渲染到输入框。关键点：WebSocket 在 https 下自动升级为 wss（代码里根据 location.protocol 自动判断），nginx 反代需配置 Upgrade 和 Connection 头转发。
- 3. 老年人无障碍适配
用 CSS 变量（--font-base、--contrast-*）控制整套视觉系统，长辈模式切换时只需改根元素的 data 属性，所有组件自动适配。不针对单个组件硬编码字号/颜色，保证一致性。
- 4. 非标端口部署方案
域名备案未完成时，80/443 端口被运营商拦截。用 8443 非标准端口绕开检查，通过 DNS 验证（非 HTTP 验证）申请 Let’s Encrypt 证书，nginx `listen 8443 ssl` 反代到 Node 3000 端口。备案通过后改回 443 即可转正，无需迁移。
七、社会价值
中国每年有约 1000 万人走向生命终点，他们中的大多数没有机会系统地讲述自己的一生。他们的故事、智慧、遗憾，往往随着离开而消失。
生命回声做的事情很简单：在还来得及的时候，帮他们把话说出来。不是 AI 复活，不是数字分身，只是记录——但记录本身就有力量。
同时，这个产品的无障碍设计（长辈模式）也为老年人数字包容做了尝试：大字体、高对比度、语音输入、TTS 播报，让不擅长打字的老人也能参与。
初赛 Demo 链接： 【社会服务&社会公益】生命回声 — AI 生命故事记录与传承助手
让每一句来不及说的话，都有回声。