Work

原来的实现

• 涡流像素化着色器：自定义 GLSL 片元着色器，基于鼠标位移量、速度差与缓动因子（easeFactor）驱动画面扭曲，指针移动时背景如流体般跟随
• 全屏日食加载动画：把加载进度映射为日食进程——资源就绪的那一刻正好是日全食，停留 1 秒后白色光圈炸开扩散，穿过光圈直接看到网站
• 字体与首屏策略：Blanquotey 自托管 + 预加载 + 绘制纹理前显式等待字体就绪，避免首屏文字回落成系统字体
• 工程整理：JS 按职责拆分为 config / shaders / texture / nav / scene / main，目录分层为 js / css / fonts

2026.10 改版做了什么

• 内容先行：品牌、介绍、导航全部写在 HTML 里，不再等 WebGL 或图片就绪；首屏没有遮罩、没有阻塞脚本
• 特效改为可选：日食与涡流保留在交互演示页，只有主动点播放时才运行，并尊重「减少动态效果」偏好
• 图片：91.6 MB 的背景原图不再进入站点，改为 960 / 1600 / 2400 三档 AVIF / WebP / JPEG，单张 20–107 KB，带尺寸信息与懒加载
• 可访问性：原生链接导航（不再靠 SVG 点击）、字号下限、44px 点击区、键盘焦点、可见的深色主题、对比度全部 ≥ 4.5:1
• 依赖：去掉 Three.js CDN 与第三方字体请求，站点在断网 CDN 的情况下功能完全不受影响

• Three.js
• WebGL
• GLSL
• 原生 JavaScript
• CSS

现在到哪一步

• 从零接触 Godot：学习节点 / 场景的组织方式与 GDScript 脚本，理解引擎如何驱动游戏循环
• 目标：先独立完成一个可玩的小型游戏原型，把做网页动效时积累的交互与节奏感迁移到游戏里

• Godot
• GDScript
• 游戏循环
• 交互设计

占位说明：这个项目还没有可以展示的成品，所以这里不放假截图、不写虚构进度。 做出第一个可玩原型后会补上过程记录。