风栈札记：把个人网站做成一处可以停留的地方

这篇保留了 2026 年 9 月 17 日建站手记的内容与当时的状态。2026 年 10 月 8 日迁入项目日志，后续变化见目录中的新记录。

你现在打开的风栈札记，就是这次建站的结果。它从展示项目的地方开始，后来逐渐加上实验记录、日常手记和留言。

起初的需求很朴素：找个地方放项目，写写实验，顺便记一点生活。按这个需求，排几个链接其实就够了。但真要做自己的站，又总想多折腾一点。于是有了风景、滚动镜头，以及后来才慢慢补齐的文章。风栈札记就这样长成了现在的样子。

先给它起个名字

“风”是向外探索，“栈”是找个地方歇一会儿。至于“札记”，算是给自己留一点余地：不必每次都做出了什么大成果才能动笔。项目没做成也能写，踩了坑也能写，偶尔只想记两句生活，也不用专门找个技术理由。

我希望这里既能放 Robot Twin AI 和 Atom-S 这样的项目，也能容纳日常记录。名字旁边保留了一段说明，点开就能看到这座小站的含义。

阶段 1：用分层图片做滚动风景

入口看着有一点三维的意思，实现倒没有那么神秘：把远景、中景、前景拆成图片，滚动时分别移动和缩放，就有了往画面里走的感觉。画面的纵深主要来自分层图片和变换，没有建立完整的三维场景。

桥、田野、远山、花园和星空，各占一个栏目。部分背景用 AI 辅助生成，再塞进页面里调。然后问题就来了：图片单独看挺好，压上文字还能不能读？手机一裁，主体去哪了？滚动到一半，后面的旧图层怎么露出来了？这些问题需要把图片放进页面、切到手机尺寸后逐项调整。

做到后面，反而开始往回删。关于页里不合适的房子，删；子页末尾重复出现的横向栏目，也删。首页可以慢慢逛，点进项目页的人总得能看到项目，不能走到哪儿都先看一遍滚动表演。

现在进入项目栏目，先是一张没有蒙版遮挡的山景。往下滚动，画面慢慢拉近、压暗，项目日志随之出现。风景负责开场，文字接过后面的部分。

阶段 2：把项目入口和日志目录分开

加 Atom-S 的时候，另一个问题出现了：今天是 Day 0，后面还有调试、通信、训练。总不能每写一天，就往项目首页再塞一张卡片吧。现在文章少还看不出来，写多了，找一篇记录都得翻半天。

于是把它拆成三层：先选项目，再看这个项目的日志目录，最后进文章。后续文章沿用同一套目录和阅读页，不必每次新增内容都调整项目首页。

• Atom-S 按天数和阶段整理，后续日志可以继续加入同一个系列。
• Robot Twin AI 把 2026 年 7 月到 8 月的项目经历整理为一组博客，分别讨论仿真、实车控制、视觉观察和证据边界。
• 单篇复盘 则直接进入文章，比如 auto-reg，以及你正在读的这篇建站手记。

文章用 Markdown 保存，系列日志通过 Astro 内容集合组织。这样后续更新主要是写内容，不需要每篇重新做一套页面。

阶段 3：返回文章目录时跳过重复动画

动画还有一个很实际的问题：第一次看是开场，来回点几次，就变成了等它播完。

比如读完文章返回，山景又从头来一遍，还得自己往下滚到项目列表。这就有点折腾人了。现在返回会直接落到项目日志；首页手记的文章，也有对应的返回位置。

栏目之间采用统一的淡入和轻微推近转场。站内切换时跳过重复的加载开场，首次直接打开或刷新风景页时仍保留加载过程。在支持浏览器原生 View Transition 的环境里，这种切换会更连贯；不支持时仍可正常跳页。

阅读页则安静一些：浅色底、清楚的正文、稍有区别的标题和日期。手机截图限制展示尺寸，需要细看时再点击放大；同一篇文章的图片可以前后切换，点击空白处退出。它们都是小事，但比多加一段动画更影响真正的阅读。

阶段 4：在站内完成留言与审核

留言入口也值得单独做一下。点“留言”，结果弹出一个邮箱软件，这个流程总觉得少了半截。我想要的就是在这里写几句话、寄出去，所以最后加了独立的留言页，背景也沿用网站里的花园。

留言分成公开留言和私密来信。公开内容先进入待审核状态，通过之后才会展示；私密来信只在管理端查看，不进入公开列表。联系方式也保留在页面里，方便选择其他联系办法。

到这里，纯静态页面就不够了，留言得有地方存。当前用 Node.js 和 SQLite 保存，再从管理页审核。这里的“私密”表示不向其他访客展示；管理者可以读取数据库，来信未采用端到端加密。

页面、内容与留言服务的分工

前端以 Astro、TypeScript 和 CSS 为主：Astro 组织页面和文章，脚本处理滚动场景、图片查看和表单交互，公共布局保持导航与阅读样式一致。留言服务单独承担存储和审核，文章与风景页面仍然可以构建成静态文件。

Agent 参与了页面实现、样式调整、内容整理和检查。我主要决定要放什么、保留哪种体验，以及哪些地方应该删掉。比如项目页不要重复的滚动表演、日志要给后续更新留位置、留言不能只跳到邮箱，这些选择逐渐决定了网站现在的结构。

Agent 能把功能写出来，但“能用”和“放在这里合适”还隔着一段距离。重复的动画要不要留，入口好不好找，文章读着累不累，最后还是得自己打开网站，滚一遍、点一遍。只看它回复“完成了”，看不出这些问题。

本地功能已实现，部署仍待完成

截至这篇记录，风景、文章、系列目录、图片浏览和留言审核都有本地实现了，细节还在改。服务器部署还没完成，所以目前只能说本地有了这些功能，离稳定上线还差一步。

后续计划部署到甲骨文服务器。上线时还需要处理 HTTPS、进程管理、留言数据持久化和备份，并检查反向代理后的限流行为。再往后，随着文章变多，再决定是否加入标签筛选和搜索。

功能暂时做到这里，接下来先用它记录 Atom-S、整理旧项目，也写一点技术之外的事。哪些入口或阅读细节还不顺，等实际写作和使用时再改。