Skyfall：可在浏览器运行的开源 WebGPU 空战游戏
英文标题：🔶 Skyfall – open-source WebGPU aircombat game that runs in your browser
Skyfall Protocol 是一款完全运行于桌面版 Chrome 的 WebGPU 空战游戏原型，提供 7 架现代战机、里昂 3D 城市场景、四幕战役任务与自由飞行模式。项目基于 WebGPU、Three.js、3D Tiles、本地地图文件和开放城市数据构建，无需 API Key、付费账户或安装游戏客户端。开发者称，该项目旨在探索现代浏览器图形能力与 AI 辅助开发的边界，游戏的设计与测试主要通过提示词和视觉反馈完成，而非人工阅读实现代码。项目展示了浏览器端本地文件访问、渐进式地图流送和高质量实时渲染在互动内容开发中的可行性，但目前仍是一个可玩原型，硬件门槛和帧率表现尚未给出保证。
1.6 KB
3.7 MB
484.4 KB
329.3 KB
91.6 KB
中文
游戏地址：https://a7ul.github.io/skyfall
**Skyfall Protocol 是一款完全通过 vibe coding 打造、可免费在桌面版 Chrome 中运行的 AAA+ 空战游戏。**玩家可以驾驶 7 架现代战机飞越带有纹理的里昂 3D 城市，在四幕战役任务中作战，或在自由飞行模式中探索城市。这是一个可玩的原型，AAA+ 指的是其在视觉与玩法上的目标。
该项目试图探索现代浏览器图形技术与 AI 辅助开发能够走多远。挑战在于：不人工阅读实现代码，而是仅通过提示词和视觉效果来指导、测试游戏。WebGPU、本地地图存储、开放城市数据及现成的飞机资产，使得纯浏览器版本得以实现，无需 API Key、计费账户或安装游戏。
点击开始游玩 ^
在桌面版 Chrome 中打开 GitHub Pages 上的 Skyfall Protocol，然后按照启动界面的指引操作：
| 步骤 | 操作说明 |
|---|---|
| 1 · 选择地图 | 选择 Lyon。将地图 ZIP 的所有分卷下载到同一文件夹，然后在 Chrome 中选择该文件夹并授予读写权限。游戏会在本地验证并准备城市数据。 |
| 2 · 选择飞行模式 | 选择 Operation Nightglass 进入剧情任务，或选择 Free Flight 进行探索与练习。 |
| 3 · 选择飞机 | 从 7 架喷气式战机中选择一架。所选飞机会显示在里昂预览画面上方。 |
| 4 · 开始游戏 | 起始城市区域准备完成后即可启动。飞行过程中，更精细的地图瓦片会从所选文件夹中加载。 |
同一浏览器和站点会在刷新页面后记住所选文件夹。Chrome 可能要求你重新授予连接权限，但通常无需再次浏览并选择该文件夹。地图包是一个里昂市中心快照；已捕获地图瓦片之外的区域无法获得额外细节。游戏需要支持 WebGPU、开启 GPU 加速的桌面版 Chrome，以及足以解压地图的可用磁盘空间。无需公司 API Key，也没有使用费用。
Operation Nightglass 的故事围绕 Viper One 展开：Sable 控制了里昂的撤离通信频率，并将 Mercy Seven 的救援车队困在罗讷河畔。该车队携带 Sable 击落一架救援飞机的证据。在一次出击中，你需要摧毁两台干扰器、从空中伏击中生还、对阵指挥官 Wraith，并为车队打通撤离通道。
Free Flight 会在没有战役目标的情况下开放同一座城市。你可以低空掠过河流与街道，练习滚转和倒飞，切换摄像机视角，并自由使用武器。
| 飞行 | 战斗 | 城市 |
|---|---|---|
| 独立的俯仰、滚转与偏航控制；针对不同飞机的操控特性；油门、减速板、失速和动态控制面。 | 机炮、制导或非制导导弹、重力炸弹以及风格化的特殊武器。对地表的打击会产生不同的水面、道路和建筑效果。 | 2023 年里昂摄影测量网格，具备渐进式细节加载、道路交通、地面目标和近似碰撞场。 |
7 架可操控飞机包括：F-22 Raptor、F-35 Lightning II、Su-57 Felon、Su-35 Flanker-E、F-15E Strike Eagle、F-16 Fighting Falcon 和 A-10 Thunderbolt II。其游戏内飞行参数保留了不同的任务定位，同时压缩了现实中的飞行速度，以适应城市环境飞行。这是一款街机式空战游戏，而非飞行训练模拟器。
| 层级 | 技术 | 游戏中的作用 |
|---|---|---|
| 渲染 | 通过 Three.js WebGPURenderer 使用 WebGPU | 渲染飞机、城市、光照、粒子与特效。游戏不提供 WebGL 回退方案。 |
| 世界 | 3D Tiles Renderer 和 Métropole de Lyon 2023 photomesh | 从本地地图文件中流送飞机附近的高精度细节。 |
| 本地存储 | Chrome File System Access API 和 IndexedDB | 允许玩家选择地图文件夹、复用已准备的瓦片，并在刷新后重新连接。 |
| 地图打包 | ZIP 分卷 和 zip.js | 在飞行前验证下载的地图包，并并行解压地图瓦片。 |
| 飞机 | glTF / GLB 模型 | 7 个带纹理的战斗机模型，具有动态控制面和尾焰效果。 |
| 玩法 | JavaScript modules | 飞行调校、目标锁定、武器、交通、任务逻辑、碰撞、音频和受损特效。 |
| 工具链 | Vite、Bun、Git LFS | 用于本地开发和生产构建；大型飞机与环境资产通过 LFS 跟踪。 |
城市网格数据来自 Métropole de Lyon，采用法国 Open Licence 2.0 授权。道路和建筑数据鸣谢 OpenStreetMap contributors。地图 ZIP 文件位于 Git 仓库之外；游戏运行时，浏览器会读取玩家选择的本地文件夹。有关覆盖范围和打包限制，请参阅 Lyon map data。
浏览器和构建测试已在一台配备 Apple M4 Mac mini、16 GB 统一内存 的设备上完成，使用开启 WebGPU 的桌面版 Chrome。上述配置是开发机器的硬件信息，不是 MacBook Pro 基准测试，也尚未确定最低硬件规格或帧率保证。
git clone git@github.com:a7ul/skyfall.git
cd skyfall
git lfs pull
bun install
bun run dev
在桌面版 Chrome 中打开 Vite 输出的 URL。本地开发版本和托管版本使用同一套基于文件夹的地图读取器。大型地图 ZIP 文件不包含在 Git 中。若在已有已转换里昂缓存的机器上开发，可通过 bun run map:pack:lyon 创建地图包；否则请从游戏中下载地图包。将所有 ZIP 分卷保存在同一文件夹中，并在游戏内选择该文件夹。若要检查生产构建，请运行 bun run build，随后运行 bun run preview。
| 输入 | 操作 |
|---|---|
| W / S 或 ↑ / ↓ | 机头向下 / 向上 |
| A / D | 向左 / 向右滚转 |
| Q / E 或 ← / → | 向左 / 向右偏航 |
| 按住 Shift / Ctrl | 加力并提高油门 / 降低油门；A-10 没有加力燃烧室 |
| 点击游戏后移动鼠标 | 俯仰与倾斜 |
| Space / 左键 | 机炮 |
| F / 右键 | 导弹，可锁定或不锁定发射 |
| B / N | 重力炸弹 / 特殊武器 |
| G / C / M | 按住减速板 / 切换摄像机 / 静音 |
| P / Esc / HUD 按钮 | 暂停并显示所有控制说明 |
使用 A 或 D 滚转，然后通过俯仰进入转弯。持续按住滚转或俯仰控制，可完成完整滚转或筋斗。游戏也支持手柄输入。
目前包含一个可玩任务和自由飞行模式。破坏效果、爆炸以及碰撞高度均为游戏近似模拟。城市画质取决于已捕获的地图瓦片、飞行高度和硬件性能。
飞机为采用非商业许可的第三方资产；重新分发或用于商业用途前，请查阅飞机署名信息。HDR 天空素材来自 Poly Haven，采用 CC0 协议。另请参阅音频鸣谢、飞行模型参考资料、玩法说明和加力燃烧器美术来源说明。
English / 原文
Game url: https://a7ul.github.io/skyfall
Skyfall Protocol is a fully vibe-coded AAA+ air-combat game that runs entirely in desktop Chrome for free. Fly seven modern aircraft over a textured 3D Lyon, fight through a four-act campaign mission, or explore the city in free flight. This is a playable prototype, with AAA+ as its visual and gameplay ambition.
This project asks how far modern browser graphics and AI-assisted development can go. The challenge was to direct and playtest the game through prompts and visuals, without manually reading the implementation code. WebGPU, local map storage, open city data, and off-the-shelf aircraft assets made a browser-only version possible without an API key, billing account, or game installation.
Click to play ^
Open Skyfall Protocol on GitHub Pages in desktop Chrome, then follow the launch screen:
| Step | What to do |
|---|---|
| 1 · Choose map | Select Lyon. Download every map ZIP part into the same folder, then choose that folder in Chrome and grant read/write access. The game validates and prepares the city locally. |
| 2 · Choose flight | Pick Operation Nightglass for the story mission or Free Flight to explore and practice. |
| 3 · Choose aircraft | Select one of seven jets. The chosen aircraft appears over the Lyon preview. |
| 4 · Start game | Launch when the starting city area is ready. Finer tiles load from the selected folder as you fly. |
The folder selection is remembered for the same browser and site across refreshes. Chrome may ask you to reconnect permission, but you should not need to browse to the folder again. The map pack is a central Lyon snapshot ; areas outside the captured tiles cannot acquire extra detail. The game needs a WebGPU-capable desktop Chrome build with GPU acceleration and enough free disk space to unpack the map. There are no company API keys or usage charges.
skyfall_setup.mp4
Operation Nightglass follows Viper One after Sable seizes Lyon's evacuation frequencies and traps Mercy Seven's relief convoy beside the Rhône. The convoy carries evidence that Sable shot down a relief plane. Across one sortie, you disable two jammers, survive an aerial ambush, face commander Wraith, and open an exit corridor for the convoy.
Free Flight opens the same city without the campaign objective. Fly low over the river and streets, practice rolls and inverted flight, switch cameras, and use the weapons freely.
| Flight | Combat | City |
|---|---|---|
| Separate pitch, roll, and yaw; aircraft-specific handling; throttle, air brake, stalls, and animated control surfaces. | Cannon, guided or unguided missiles, gravity bombs, and a stylized special weapon. Surface impacts create different water, road, and building effects. | 2023 Lyon photomesh with progressive detail, road traffic, ground targets, and an approximate collision field. |
The seven playable aircraft are the F-22 Raptor, F-35 Lightning II, Su-57 Felon, Su-35 Flanker-E, F-15E Strike Eagle, F-16 Fighting Falcon, and A-10 Thunderbolt II. Their game flight profiles keep different roles while compressing real-world speed for city flying. This is an arcade air-combat game, not a flight-training simulation.
| Layer | Technology | Role in the game |
|---|---|---|
| Rendering | WebGPU through Three.js WebGPURenderer | Aircraft, city, lighting, particles, and effects. The game has no WebGL fallback. |
| World | 3D Tiles Renderer and the Métropole de Lyon 2023 photomesh | Streams higher detail near the aircraft from local map files. |
| Local storage | Chrome File System Access API and IndexedDB | Lets players choose a map folder, reuse prepared tiles, and reconnect it after refresh. |
| Map packaging | ZIP parts and zip.js | Validates the downloaded pack and extracts tiles in parallel before flight. |
| Aircraft | glTF / GLB models | Seven textured fighter models with animated control surfaces and exhaust effects. |
| Gameplay | JavaScript modules | Flight tuning, targeting, weapons, traffic, mission logic, collisions, audio, and damage effects. |
| Tooling | Vite, Bun, Git LFS | Local development and production builds; large aircraft and environment assets are tracked with LFS. |
The city mesh comes from Métropole de Lyon under the French Open Licence 2.0. Road and building data are credited to OpenStreetMap contributors. Map ZIPs stay outside the Git repository; the browser reads the chosen local folder during play. See Lyon map data for coverage and packaging limits.
Browser and build checks have been run on an Apple M4 Mac mini, 16 GB unified memory , with desktop Chrome and WebGPU enabled. This is the hardware reported by the development machine. It is not a MacBook Pro benchmark, and no minimum hardware specification or frame-rate guarantee has been established.
Install Bun and Git LFS, then run:
git clone git@github.com:a7ul/skyfall.git
cd skyfall
git lfs pull
bun install
bun run dev
Open the URL printed by Vite in desktop Chrome. Local development and the hosted build use the same folder-based map reader. The large map ZIPs are not in Git. For development on a machine with an existing converted Lyon cache, create them with bun run map:pack:lyon; otherwise download the map pack from the game. Keep all ZIP parts in one folder and choose that folder in the game. To check a production build, run bun run build followed by bun run preview.
| Input | Action |
|---|---|
| W / S or ↑ / ↓ | Nose down / up |
| A / D | Roll left / right |
| Q / E or ← / → | Yaw left / right |
| Hold Shift / Ctrl | Boost and raise throttle / lower throttle; the A-10 has no afterburner |
| Mouse after clicking the game | Pitch and bank |
| Space / left click | Cannon |
| F / right click | Missile, with or without a lock |
| B / N | Gravity bomb / special weapon |
| G / C / M | Hold air brake / change camera / mute |
| P / Esc / HUD button | Pause and show all controls |
Bank with A or D, then pitch into the turn. Holding roll or pitch completes a full roll or loop. Gamepad input is also supported.
This is one playable mission and free flight. Destruction, explosions, and collision heights are game approximations. City quality depends on the captured map tiles, altitude, and hardware.
The aircraft are third-party assets under noncommercial licenses ; review aircraft attribution before redistribution or commercial use. The HDR sky is from Poly Haven, CC0. See audio credits, flight-model references, gameplay notes, and afterburner art provenance.