一、摘要
用 TRAE SOLO 全程零手写代码，开发了一款沉浸式互动叙事解谜游戏——「那个房间」。玩家在合租房里发现前任租客留下的手机，通过翻看微信、小红书、美团等 10 个 App，拼凑出一个独居女孩被忽视的求助信号。
从剧本构思、数据生成、游戏开发到视觉设计，全程通过对话完成，最终产出包含 15 条线索、6 个密码解锁、三段式结局的完整 React 应用。
二、背景
我是一名内容创作者，日常工作中会做一些创意策划和文案，但完全不会写代码。之前想做互动叙事类项目，一直卡在"有想法但没法实现"的阶段——找外包成本高、周期长，自己学编程又不知道从哪开始。
看到 SOLO 挑战赛的时候，我想到一个一直想做的概念：如果你在合租房里捡到一部手机，翻看里面的生活痕迹，会发现什么？在中国有 7700 万独居年轻人，其中很多人每天的生活看起来和你我没什么两样——在小红书上分享探店笔记，在美团上点火锅食材，在朋友圈里八卦隔壁情侣分手。但如果仔细看，会发现一些不对劲的细节。
我想用 SOLO 把这个故事做出来。
三、实践过程
Step 1：拆解任务——先想清楚，再动手
我没有一上来就写代码。打开 SOLO 之后，第一件事是让它帮我分析两款找手机类解谜游戏的核心机制：
- A Normal Lost Phone——翻看一个人的手机，拼凑出他消失的真相。
- Replica——在手机中发现被忽视的信号。
SOLO 帮我拆出了五个核心设计要素，其中两个是我原本缺少的——
Gateway Lock（门锁链）： 不是所有 App 都能打开。密码藏在已解锁的 App 里。每次找密码的过程中，你会"顺便"看到关于小鹿的线索。
你以为在解谜，其实在拼真相。
Active Task（主动任务）： 合租须知面板常驻在页面上。随着线索增多，面板的措辞从行政语气变成质问——
“欢迎入住 302！WiFi 密码：xiaolu123”
“她的闺蜜发过消息问她怎么了。你没看到吗？”
“她在备忘录里说冰箱空了。她在美团上连续点了一周泡面。你在看这些吗？”
面板不是任务。面板是镜子。
Step 2：用 SOLO 哪些能力
整个项目用到的 SOLO 能力：
- 对话式策划： 剧本构思、游戏机制设计、数据结构规划，全部通过自然语言对话完成。
- 代码生成： React + Vite 项目搭建、10 个 App 组件、状态管理系统，SOLO 自动生成完整代码。
- 迭代修改： 从手机模拟器 → 全屏沉浸式叙事风格 → 纯文字叙事风格，三次视觉大改，通过对话逐步调整。
- Bug 修复： 发现返回时重复播放开头、结局覆盖层被遮挡等问题，描述问题后 SOLO 直接定位并修复。
- 全量审查： 让 SOLO 做了一次完整的代码审计，验证了 15 条线索全部可触发、密码系统正常、结局触发逻辑正确。
Step 3：关键 Prompt
以下是几个关键的 Prompt，展示了我是如何一步步引导 SOLO 完成项目的：
【概念设计阶段】
我想做一个"合租室友手机"的概念。玩家捡到一部手机，翻看里面的生活痕迹。要有反转和回味，不要太晦涩，要有吸引力。偏向生活一些，带有八卦、吃瓜、吃喝需求。情感核心是"被忽视的求助"。
→ SOLO 帮我设计了完整的游戏框架：10 个 App、15 条线索、密码系统、三段式结局。
【游戏开发阶段】
根据设计方案，创建一个沉浸式互动叙事解谜游戏，模拟翻看一个人的手机。使用 React + Vite，包含 10 个 App 模块、15 条线索系统（IntersectionObserver 自动发现）、6 个密码解锁、三段式结局动画。
→ SOLO 自动规划了项目结构，生成了完整的 React 应用代码。
【视觉迭代——第一次大改】
太假了。能不能把画面变成真实一些的其他样子？不要手机模拟器的感觉。
→ SOLO 移除了手机外壳，改为全屏沉浸式暗色叙事风格，添加了氛围背景、噪点纹理。
【视觉迭代——第二次大改】
我只想要开头的样子来完成。就是那种纯文字叙事的感觉，不要卡片列表。
→ SOLO 把首页从卡片导航改为打字机效果的纯文字叙事，App 入口变成极简文字链接，进入 App 时有叙事过渡文字"你打开了微信。"
【Bug 修复】
我发现了一个问题，你在不同 App 返回时候应该不是再来一遍开头。
→ SOLO 在全局状态中添加了 homeNarrativePlayed 标志位，首次播放后不再重复。
Step 4：踩过的坑
坑 1：手机模拟器"太假了"
第一版做了 iPhone 风格的手机外壳，看起来像一个粗糙的原型。用户反馈"太假了"之后，我让 SOLO 直接去掉手机壳，改成全屏沉浸式。这个改动涉及所有组件的布局重构，但 SOLO 一次对话就完成了。
教训：不要过早确定视觉方案。先用对话把交互跑通，再打磨视觉。
坑 2：叙事风格要统一
去掉手机壳之后，首页还是卡片列表风格，和沉浸式叙事的氛围不搭。我又让 SOLO 改成纯文字叙事，但这次我的 Prompt 更具体了——“我要开头那种打字机效果的感觉”。越具体的反馈，SOLO 改得越准。
教训：描述你"要什么"比描述你"不要什么"更有效。
坑 3：返回时重复播放叙事
从 App 返回首页时，开头的打字机叙事会重新播放一遍。这个问题是因为 HomeScreen 组件没有区分"首次进入"和"返回"。SOLO 的解决方案是在全局状态（useReducer）中添加一个 homeNarrativePlayed 标志位。
教训：状态管理要考虑"生命周期"，不只是"当前状态"。
坑 4：结局动画被遮挡
当最后一条线索在 App 内部被触发时，AppWindow 组件仍然渲染在 EndingOverlay 之上，导致结局动画看不见。SOLO 在 Phone.jsx 中添加了 gamePhase === ‘exploring’ 的条件判断来解决这个问题。
教训：全局状态切换时，要检查所有组件的渲染条件。
四、成果展示
项目概况：
- 技术栈：React 18 + Vite + useReducer + Context + IntersectionObserver
- 代码量：10 个 App 组件 + 完整状态管理系统 + 线索/密码/结局系统
- 内容量：132 人家长群对话、16 条外卖订单、7 篇小红书笔记、7 条朋友圈、3 个歌单、8 篇备忘录……
核心设计亮点：
- 吃瓜就是线索： 闺蜜群在八卦隔壁情侣分手——“男方从来不回消息”——其实在暗喻小鹿自己的处境。
- 外卖订单讲故事： 从四人份火锅变成连续一周的泡面。不需要任何解释，玩家自己就能感受到。
- 朋友圈"仅自己可见"： “今天天气真好”——点进去才发现仅自己可见。
- 搜索记录即线索： “心理咨询”“抗抑郁药物”“独居女生安全”——不是剧情设定，是现实中很多人真实的搜索记录。
密码设计：
- 抖音密码 1215：小鹿的生日。妈妈在微信里问过"生日快乐"。但那天，没有人给她过生日。
- 备忘录密码 302：她住的房间号。合租群里房东通知"302 的东西都清了"。
- 淘宝密码 “不想出门”：她备忘录里写的最后一句话。“今天又是一个人。冰箱空了。不想出门。”
- 相册密码 ayaoyao：闺蜜的昵称。她最亲密的人发过消息问她怎么了，她已读不回。
在线体验： 那个房间 | That Room
提示：建议在深夜独处时体验，戴上耳机，效果最佳。
五、效果与总结
提效数据：
- 开发时间：约 2-3 小时完成全部开发（含 3 次视觉大改 + Bug 修复 + 全量代码审计）
- 代码量：10 个 App 组件 + 完整状态管理 + 线索系统 + 密码系统 + 结局系统，零手写代码
- 迭代次数：3 次视觉大改（手机模拟器 → 全屏沉浸 → 纯文字叙事），每次通过 1-2 句对话完成
- Bug 修复：4 个 Bug 全部通过描述问题让 SOLO 定位并修复，无需手动排查代码
SOLO 在流程中做了什么：
整个项目的流程是：剧本构思 → 数据生成 → 游戏开发 → 视觉设计 → Bug 修复 → 代码审计。每一个环节都是通过对话完成的。SOLO 不只是"帮我写了代码"——它参与了从概念到上线的全流程。
作为一个完全不会编程的内容创作者，我最大的感受是：SOLO 让"有想法但没法实现"变成了过去式。
可复用的方法：
- 先对话，后开发： 不要一上来就让 SOLO 写代码。先用对话把设计想清楚，再动手。
- 具体的反馈 > 模糊的反馈： "太假了"能触发大改，但"我要开头那种打字机效果"能让 SOLO 改得更准。
- 让 SOLO 做审计： 开发完成后，让 SOLO 做一次全量代码审查，能发现你自己注意不到的问题。
- 用生活观察做内容： 搜索记录、外卖订单、朋友圈可见范围——这些不是编程能写出来的，是对生活的观察。SOLO 帮我把这些观察变成了游戏。
我不知道现实中的"小鹿"们能不能等到有人找到她们。
但我知道，如果我只是做一个"班主任提效工具"，没人会停下来想一想。
所以我做了一个游戏。
一个让人翻完之后沉默很久的游戏。
这就是 More Than Coding。
不是"不能写代码"，是"不只是写代码"。
