0. 先和大家打个招呼吧
你是谁：一名计算机专业的大学生，以及若干中老年人的家人
你是怎么用 TRAE CN 把 Demo 做出来的：之前用过cursor开发小程序，感觉不是很好用，而且用量是个很致命的问题。但用了 TRAE 之后发现，只要把想法用自然语言描述清楚，它就能帮我把代码写出来，最关键的是不限用量。我只要说做一个社保智能助手、接入高德地图、页面要大字体适合老年人，TRAE 就能理解并实现。最让我惊喜的是多城市社保指南的开发，我原本以为每个城市都要单独写很多代码，但 TRAE 帮我设计了一套可扩展的架构，新增城市只要加几行数据就行，大大降低了开发难度。
1. Demo 简介
是什么：一款面向老年人的适老化便民服务网站。
面向谁：老年人、农民工、灵活就业者等对数字化服务操作不熟悉的群体。
主要功能：
- 社保智能助手：支持全国社保业务查询办理，覆盖8个城市（深圳、北京、上海、广州、成都、杭州、武汉、重庆）的详细办事指南，智能问答引导用户一步步办理。
- 医疗服务：附近医院搜索、在线挂号、一键导航，支持直接跳转健康160医院页面。
- 便民导航：实时搜索周边药店、社康中心、银行、超市等便民设施，集成高德地图显示位置。
未来规划：后续会做成手机 App 形态，更方便操作，支持离线使用和系统级的语音交互。
2. Demo 创作思路
灵感来源：
自从ai变得这么nb以后我就一直有一个想法，就是去自己独立开发一个软件。然后我在构思的时候想起了一件事，当时我老家有一个亲戚来我家做客，她耳朵有听力问题需要做手术，但是这个手术费对她来说是蛮高的，但是如果她交了农村合作社医保的话就可以报销掉大部分，自己只用交几千块。问题在于她完全不会查询自己有没有交过这个医保，于是我花了半个小时帮她弄这个（包含了反复试错密码和银行卡之类的费时操作）。当时我就想，我一个大学生要弄这么半天，那我这个不擅长使用电子设备的亲戚自己弄要多久？更何况还有千千万万农村里的老人也对此一窍不通？当时我就决心要做一个东西帮助他们，于是开发出了现在的产品。目前还是一个网站，在之后无论是否获奖，我都会将它作为app上线。。
想解决的问题：
- 老年人操作困难：界面文字小、操作复杂、功能分散
- 信息不对称：不知道去哪里办理、怎么办
- 地域差异：不同城市办事流程不同，缺乏统一指引
为什么做这个方向：适老化服务是一个被忽视但需求巨大的市场。通过简化操作流程、提供智能引导、整合各类便民服务，让老年人也能轻松享受数字化带来的便利。选择网页形式是因为不需要下载安装，打开浏览器就能用，对老年人更友好。后续会做成手机 App 形态，更方便操作。
3. Demo 体验地址
在线体验： https://elderly-web.vercel.app
4. TRAE 实践过程
4.1 项目初始化与技术选型
一开始我对跟 TRAE 说"我要做一个适合老年人使用的便民服务网站"，让TRAE 帮我分析了需求。我使用了 Next.js + Tailwind CSS + Supabase 的技术栈，并用trae生成了完整的项目框架。
-
截图1：项目目录结构
-
截图2：首页预览效果
关键 Prompt： “帮我创建一个适合老年人使用的便民服务网站，需要大字体、高对比度、语音交互功能”
-
4.2 社保智能助手开发
这是整个项目的核心模块。一开始我用规则匹配来识别用户意图，但很快发现老年人说话很口语化，规则根本覆盖不了。比如"我想查一下这个月养老金发了多少"和"养老金到账了吗"其实是同一个需求，但规则匹配无法识别。
后来 TRAE 建议我用 LLM 做综合分析，把用户输入交给 DeepSeek 模型，一次性分析出意图、参保地、查询方向和歧义判断。这个方案效果非常好，能够准确理解老年人的口语化表达。
我还设计了二级城市架构：精办城市（有详细指南）和通用城市（走国家平台兜底）。新增一个精办城市只需要在数据文件中加几行配置，大大降低了维护成本。
-
截图3：社保智能助手对话界面
-
截图4：城市选择界面
关键 Prompt： “帮我设计一个社保智能助手，用户说一句话就能找到对应的办事指南，支持多城市”
踩坑经历：
-
一开始用规则匹配意图，老年人说的话太口语化，经常识别不准
-
改成 LLM 综合分析后，效果好了很多
-
需要为每个精办城市手动核验官方办事流程，确保指南准确
-
4.3 医疗服务模块开发
医疗模块需要接入高德地图 API 来搜索附近医院。一开始按距离排序，结果三甲医院排在后面，老年人找不到好医院。后来改成按医院等级优先，再按距离排序，结果就合理了。 -
截图5：附近医院搜索结果
关键 Prompt： “帮我接入高德地图，搜索附近医院，按等级排序”
踩坑经历：
-
医院排序问题：一开始按距离排序，三甲医院排在后面
-
改成按等级打分排序后，三甲医院优先显示
-
医院名称标签有蓝色方框，不符合设计风格，后来改成了自定义样式
-
4.4 便民导航开发
便民导航需要接入高德地图 POI 搜索 API，支持搜索药店、社康、银行等设施。开发过程中遇到了地图初始化失败的问题，排查了很久才发现是变量名大小写不一致（AMap vs AMAP）。 -
截图6，7：便民导航地图界面
关键 Prompt： “帮我做一个便民导航页面，点击卡片就能在地图上显示对应的设施”
踩坑经历：
- 地图初始化失败：变量名大小写不一致（AMap vs AMAP）
- 加油站搜索无结果，后来移除了这个功能
- 地图标记在切换类型时不更新，调整了 useEffect 依赖项后解决
- 4.5 关键任务 Session
- 6a4f0a490364fe2e7060c302 — 社保智能助手核心开发、多城市指南落地、便民导航实现
- 6a5091fb0364fe2e7060cdc1 — 医疗服务模块开发、医院搜索功能实现
- 6a50b60c0364fe2e7060cedf — 项目框架搭建、基础功能开发
- 4.6 开发心得
整个开发过程中，TRAE 帮我解决了很多技术难题。最有价值的是它能够理解我的业务需求，并给出专业的技术方案。比如在设计社保智能助手的时候，我只说了"老年人说一句话就能找到办事指南"，TRAE 就帮我设计了完整的 LLM 综合分析方案，包括数据结构、API 接口和 UI 交互。
另外，不限用量也是一个很大的优势。之前用其他工具的时候，经常担心用量不够，不敢放开使用。但 TRAE 完全没有这个顾虑，我可以反复调试、修改代码，直到达到满意的效果。5. 对应的报名审核通过的帖子链接
5 报名帖链接