SpaceX Aerospace — ATC Academy AI (Flight Test Radio Suite)

An advanced, high-fidelity aviation radio training simulator themed around a SpaceX Flight Test Telemetry and Radio Communications console. Designed for pilots and crew to master Air Traffic Control (ATC) voice phraseology and readback procedures in compliance with FAA/ICAO standards.

---

✈️ System Architect & Lead Developer

This system was engineered, designed, and developed by Justine Lopez (@justpres).

• Role: Lead Systems Engineer & Project Creator
• Github Repo: JustPres/atc-simulator
• Base of Operations: Manila, Philippines
• Focus Areas: Speech Recognition Systems, Real-Time Audio Telemetry, & Aviation Simulator Integration

---

🚀 Key Features

• Interactive Speech Recognition: Uses web speech APIs to analyze user radio callbacks and compare them to exact FAA/ICAO scripts.
• Dynamic Scenario Loader: Complete flight scenarios covering pre-taxi instructions, ground control clearance, tower departure, en-route approach, and landing checkouts.
• Vibrant SpaceX Cockpit Interface: High-fidelity, dark-mode terminal layout featuring animated telemetry data feeds, radar charts, and real-time status monitors.
• Interactive Radar Map: Interactive canvas map simulation detailing aircraft positioning, airspace boundaries, and target flightpaths.
• Flight Rank & Streak Progression: Level-based crew ranking (Cadet to Flight Commander) with XP rewards and streak logs preserved locally.

---

🛠️ Technology Stack

• Frontend Framework: Next.js (App Router, React 19)
• Styling: Tailwind CSS & Tailwind PostCSS v4 config
• Icons: Lucide React
• Configuration & Types: Strict TypeScript definitions and ESLint checks

---

💻 Getting Started & Local Installation

Prerequisites

• Node.js (v18.x or later)
• npm (v10.x or later)

Quickstart Setup

1. Clone the repository:

   git clone https://github.com/JustPres/atc-simulator.git
   cd atc-simulator

2. Install project dependencies:

   npm install

3. Start the development server:

   npm run dev

   Open your browser and navigate to http://localhost:3000.

4. Compile the production build:

   npm run build

---

📂 Project Architecture

A quick breakdown of the directory organization in this project:

├── src/
│   ├── app/                 # Next.js App Router (Layouts, pages, sitemaps, and robots configuration)
│   ├── components/          # Reusable React UI (AviationSimulator, DashboardView, InteractiveRadarMap, etc.)
│   ├── data/                # Mission configurations and aviation vocabulary profiles
│   ├── lib/                 # Core engine utilities, formatting, and offline hooks
│   └── types/               # System-wide TypeScript type boundaries
├── public/                  # Core assets, aerospace imagery, and local json datasets
└── tsconfig.json            # Strict TypeScript configuration

---

📄 License

This project is licensed under the MIT License. Feel free to use and distribute it in accordance with the license conditions.