【学习工作】Archer初衍·写作伴生 Demo —— 会记住你的写作伙伴
标签：
学习工作
报名赛道：学习工作
体验方式：HTML 格式文件（zip 打包上传）
1. Demo 简介
是什么：Archer初衍·写作伴生 Demo 是一个单文件 HTML 网页应用——一个会记住你的写作伙伴。它在浏览器里运行，无需注册、无需登录、无需 API Key，双击即可体验。所有记忆存在你本机浏览器的 localStorage 里，关掉重开，它还记得你。
面向谁：长期写作者、公众号/小红书/B 站创作者、知识管理用户（Obsidian、Flomo）、用写作和复盘重建生活系统的人。也就是我自己日常在用的那群人。
主要功能（3 个核心 + 1 个亮点）：
-
写作档案（记忆沉淀）：首次进入引导建档——称呼、写作领域、风格偏好、写作目标——这些会成为它的第一批记忆。之后每次在工作台写作，它都会从你的文字里提炼「值得记住的东西」（选题/偏好/目标/洞察），经你确认后入档案。
-
选题 / 续写伴生：在工作台贴一段草稿，点「伴生」，它会基于你的档案给出 2–3 个标题建议、一段按你风格续写的片段，并提炼记忆候选。不是通用模板，而是结合你填过的领域和语气生成的。
-
跨会话记忆演示：点右上角「新会话」模拟关闭重开——回到开场，它会回唤「又见面了，[你的称呼]，上次你在写《…》，今天想接着往下吗？」。这一下能把「长期记忆」从概念变成评委能直接看见的东西。
-
周复盘 / 主题发现（亮点）：攒够 3 篇写作记录后，它从累积的文字里统计反复出现的词，归纳出 3 个主题，并给一句话行动建议——「反复出现的，往往是你真正在意、却没系统写过的东西」。
2. Demo 创作思路
灵感来源：我自己长期用 Obsidian、Flomo 和各种 AI 工具写作、复盘、做项目。记录越攒越多，我发现真正缺的不是更聪明的聊天机器人，而是一个能持续理解我、记住我的背景和风格、帮我把零散记录推进成作品的系统。这就是我报名帖里提的 Archer初衍——一个拥有长期记忆的个人成长与写作伴生体。这个 Demo 是它在「学习工作」场景下的一个可体验切片。
想解决的问题：现在大多数 AI 工具每次对话都像重新开始，用户得反复解释自己的背景、目标、写作风格；有价值的记录沉在知识库里调不出来；写作时缺一个真正懂你上下文的伙伴。
为什么做这个方向：报名通过后我纠结过——是把已有的 Archer 客户端直接交过去，还是重做。最后选了重做，原因有三：
-
大赛要求作品用 TRAE 创作并提交 Session ID 证明，旧客户端是我手写的，没有 TRAE 创作痕迹；
-
学习工作赛道不能太「玄」，旧客户端的「灵魂伴生体」叙事偏重，我把它收敛到「长期记忆 + 写作伴生」这条更具体、更落地的线；
-
评委要能 3 分钟内体验到价值，单文件 HTML 双击即用、零部署，比依赖后端的客户端稳得多。
一个取舍：我没有接入真实 LLM，而是用纯前端规则 + 模板模拟了 Archer 的记忆提炼和检索逻辑。这样评委无需 API Key 就能完整体验「记忆在累积」的过程。真正的 Archer（终端版）具备完整灵魂系统、18 个技能、向量检索，能力远超这个 Demo——这点我在 footer 里写明了，不藏着。
3. Demo 体验地址
采用 HTML 格式文件方式：
-
文件名：
archer-writer-demo.html -
形态：单个自洽 HTML 文件（约 59KB），内联 CSS + JS，无外部依赖（仅 Google Fonts CDN，不可用时自动降级到本地衬线字体）
-
体验方式：下载后解压，双击
archer-writer-demo.html即可在浏览器打开体验 -
已 zip 打包随帖上传
推荐体验路径（约 3 分钟）：
-
开场 → 点「开始建档」→ 完成 4 步问答
-
工作台 → 贴一段草稿 → 点「伴生」→ 看 标题/续写/记忆候选 → 点 ✓ 记住
-
档案 → 看记忆之环五色段点亮
-
点右上「新会话」→ 回到开场，看回唤卡证明记忆仍在
-
攒够 3 篇记录 → 周复盘看主题发现
4. TRAE 实践过程
整个 Demo 在 TRAE 中从需求梳理到成品交付，完整经历：方向决策 → 文档生成 → 编码实现 → 自检打磨。
关键步骤：
步骤一：方向决策与需求梳理
先把报名帖、旧 Archer 客户端、大赛初赛规则一起喂给 TRAE，让它帮我判断「交旧的还是重做」。TRAE 指出两条硬约束：作品必须用 TRAE 创作并提交 Session ID；学习工作赛道 Demo 只能是公开链接或 HTML 文件。基于此确定重做一个自洽单文件 HTML。
Session ID：1576059434712570:bca644dbd9941d021c4106ba6aabfd8a_6a3bb5b5aa457c495571b13d.6a3bb5ba9022a568baa2bec7.6a3bb5b5aa457c495571b13e:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/24 18:47:26)
步骤二：生成 PRD 与技术架构文档
调用 web-dev 技能，TRAE 按规范生成了 PRD（产品概述、核心功能、核心流程 Mermaid 图、UI 设计）和技术架构文档（架构图、视图路由、数据模型 ER 图、与真实 Archer 的能力映射表）。文档确认后才进入编码。
Session ID：1576059434712570:e50b7644b2486a6029632eb0fe5880c5_6a3bb5b5aa457c495571b13d.6a3bbc3a9022a568baa2bf5a.6a3bbc3a1cb9adc44c30697e:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/24 19:15:07)
步骤三：搭建单文件骨架与视觉系统
延续 Archer 既有视觉资产（报名帖品牌连续性）：五色光谱圆环（conic-gradient + 有机形变动效）、马善政体手写字、暖白底。但把「灵魂/SOUL」叙事全部换成「记忆/写作伙伴/档案/在场」。实现 5 个视图的路由切换和 localStorage 记忆层封装。
Session ID：1576059434712570:c1507647f8938c80c3bc5e73cf60611e_6a3bb5b5aa457c495571b13d.6a3bbf3b9022a568baa2bf6a.6a3bbf3b4fe56d023d503c1a:TRAE Work CN.0.1.23.no_sid.no_ppe.T(2026/6/24 19:27:55)
步骤四：实现伴生引擎（4 大功能）
用纯前端规则 + 模板模拟真实 Archer 的记忆提炼与检索：
-
generateTitles/generateContinuation：基于档案的领域和风格生成标题与续写 -
extractMemoryCandidates：正则匹配「我在写…/我喜欢…/目标是…/我发现…」提炼记忆候选 -
discoverThemes：2-3 gram 词频统计 + 去除被包含短词，归纳反复主题 -
recallOnOpen：开场回唤语生成
步骤五：记忆之环可视化与自检
档案页用 SVG 在圆环上叠五色弧段，对应五类记忆（身份/偏好/目标/选题/洞察），记忆入库时对应色段点亮——把「长期记忆」变成看得见的东西。最后用 node --check 验证 JS 语法、curl 验证文件可访问、浏览器无报错。
开发心得：
-
单文件 HTML 是同时满足「自洽 + 零依赖 + 双击可跑」的唯一形态，Vite/React 构建产物是多文件且 ES Module 需 HTTP 服务器，无法双击直接运行，不适合本赛道的 HTML 提交方式。
-
不接 LLM 是刻意取舍：评委无需 Key 即可完整体验「记忆累积」的核心概念，而概念演示正是初赛「讲得清楚」的关键。
-
圆环五色段对应五类记忆这个设计，让「长期记忆」从抽象概念变成了可视化反馈，是整个 Demo 最有记忆点的地方。
已通过的报名帖链接：
https://forum.trae.cn/t/topic/32781
Archer 初衍Demo.zip (17.1 KB)