在线预览：fanhuayishiy.github.io/ai-demo/sun…
开源地址：github.com/fanhuayishi… （MIT，合集仓库，本项目在 sunset-flight-study/ 目录）
这个项目最初的请求是：「使用 web3d技术 复刻宫崎骏动漫红猪里的经典空战场景，从建模，配色，风格，运镜等方面对齐。」 后来它按一段夕阳飞行视频演进成现在的默认版本：奶油白单翼机、紫色立体云海、橙金天空，画面中间一行小字 just breathe。模型、环境、轨迹和引擎音效全部程序生成，没有把视频当背景贴上去。
能玩什么
- 打开就播。24 秒连续循环四段动作：尾随、剪刀、回旋、俯冲，镜头贴近机尾。
- 按 WASD 或方向键接管：短按微调、长按连续移动，侧倾和俯仰跟着输入走，松手很快停稳。首次接管约 0.4 秒过渡到稳定的尾随视角，屏幕构图不变。
- 范围限制在航线附近左右 ±20 米、上下 ±12 米，到底会提示「已到移动边界」，是辅助驾驶不是无限自由飞行。按 G 或「回到航线」恢复电影航线。
- 底部常驻操作栏：上一段、暂停、重新开始、下一段、机位。机位在电影、追随、自由之间循环，自由视角能拖拽旋转缩放。
- 点右上「显示控制」或按 H，展开完整时间轴、四个分镜和画质设置。
- 右上角「日间空战」切回原来的双机版本：红色飞行艇与蓝色双翼机，72 秒六段运镜。
几个值得放大看的地方
- 云是真实三维雕塑出来的云群，紫色明暗色阶加金色边光，海面有细碎倒影。
- 两条翼尖气流按飞行历史采样，飞机怎么飞它们就怎么拖。
- 机身细节：低置椭圆机翼、绿色翼尖与圆形翼徽、三色尾舵、开放座舱、鼻端螺旋桨。
- 配乐和 24 秒画面是两套时间：音乐不变速，也不因为切分镜从头播放。
- 项目自己跑了 276 项测试。
边界一句：配乐是 BAANDIT!《rumination》，走艺术家在 SoundCloud 的官方播放器在线流播，整曲约 1 分 56 秒，另有约 15.44 秒的本地片段。仓库的 MIT 许可只覆盖项目代码，不授予第三方音乐权利，公开使用前要另行确认授权。
技术栈
Three.js + Vite，云群、天空、海面、翼尖气流全是程序化几何与着色器，Web Audio 合成引擎与海风声。dist/ 直接托管。
本地跑起来
git clone https://github.com/fanhuayishiy/ai-demo.git
cd ai-demo/sunset-flight-study
npm install
npm run dev # 默认 http://localhost:5173，被占用时自动顺延
需要 Node.js 20.19+ 或 22.12+，通过本地服务访问，不要双击 index.html。
关于「从建模，配色，风格，运镜等方面对齐」
这句原话逐字留在 README 里。成品后来按视频改了方向，所以 README 另外给了一份根据最终实现整理的复现提示词，并明确标注它不冒充原始对话。两份都在。
关于这个合集
同一个仓库里还有一批 AI 辅助生成的交互式前端作品，全部 MIT 开源、全部带在线预览：可探索的家庭 3D 空间、日式街角便利店微缩沙盘、双极空气开关的结构动画、现代四驱拖拉机机械动画、波音 787-9 数字孪生大屏、热泵洗烘一体机爆炸拆解、三坊七巷真实地图导览、体素深夜拉面摊……
觉得有点意思，可以点个 Star：github.com/fanhuayishi…
