--- title: 3D Air Combat Simulator emoji: ๐ŸŒ colorFrom: blue colorTo: yellow sdk: static pinned: false license: cc-by-nc-4.0 short_description: One-minute creation by AI Coding Autonomous Agent 'MOUSE-I' --- # 3D Air Combat Simulator link: https://huggingface.co/spaces/cutechicken/3D-Airforce-Simulator Developer: https://huggingface.co/spaces/cutechicken ## ๐ŸŽฎ Project Overview A high-quality web-based 3D fighter jet simulator created with **VIBE CODING**. Built with Three.js, this is a full-scale aerial combat game that runs in your browser, featuring realistic physics engine and combat systems. ## โœจ Key Features ### ๐Ÿ›ฉ๏ธ Realistic Flight Physics - **Real Aircraft Dynamics Simulation**: Realistic flight considering lift, gravity, and drag - **G-Force System**: Blackout effects during extreme maneuvers - **Stall System**: Loss of control when speed drops below threshold - **Altitude-based Performance**: G-Force increases with altitude ### ๐ŸŽฏ Combat System - **20mm Cannon**: 940 rounds, continuous fire capability - **AIM-9 Sidewinder Missiles**: 8 missiles with 3-stage lock-on system - **Flare System**: Heat-seeking countermeasures (3 uses) - **Enemy AI**: Smart AI capable of evasive maneuvers, missile launches, and flare deployment ### ๐ŸŽจ Immersive HUD - **Fighter HUD**: Speed, altitude, heading, pitch/roll indicators - **RWR (Radar Warning Receiver)**: Enemy position and lock-on warnings - **Pitch Ladder**: Aircraft attitude display - **Target Markers**: Automatic enemy marking within crosshair ### ๐Ÿ”Š Sound Design - Engine sounds, cannon fire, missile launches - Warning system (altitude, stall, Over-G, missile alerts) - Voice guidance system - Distance-based volume control ## ๐ŸŽฎ Controls ### Basic Controls - **W/S**: Throttle increase/decrease - **A/D**: Rudder (yaw) control - **Mouse**: Pitch/roll control - **Left Click**: Fire weapon - **R**: Switch weapon (Cannon โ†” Missile) - **F**: Deploy flares - **G**: Escape stall (hold for 2 seconds) ### Combat Tips 1. **Missile Lock**: Keep enemy in crosshair for 3 seconds in AIM-9 mode 2. **Flare Usage**: Press F immediately when missile warning sounds 3. **Over-G Warning**: Level out when vision darkens during extreme maneuvers 4. **Stall Recovery**: Hold G for 2 seconds when speed drops below 300kt ## ๐Ÿš€ Installation & Setup ### Requirements - Modern web browser (Chrome, Firefox, Edge recommended) - WebGL support - Mouse required ## ๐Ÿ“ Project Structure ``` 3D-Airforce-Simulator/ โ”œโ”€โ”€ index.html # Main HTML (HUD and UI) โ”œโ”€โ”€ game.js # Game logic (physics, AI, combat systems) โ”œโ”€โ”€ models/ # 3D model files โ”‚ โ”œโ”€โ”€ f-15.glb # Player fighter โ”‚ โ””โ”€โ”€ mig-29.glb # Enemy fighter โ”œโ”€โ”€ sounds/ # Sound files โ”‚ โ”œโ”€โ”€ main.ogg # BGM โ”‚ โ”œโ”€โ”€ normal.ogg # Engine sound โ”‚ โ””โ”€โ”€ ... # Various sound effects โ””โ”€โ”€ effects/ # Visual effects โ””โ”€โ”€ symbol.png # RWR symbol ``` ## ๐Ÿ› ๏ธ Tech Stack - **Three.js**: 3D graphics rendering - **Vanilla JavaScript**: Game logic - **Web Audio API**: Sound processing - **Pointer Lock API**: Mouse control ## ๐ŸŽฏ Game Objectives - **Mission**: Destroy all enemy aircraft (4) within 180 seconds - **Victory Conditions**: - Destroy all enemies - Survive time limit + destroy all enemies - **Defeat Conditions**: - Health reaches 0 (hit/collision) - Ground collision - Time expires with enemies remaining ## ๐Ÿ† Scoring System - Cannon kill: 100 points - Missile kill: 100 points - Collision kill: 200 points ## ๐Ÿ’ก VIBE CODING Achievement This project was created using the **VIBE CODING** methodology. Through rapid prototyping and immediate feedback, we achieved a high-quality 3D fighter jet simulator. ### Special Features - Complete game engine in a single JavaScript file - Real-time physics simulation - Complex AI behavior patterns - Professional HUD system - Immersive sound design ## ๐Ÿ› Known Issues - BGM playback delay due to autoplay policies in some browsers - Possible frame drops on high graphics settings - Flares may occasionally fail to perfectly evade missiles # 3D Air Combat Simulator : 3D ์ „ํˆฌ๊ธฐ ์‹œ๋ฎฌ๋ ˆ์ดํ„ฐ link: https://huggingface.co/spaces/cutechicken/3D-Airforce-Simulator ๊ฐœ๋ฐœ์ž: https://huggingface.co/spaces/cutechicken ## ๐ŸŽฎ ํ”„๋กœ์ ํŠธ ์†Œ๊ฐœ **VIBE CODING**์œผ๋กœ ์ œ์ž‘๋œ ์™„์„ฑ๋„ ๋†’์€ ์›น ๊ธฐ๋ฐ˜ 3D ์ „ํˆฌ๊ธฐ ์‹œ๋ฎฌ๋ ˆ์ดํ„ฐ์ž…๋‹ˆ๋‹ค. Three.js๋ฅผ ํ™œ์šฉํ•˜์—ฌ ๋ธŒ๋ผ์šฐ์ €์—์„œ ์‹คํ–‰๋˜๋Š” ๋ณธ๊ฒฉ์ ์ธ ๊ณต์ค‘์ „ ๊ฒŒ์ž„์œผ๋กœ, ์‹ค์ œ ์ „ํˆฌ๊ธฐ์˜ ๋ฌผ๋ฆฌ ์—”์ง„๊ณผ ์ „ํˆฌ ์‹œ์Šคํ…œ์„ ๊ตฌํ˜„ํ–ˆ์Šต๋‹ˆ๋‹ค. ## โœจ ์ฃผ์š” ํŠน์ง• ### ๐Ÿ›ฉ๏ธ ๋ฆฌ์–ผ๋ฆฌ์Šคํ‹ฑํ•œ ๋น„ํ–‰ ๋ฌผ๋ฆฌ - **์‹ค์ œ ํ•ญ๊ณต๊ธฐ ์—ญํ•™ ์‹œ๋ฎฌ๋ ˆ์ด์…˜**: ์–‘๋ ฅ, ์ค‘๋ ฅ, ํ•ญ๋ ฅ์„ ๊ณ ๋ คํ•œ ํ˜„์‹ค์ ์ธ ๋น„ํ–‰ - **G-Force ์‹œ์Šคํ…œ**: ๊ธ‰๊ธฐ๋™ ์‹œ ๋ธ”๋ž™์•„์›ƒ ํšจ๊ณผ ๊ตฌํ˜„ - **์Šคํ†จ(์‹ค์†) ์‹œ์Šคํ…œ**: ์†๋„ ๋ถ€์กฑ ์‹œ ์กฐ์ข… ๋ถˆ๋Šฅ ์ƒํƒœ ์žฌํ˜„ - **๊ณ ๋„๋ณ„ ์„ฑ๋Šฅ ๋ณ€ํ™”**: ๊ณ ๋„์— ๋”ฐ๋ฅธ G-Force ์ฆ๊ฐ€ ### ๐ŸŽฏ ์ „ํˆฌ ์‹œ์Šคํ…œ - **20mm ๊ธฐ๊ด€ํฌ**: 940๋ฐœ ํƒ„์•ฝ, ์—ฐ์‚ฌ ๊ฐ€๋Šฅ - **AIM-9 ์‚ฌ์ด๋“œ์™€์ธ๋” ๋ฏธ์‚ฌ์ผ**: 8๋ฐœ ์žฅ์ฐฉ, 3๋‹จ๊ณ„ ๋ฝ์˜จ ์‹œ์Šคํ…œ - **ํ”Œ๋ ˆ์–ด ์‹œ์Šคํ…œ**: ๋ฏธ์‚ฌ์ผ ํšŒํ”ผ์šฉ ์—ด์ถ”์  ๊ต๋ž€ ์žฅ์น˜ (3ํšŒ ์‚ฌ์šฉ) - **์ ๊ธฐ AI**: ํšŒํ”ผ ๊ธฐ๋™, ๋ฏธ์‚ฌ์ผ ๋ฐœ์‚ฌ, ํ”Œ๋ ˆ์–ด ์‚ฌ์šฉ ๊ฐ€๋Šฅํ•œ ์Šค๋งˆํŠธ AI ### ๐ŸŽจ ๋ชฐ์ž…๊ฐ ์žˆ๋Š” HUD - **์ „ํˆฌ๊ธฐ HUD**: ์†๋„, ๊ณ ๋„, ํ—ค๋”ฉ, ํ”ผ์น˜/๋กค ํ‘œ์‹œ - **RWR (๋ ˆ์ด๋” ๊ฒฝ๋ณด ์ˆ˜์‹ ๊ธฐ)**: ์ ๊ธฐ ์œ„์น˜ ๋ฐ ๋ฝ์˜จ ๊ฒฝ๊ณ  - **ํ”ผ์น˜ ๋ž˜๋”**: ํ•ญ๊ณต๊ธฐ ์ž์„ธ ํ‘œ์‹œ - **ํƒ€๊ฒŸ ๋งˆ์ปค**: ํฌ๋กœ์Šคํ—ค์–ด ๋‚ด ์ ๊ธฐ ์ž๋™ ํ‘œ์‹œ ### ๐Ÿ”Š ์‚ฌ์šด๋“œ ๋””์ž์ธ - ์—”์ง„์Œ, ๊ธฐ๊ด€ํฌ, ๋ฏธ์‚ฌ์ผ ๋ฐœ์‚ฌ์Œ - ๊ฒฝ๊ณ ์Œ ์‹œ์Šคํ…œ (๊ณ ๋„, ์Šคํ†จ, Over-G, ๋ฏธ์‚ฌ์ผ ๊ฒฝ๊ณ ) - ์Œ์„ฑ ์•ˆ๋‚ด ์‹œ์Šคํ…œ - ๊ฑฐ๋ฆฌ๋ณ„ ์Œ๋Ÿ‰ ์กฐ์ ˆ ## ๐ŸŽฎ ์กฐ์ž‘๋ฒ• ### ๊ธฐ๋ณธ ์กฐ์ž‘ - **W/S**: ์Šค๋กœํ‹€ ์ฆ๊ฐ€/๊ฐ์†Œ - **A/D**: ๋Ÿฌ๋” (์š”) ์กฐ์ž‘ - **๋งˆ์šฐ์Šค**: ํ”ผ์น˜/๋กค ์กฐ์ž‘ - **์ขŒํด๋ฆญ**: ๋ฌด๊ธฐ ๋ฐœ์‚ฌ - **R**: ๋ฌด๊ธฐ ์ „ํ™˜ (๊ธฐ๊ด€ํฌ โ†” ๋ฏธ์‚ฌ์ผ) - **F**: ํ”Œ๋ ˆ์–ด ๋ฐœ์‚ฌ - **G**: ์Šคํ†จ ํƒˆ์ถœ (2์ดˆ๊ฐ„ ์œ ์ง€) ### ์ „ํˆฌ ํŒ 1. **๋ฏธ์‚ฌ์ผ ๋ฝ์˜จ**: AIM-9 ๋ชจ๋“œ์—์„œ ์ ๊ธฐ๋ฅผ ํฌ๋กœ์Šคํ—ค์–ด์— 3์ดˆ๊ฐ„ ์œ ์ง€ 2. **ํ”Œ๋ ˆ์–ด ์‚ฌ์šฉ**: ๋ฏธ์‚ฌ์ผ ๊ฒฝ๊ณ ์Œ์ด ๋“ค๋ฆฌ๋ฉด ์ฆ‰์‹œ Fํ‚ค๋กœ ํ”Œ๋ ˆ์–ด ๋ฐœ์‚ฌ 3. **Over-G ์ฃผ์˜**: ๊ธ‰๊ธฐ๋™ ์‹œ ์‹œ์•ผ๊ฐ€ ์–ด๋‘์›Œ์ง€๋ฉด ์ˆ˜ํ‰ ๋น„ํ–‰์œผ๋กœ ํšŒ๋ณต 4. **์Šคํ†จ ํšŒ๋ณต**: ์†๋„ 300kt ์ดํ•˜์—์„œ Gํ‚ค๋ฅผ 2์ดˆ๊ฐ„ ๋ˆŒ๋Ÿฌ ํšŒ๋ณต ## ๐Ÿš€ ์„ค์น˜ ๋ฐ ์‹คํ–‰ ### ์š”๊ตฌ์‚ฌํ•ญ - ์ตœ์‹  ์›น ๋ธŒ๋ผ์šฐ์ € (Chrome, Firefox, Edge ๊ถŒ์žฅ) - WebGL ์ง€์› - ๋งˆ์šฐ์Šค ํ•„์ˆ˜ ## ๐Ÿ“ ํ”„๋กœ์ ํŠธ ๊ตฌ์กฐ ``` 3D-Airforce-Simulator/ โ”œโ”€โ”€ index.html # ๋ฉ”์ธ HTML (HUD ๋ฐ UI) โ”œโ”€โ”€ game.js # ๊ฒŒ์ž„ ๋กœ์ง (๋ฌผ๋ฆฌ, AI, ์ „ํˆฌ ์‹œ์Šคํ…œ) โ”œโ”€โ”€ models/ # 3D ๋ชจ๋ธ ํŒŒ์ผ โ”‚ โ”œโ”€โ”€ f-15.glb # ํ”Œ๋ ˆ์ด์–ด ์ „ํˆฌ๊ธฐ โ”‚ โ””โ”€โ”€ mig-29.glb # ์  ์ „ํˆฌ๊ธฐ โ”œโ”€โ”€ sounds/ # ์‚ฌ์šด๋“œ ํŒŒ์ผ โ”‚ โ”œโ”€โ”€ main.ogg # BGM โ”‚ โ”œโ”€โ”€ normal.ogg # ์—”์ง„์Œ โ”‚ โ””โ”€โ”€ ... # ๊ฐ์ข… ํšจ๊ณผ์Œ โ””โ”€โ”€ effects/ # ์‹œ๊ฐ ํšจ๊ณผ โ””โ”€โ”€ symbol.png # RWR ์‹ฌ๋ณผ ``` ## ๐Ÿ› ๏ธ ๊ธฐ์ˆ  ์Šคํƒ - **Three.js**: 3D ๊ทธ๋ž˜ํ”ฝ ๋ Œ๋”๋ง - **Vanilla JavaScript**: ๊ฒŒ์ž„ ๋กœ์ง - **Web Audio API**: ์‚ฌ์šด๋“œ ์ฒ˜๋ฆฌ - **Pointer Lock API**: ๋งˆ์šฐ์Šค ์ปจํŠธ๋กค ## ๐ŸŽฏ ๊ฒŒ์ž„ ๋ชฉํ‘œ - **๋ฏธ์…˜**: 180์ดˆ ๋‚ด์— ๋ชจ๋“  ์ ๊ธฐ(4๋Œ€) ๊ฒฉ์ถ” - **์Šน๋ฆฌ ์กฐ๊ฑด**: - ๋ชจ๋“  ์ ๊ธฐ ํŒŒ๊ดด - ์‹œ๊ฐ„ ๋‚ด ์ƒ์กด + ๋ชจ๋“  ์ ๊ธฐ ํŒŒ๊ดด - **ํŒจ๋ฐฐ ์กฐ๊ฑด**: - ์ฒด๋ ฅ 0 (ํ”ผ๊ฒฉ/์ถฉ๋Œ) - ์ง€๋ฉด ์ถฉ๋Œ - ์‹œ๊ฐ„ ์ดˆ๊ณผ ์‹œ ์ ๊ธฐ ์ž”์กด ## ๐Ÿ† ์ ์ˆ˜ ์‹œ์Šคํ…œ - ๊ธฐ๊ด€ํฌ ๊ฒฉ์ถ”: 100์  - ๋ฏธ์‚ฌ์ผ ๊ฒฉ์ถ”: 100์  - ์ถฉ๋Œ ๊ฒฉ์ถ”: 200์  ## ๐Ÿ’ก VIBE CODING์˜ ๊ฒฐ๊ณผ๋ฌผ ์ด ํ”„๋กœ์ ํŠธ๋Š” **VIBE CODING** ๋ฐฉ๋ฒ•๋ก ์œผ๋กœ ์ œ์ž‘๋˜์—ˆ์Šต๋‹ˆ๋‹ค. ๋น ๋ฅธ ํ”„๋กœํ† ํƒ€์ดํ•‘๊ณผ ์ฆ‰๊ฐ์ ์ธ ํ”ผ๋“œ๋ฐฑ์„ ํ†ตํ•ด ๋†’์€ ์™„์„ฑ๋„์˜ 3D ์ „ํˆฌ๊ธฐ ์‹œ๋ฎฌ๋ ˆ์ดํ„ฐ๋ฅผ ๊ตฌํ˜„ํ–ˆ์Šต๋‹ˆ๋‹ค. ### ํŠน๋ณ„ํ•œ ์  - ๋‹จ์ผ JavaScript ํŒŒ์ผ๋กœ ๊ตฌํ˜„๋œ ์™„์ „ํ•œ ๊ฒŒ์ž„ ์—”์ง„ - ์‹ค์‹œ๊ฐ„ ๋ฌผ๋ฆฌ ์‹œ๋ฎฌ๋ ˆ์ด์…˜ - ๋ณต์žกํ•œ AI ํ–‰๋™ ํŒจํ„ด - ์ „๋ฌธ์ ์ธ HUD ์‹œ์Šคํ…œ - ๋ชฐ์ž…๊ฐ ์žˆ๋Š” ์‚ฌ์šด๋“œ ๋””์ž์ธ ## ๐Ÿ› ์•Œ๋ ค์ง„ ์ด์Šˆ - ์ผ๋ถ€ ๋ธŒ๋ผ์šฐ์ €์—์„œ ์ž๋™ ์žฌ์ƒ ์ •์ฑ…์œผ๋กœ ์ธํ•œ BGM ์žฌ์ƒ ์ง€์—ฐ - ๊ณ ์‚ฌ์–‘ ๊ทธ๋ž˜ํ”ฝ ์„ค์ •์—์„œ ํ”„๋ ˆ์ž„ ๋“œ๋กญ ๊ฐ€๋Šฅ - ํ”Œ๋ ˆ์–ด ํšจ๊ณผ๊ฐ€ ๊ฐ„ํ˜น ๋ฏธ์‚ฌ์ผ์„ ์™„๋ฒฝํžˆ ํšŒํ”ผํ•˜์ง€ ๋ชปํ•  ์ˆ˜ ์žˆ์Œ