AETHER — Orbital Nerve Center

Frontend-only space mission control console. Operators monitor spacecraft, scrub timelines, watch live telemetry, and dock into a 3D orbital theater.

Stack

• React + TypeScript + Vite + Tailwind CSS
• React Three Fiber / Drei (orbital theater)
• Recharts (telemetry & ops analytics)
• Zustand (live mission state)
• Framer Motion + React Router + Lenis

Project structure

src/
  App.tsx                 # Boot → gate → routes
  types.ts                # Shared domain types
  data/missions.ts        # Mock fleet + chart helpers
  lib/                    # sfx, shared motion tokens
  store/                  # Zustand mission / UI / perf stores
  pages/                  # One page per nav route
  components/
    layout/Shell.tsx      # Sidebar + header + outlet
    globe/OrbitTheater.tsx
    widgets/OpsWidgets.tsx
    scrollfx/             # Reveal, parallax, section titles

Features

1. Mission status dashboard — fleet KPIs, roster filters, live alert stream
2. Spacecraft telemetry — altitude, velocity, signal, power, thermal charts
3. Comms & system health — uplink/downlink, blackout predictor, subsystem map
4. Mission timeline — phase tape + operational event log
5. Ops analytics — 24h trends, craft resource comparison (mock data)
6. 3D orbital theater — drag to inspect, click craft to dock

Run locally

npm install
npm run dev

Build

npm run build
npm run preview

Hotkeys

• 1–5 — dock / select mission
• A — acknowledge next severity alert
• Ctrl+K — command palette
• Ctrl+J — Personal AI ops copilot

Notes

• No backend. All data is mock / client-simulated.
• Telemetry values jitter on an interval to feel live.
• Click satellites in the 3D theater to select a craft.