一个网站从静止的画面开始，又在每一次滚动、阅读和聆听中，慢慢有了自己的节奏。这篇制作札记记录当前可运行的部分，也留出仍待完成的空间。

让画面有前后，也有呼吸

窗边、桌前、草地和星空现在各自拥有独立背景与透明主体。镜头由同一滚动进度驱动，近处的材质经过镜头时，才切换到下一幅构图。反向滚动可以沿原路径返回。

发丝和布料在局部网格中轻微运动，面部与手部区域保持固定。这里使用的是明确标注的 AI 辅助重建素材和网页二维网格，并非原作者分层工程，也不是完成绑定的 Cubism 模型；最终艺术审核仍待进行。

让阅读留下清楚的路标

文字来自真实 CMS。目录由已保存的标题生成，代码在服务器排版，复制按钮等待浏览器给出真实结果。下面这段示意代码表达了播放器的结构；它不是可直接替换整个应用的完整实现。

typescript
type Track = { id: string; title: string }

function openTrack(track: Track, audio: HTMLAudioElement) {
  audio.src = `/api/music/${encodeURIComponent(track.id)}/stream`
  return audio.play()
}

// Keep the same audio element in the shared site layout.
// Handle rejection and route changes in the persistent owner.
结构示例 · 实际播放器另包含权限、请求竞态和错误恢复。

给一段声音，留一个位置

测试音乐是一段原创合成器乐，未取用听歌排行里的商业录音。叠加几个正弦分量，可以得到最基础的合成音色：

x(t)=∑k=1Kaksin⁡(2πfkt+φk)x(t) = \sum_{k=1}^{K} a_k \sin(2\pi f_k t + \varphi_k)
基础加法合成表达式；这是示意模型，不是完整乐曲生成器。

音乐的播放时间属于全站同一个 audio 元素。打开 Blog 或 Projects 时，页面内容可以改变，正在播放的声音继续前进。波形与频谱也应反映真实数据，并在不需要时停止绘制。

制作继续，边界也清楚

当前验证环境是 Windows 上的本地 Chromium 浏览器。正式 Live2D 文件、可公开的 CAD2GIS 演示数据、正式曲库授权与真机性能仍需单独交付和检查。一个可运行的里程碑，是继续打磨的起点。