【标签】生活娱乐
【标题】【生活娱乐赛道】Love Atlas —— AI 双人关系探索地图
【正文】
1. Demo 简介
● 是什么
Love Atlas 是一个面向成年亲密关系用户的 AI 双人关系探索 Web 应用。它通过「关系地图 + AI 动态问题生成 + 双人独立回答 + 实时同步」等机制，帮助两个人在不同关系阶段更自然地开启一次真正有深度/共鸣的对话，并把每次探索沉淀为可回看的关系轨迹与发现图鉴。
● 面向谁
主要面向以下用户：
热恋期情侣
长期关系伴侣
异地恋情侣
刚建立关系的约会 / 暧昧阶段用户
目前也支持「AI 虚拟伴侣」单人体验模式，无需对方在场即可体验完整流程
● 主要功能
1）三大空间模式：临时空间（免登录、破冰用）、专属关系空间（长期沉淀、历史探索、发现图鉴）、虚拟伴侣模式（AI 扮演对方，单人即可走完整流程）。
2）AI动态生成探索路径
根据关系阶段 × 探索目标 × 路线区域轮转 × 此刻信息 × 题型交替（开放反思 / 选择对比）生成不同对话路径，而非固定题库；并接入对话记忆，让首题能延续上次探索的脉络。
3）AI 动态问题生成+AB双人独立回答+揭晓机制：
随后双方先分别回答，未揭晓时对方回答区锁定保密，双方都点「已答完」后自动揭晓；揭晓时由 AI 从情感主题、底层价值观、关系意图、概念共鸣四维度计算相似度，并生成柔化洞察（不再用「差异 / 距离」等评判性措辞）。
4）关系地图 + 发现图鉴：
将对话映射到「情绪森林 / 回忆海岸 / 日常山谷 / 未来之城 / 边界花园」五个区域，以 SVG 地形图可视化（区域节点 + 对话河流 + 共鸣色块 + 进度弧），替代原本的进度条。
发现图鉴含45 个发现分三档稀有度（常见 / 稀有 / 传说），未解锁卡片显示诗意线索而非 ???，配 SVG 进度环、统计彩蛋、NEW 徽章与 stagger 动画。
5）深度对话链：揭晓后若相似度低（出现新理解）或高共鸣（≥70%）可开启最多 3 层深度追问，由 AI 生成面向双方的中性追问，独立答题、独立揭晓、独立洞察，完成后生成认知轨迹总结。
2. Demo 创作思路
● 灵感来源
来自现实中亲密关系沟通的普遍困境：
想聊天，但不知道从哪里开始
对话容易停留在「日常事务」层
深度话题（情绪 / 期待 / 边界）难以自然开启
长期关系逐渐失去新鲜对话结构
● 想解决的问题
希望解决的不是“聊天频率问题”，而是：
如何让两个人根据不同的发展阶段或当下更容易去开始一次有深度/相对有意义的对话
● 为什么这样做
传统情侣问答产品依赖固定题库，但真实关系具有强语境差异：
同一个问题在不同关系阶段意义完全不同
场景（咖啡馆 / 夜晚 / 异地）也会改变表达方式
人与人之间需要一点“进入感”，而不是“题目列表”
因此引入 AI：动态生成问题结构、感知关系阶段与实时场景、将关系抽象为「可探索地图」，并把每次探索的发现沉淀为长期可回看的关系图鉴。
3. Demo 体验地址
4. TRAE 实践过程
这个项目从最初的 HTML 原型（也是用 TRAE 生成的），一路迭代到如今的多类型空间、AI 驱动、实时同步的完整 Web 应用，几乎所有关键模块都是在 Trae 里通过自然语言对话推进的。以下是部分的实践说明。
1）梳理现有项目，了解当前流程、功能与背景
首先我让 Trae 基于现有代码和产品目标，帮我一起判断哪些部分最影响 Demo 体验。经过梳理，我们发现几个关键问题：
首页只有静态入口，没有让用户快速进入一次对话的「一键启动」能力；
问题生成依赖固定模板，缺少根据关系阶段、场景、目标动态生成的能力；
AB 双人回答机制还没有保密揭晓流程，用户体验不完整；
世界地图只是 5 张进度条卡片，视觉和交互都不够「关系探索」的沉浸感；
实时同步、登录、空间系统这些多人协作基础能力完全缺失；
发现图鉴只是平铺网格，缺少收集感和趣味性。
Trae 帮我把后续开发重点收敛为：搭建 React + TypeScript + Zustand + Node + Supabase + Prisma 的完整架构，补全登录/空间/实时同步，优化 UI、AI 动态生成、世界地图可视化、发现图鉴趣味性等。
Session ID: 3717874217918323:a0ee877ab1d4571f7af568defe336761_6a3258e612e26e3bd6beac76.6a3258e612e26e3bd6beac79.6a3258e612e26e3bd6beac77:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/17 16:20:54)
2）用 Trae 构建「双人实时同步」系统
双人实时同步是项目里最复杂的部分。在 Trae 里分层逐步建起：
防循环：用 lastSyncedRef 记录最后同步状态序列化值，相同状态不重复处理；isHydratingRef 标记 hydration 期间不触发反向保存。
性能优化：80ms 防抖合并高频操作，savingRef 防止并发请求堆积，失败自动重试，状态变化时立即异步触发 flushSave()。
答案保密：未揭晓时只同步 ready 标识，不同步真实答案文本；双方都 ready 后才同步真实答案并自动揭晓——最终沉淀为「真人模式答案保密机制」三条规则（UI 锁定 / 同步空字符串 / hydration 保留本地）。
虚拟伴侣模式短路：成员状态轮询直接 setMemberCount(2) 跳过、心跳完全跳过、状态同步直接 return——在对话中明确「不要给虚拟伴侣发网络请求」后，由 Trae 在三个 hook 里统一改掉。
Session ID：
3717874217918323:e2d5970150a9f5f15e9278406b5f558b_6a3258e612e26e3bd6beac76.6a36120e44b12f0848b3b814.6a36120e44b12f0848b3b812:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/20 12:07:42)
3）用 Trae 优化首页、旅程页 UI 与交互节奏
在已有架构基础上，我使用 Trae 对首页、旅程页、揭晓页进行了多轮迭代，主要包括：
首页增加「今日一问」一键入口、每周主题盲盒、虚拟伴侣快速体验区，让用户更快进入核心流程；
旅程页问题卡片加大内边距、调整字间距/行高/词间距，降低文字密度；
揭晓情绪柔化：把「差异 / 距离」等评判词替换为「不同角度 / 各有各的色彩」；
统一按钮、卡片、返回、加载等交互组件样式，保持全局一致性；
为关键页面（SummaryPage、WorldPage、DiscoveryAtlasPage、RoutePage 图片上传、AuthButton 初始化）补全 loading 状态；
答案输入框标注 A/B 身份，host/无角色为 A，partner 为 B，虚拟伴侣标注对方角色。
经过这些调整，Demo 逐渐从「功能可用」变得接近一个真实产品的体验。
Session ID：
3717874217918323:31701ad8a339d17837b7130d0bbd8840_6a3258e612e26e3bd6beac76.6a3c0509a0e6481dcf12ef44.6a3c0509a0e6481dcf12ef42:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/25 00:25:45)
4）用 Trae 开发「AI 分层能力」的动态问题与洞察系统
项目中陆续落地了近 10 个 AI 端点：问题生成、相似度计算、洞察生成、虚拟伴侣回答、深度对话追问 / 总结、场景理解、主题盲盒、教练建议。
我让 Trae 按以下节奏实现：
先用自然语言描述每个端点的输入、输出、失败回退策略；
让 Trae 生成服务端 aiJourneyService.ts 与客户端 aiJourneyService.ts 对应函数；
关键规则是 「AI 失败必须回退规则引擎」：相似度计算先走本地语义算法，再调 DeepSeek，失败回退；洞察生成 AI 失败回退到 abEngine 规则文案。这条规则被写进项目记忆，后续所有新端点都自动遵循。
题目生成引入路线区域轮转和题型交替机制：按 questionIndex % routeAreas.length 轮转「日常山谷 / 森林 / 海岸 / 未来之城 / 边界花园」，偶数题开放反思、奇数题选择对比，避免题目重复和单一。
Vite dev 中间件必须挂载 handleAiJourneyApi 和 handleAiVisionApi，否则 dev 模式下 /api/ai/* 全部 404——这个坑也是在对话中定位并记进 memory 的。
Session ID：
3717874217918323:2d083768d534fefd16dad71810028d1f_6a3258e612e26e3bd6beac76.6a3de0cd686f2fe7426726b5.6a3de0cd686f2fe7426726b3:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/26 10:15:41)
5）用 Trae 把「进度条」改成「对话地形图」
世界地图最初是 5 张进度条卡片。在对话中我先和 Trae 确认了改造方案（地图区域 + 共鸣色块），然后：
让 Trae 新建 TerrainMap.tsx，用 SVG 画 5 个区域节点 + 对话河流曲线 + 共鸣色块 + 脉冲动画 + 进度弧 + 图例；
替换 WorldPage.tsx 里的旧网格；
让 Trae 全局搜索并清理 globals.css 里 14 处旧的 .world-map-grid / .world-area-card dead 选择器（响应式断点 + 亮色主题块）；
最后 tsc --noEmit && npm run build 验证。
整个过程只用了几轮对话，但每一步都有明确的「先确认方案 → 实施 → 验证」节奏。
Session ID：
3717874217918323:fc7ce52475da2a2daff48d5c9647900f_6a3258e612e26e3bd6beac76.6a3e089a686f2fe742672d1d.6a3e0899686f2fe742672d1b:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/26 13:05:30)
6）用 Trae 升级「发现图鉴」的趣味性
图鉴最初是平铺的 45 张卡片，未解锁显示 ???。在对话中我说「保留入口，但可以更有趣味性一点」，Trae 据此设计了一整套收集体验：
给每个发现加 rarity（常见 / 稀有 / 传说）和 hint（诗意线索）字段；
未解锁卡片显示线索文案 + 朦胧剪影图标 + 虚线边框，若隐若现；
SVG 三色渐变进度环替代 pill 进度条；
统计彩蛋区（探索次数 / 踏足区域 / 最常走进）；
24 小时内解锁的 NEW 徽章 + 脉冲光晕；
卡片 stagger 入场动画；
亮色主题适配。
这套改动横跨类型 / 数据 / i18n / 组件 / CSS 五层，但因为在对话里逐步推进，每一层都清晰可控。
Session ID:
3717874217918323:a4ffef1d1d9305f8a3ddd5fd32571d63_6a3258e612e26e3bd6beac76.6a3e0f94686f2fe742672e61.6a3e0f94686f2fe742672e5f:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/26 13:35:16)
7）Netlify 部署与修复
当项目完成到可展示阶段，我尝试部署到 Netlify 时遇到构建失败：
Prisma Client 在 Netlify CI 缓存依赖后没有重新生成；
项目原本是 Node http 服务，没有适配 Netlify Functions。
在 Trae 里我按以下步骤修复：
把 prisma generate 加入 npm run build 脚本；
在 prisma/schema.prisma 增加 rhel-openssl-3.0.x binaryTarget，匹配 Netlify Functions 运行环境；
新建 netlify/functions/api.ts，把 Netlify event 适配成 Node IncomingMessage / ServerResponse，转发给现有 5 个 API handler；
新建 netlify.toml，配置 build、functions、API rewrite 和 SPA fallback；
配置环境变量并重新部署。
Session ID：
3717874217918323:28e595c01e3cb0d207b8df12619db7fb_6a3258e612e26e3bd6beac76.6a3e1992686f2fe742672ee0.6a3e1992686f2fe742672ede:TRAE Work CN.0.1.21.no_sid.no_ppe.T(2026/6/26 14:17:54)
5.Love Atlas 核心创新点
1）AB 双人独立盲答 + 同时揭晓
双方先各自独立作答，未揭晓时对方回答区锁定保密（三层保密：UI 锁定 / 同步只传 ready 标识 / 本地输入不被覆盖），双方都点「已答完」后才同步真实答案并自动揭晓。从协议层面杜绝答案互相引导和社会期许偏差，接近心理学「独立报告法」。同类产品多为一人提问一人答或双方共见题目，答案易互相引导。
2）AI 语义相似度 + 情绪柔化洞察
相似度两层计算：本地语义加权（中文词组提取、同义词合并、关键词加权）+ AI 四维评估（情感主题 / 底层价值观 / 关系意图 / 概念共鸣），失败回退本地。揭晓文案全面柔化——「差异」→「不同角度」、「距离」→「各有各的色彩」，prompt 明确禁止 problem/failure 措辞，把「非评判性态度」落到产品语言层面。
3）深度对话链 —— 低共鸣或高共鸣都能「再深一层」
揭晓后相似度 < 30% 或 ≥ 70% 可开启最多 3 层深度对话：AI 生成面向双方的中性追问，每层独立答题、揭晓、洞察，完成后生成认知轨迹总结。让对话不是「问完就走」，而是顺共鸣或差异自然深入。
4）关系地图 → 对话地形图
把对话映射到五个隐喻区域（情绪森林 / 回忆海岸 / 日常山谷 / 未来之城 / 边界花园），用 SVG 地形图可视化——区域节点 + 对话河流曲线 + 共鸣色块 + 活跃区域脉冲 + 进度弧。题目按索引轮转区域保证话题覆盖均衡。关系不再是「答了多少题」，而是「你们一起走过了哪些地形」。
5）AI 动态问题生成 + 此刻场景融合 + 对话记忆
多重动态输入共同决定问题方向：关系阶段 × 探索目标 × 路线区域轮转 × 题型交替（偶数开放反思 / 奇数选择对比）；用户可上传「此刻」场景图片，AI 实时解析图片场景并融合到当题语境，让对话紧扣当下情境；
服务端 prompt 强制 must be DISTINCT from previous questions 并传入最近 3 题历史；跨探索对话记忆（最多 10 条）让首题参考上次脉络；情绪签到影响首题方向。每次对话都是关系长河里一段连续且当下的旅程。
6. 报名帖链接
【生活娱乐赛道】Love Atlas —— AI 双人关系探索地图