Real-time mission control for NASA's Artemis II Moon mission. When NASA launched Artemis II on April 1, 2026 — the first crewed mission to the Moon since 1972 — I wanted to track it properly.
Not a simplified countdown page. Not a Twitter embed with a progress bar. A full mission control dashboard. So I built one.A.T.L.A.S is a single-page web application that tracks the Artemis II mission in real time, pulling live data from NASA's JPL Horizons ephemeris system, the Deep Space Network, and the AROW spacecraft telemetry feed.
It's hosted at track-artemis.com and has been live since launch day.
The dashboard presents live mission data across multiple panels, designed to give you the same situational awareness that mission controllers have — just with a better colour scheme.
Live orbital telemetry. Distance from Earth and Moon, spacecraft velocity, mission elapsed time, and mission progress — all computed from JPL Horizons ephemeris data for spacecraft -1024 (Orion). Updated every 60 seconds.
Interactive 3D trajectory viewer. A full Three.js scene showing the Earth-Moon system with Orion's position animated along the actual free-return trajectory path. The trajectory was derived from NASA's Plateau Astro flight map and includes LEO parking orbits, the TLI burn, outbound coast, a tight teardrop lunar flyby, and the return arc. You can orbit, zoom, and rotate the view. Waypoints mark key mission events along the path.
Spacecraft telemetry. Live attitude data (roll, pitch, yaw) with an artificial horizon indicator. Angular rates with bidirectional bars. Solar array wing angles with estimated power output. Antenna gimbal positions. Spacecraft mode. RCS thruster schematic showing all 24 thrusters with real-time firing states. All sourced from NASA's AROW community API.
3D Orion model. A decimated 1,200-triangle mesh of the Orion MPCV, driven by live quaternion data from AROW telemetry. Sits in a starfield with cinematic lighting. Drag to orbit, scroll to zoom, double-click to reset.
Deep Space Network tracking. Live dish status from NASA's DSN Now feed — showing which ground stations (Goldstone, Canberra, Madrid) are currently tracking Orion, including signal direction, frequency bands, and data rates.
Crew and mission panel. Crew bios in a 2×2 grid, a 29-event milestone timeline, mission records, and spacecraft parameters.
NASA image gallery. Live imagery from the mission scraped from NASA's gallery pages, displayed in a lightbox viewer.
Splashdown countdown. A cinematic FUI-styled countdown overlay with live phase tracking (return coast → CM/SM separation → atmospheric entry → chute deploy → splashdown). Minimises to a floating widget so you can watch the dashboard while the clock ticks down.
Simulated telemetry fallback. When NASA's AROW feed goes down (as it did on splashdown day under massive traffic), the dashboard automatically generates physically plausible telemetry based on the current mission phase — attitude angles, angular rates, solar array positions, antenna tracking — with subtle sinusoidal drift so nothing looks frozen. A clear orange notice tells visitors the data is simulated, and the system automatically switches back to live data the moment it's available.
How it's built.
The entire application is a single HTML file with an accompanying JavaScript file. No frameworks. No build tools. No dependencies beyond Three.js r128 loaded from a CDN. Everything else is vanilla JS, CSS custom properties, and hand-written SVG.
Frontend. HTML, CSS, vanilla JavaScript. Three.js r128 for the 3D trajectory viewer and attitude model. CSS custom properties power a complete theme system with three colour schemes: Default (cyan), Ares (navy/orange, Tron-inspired), and Gold (black/gold). Fonts are Orbitron, Share Tech Mono, and Barlow Condensed.
Backend. PHP proxy files handle CORS for NASA's data feeds — JPL Horizons, DSN Now XML, AROW telemetry, and NASA image galleries. A unified API endpoint with time-based token authentication serves all data through a single request, with independent server-side caching per source.
Data sources. JPL Horizons API (spacecraft -1024 ephemeris). NASA AROW community API (spacecraft attitude and systems telemetry via SSE stream with polling fallback). NASA DSN Now XML feed (Deep Space Network dish status). NASA image galleries (mission photography).
Design. The visual language is cinematic FUI — the Oblivion/GMUNK aesthetic crossed with the Artemis II mission patch colour palette. The mission badge, Orion SVG illustration (170 paths, reshaded with position-based colour mapping), and all UI elements were designed in Affinity Designer.
The trajectory problem.
Getting the 3D trajectory right was the hardest part of the build. The path uses Bézier curves with ~347 control points, and there's a critical gotcha: the curve geometry is extremely dense near the Moon. Small changes in the interpolation parameter produce huge positional jumps in that region.
Without careful intermediate waypoints in the timing map, Orion would appear to teleport to the Moon hours before it should arrive. The outbound and return legs are also much closer together than you'd expect — only 8–14 units apart on a 90.5-unit Earth-Moon scale — so the separation is subtle, not the wide arcs most diagrams suggest.
The flyby itself is a tight, pointed teardrop extending past the far side of the Moon, not the wide horseshoe shape commonly shown in simplified mission graphics. Getting that shape right required constant reference back to NASA's Plateau Astro flight map PDF.
And the whole path had to be in the XZ plane, not XY — placing it in XY caused it to appear rotated on its side in the Three.js scene.
Design details.
Orion SVG. The spacecraft illustration has 170 individual paths, each reshaded with position-based colour mapping and upper-left lighting direction to match the Artemis II patch palette. It's used across the dashboard header, crew panel, and about overlay.
ATLAS mission badge. A custom badge designed for the project, wired into the loading screen, header, about modal, and favicon.
Theme system. Three complete colour schemes built entirely on CSS custom properties. Switching themes updates everything — the 3D scenes, the telemetry panels, the trajectory path colours, the Earth atmosphere glow, even the RCS thruster firing indicators.
Data stream animation. A scrolling hex data feed that runs continuously in the sidebar. The trick to keeping it contained was animating an inner wrapper div rather than the container itself — animating the container's translateY caused the content to escape the overflow:hidden boundary.
Responsive. Full desktop layout with left and right sidebars flanking the central viewport. Sidebars collapse on smaller screens.
The numbers.
Over the course of the 10-day mission, A.T.L.A.S tracked every phase from launch to splashdown. The dashboard served visitors across multiple continents, with live telemetry updating continuously throughout.
Mission duration: ~10 days (April 1–10, 2026) Total mission distance: 695,081 miles Maximum Earth distance: 252,760 miles (surpassing Apollo 13 by 4,105 miles) Closest lunar approach: 4,070 miles Peak velocity: ~24,500 mp
This project sits at the intersection of a few things I care about: design, data, and building things that feel alive. It's a single-page app with no framework, pulling from five NASA APIs, rendering two separate Three.js scenes, managing a complete theme system, and handling graceful fallbacks when data sources fail — all in vanilla JavaScript.
It's also a project I built because I genuinely wanted to use it. Every design decision came from staring at the dashboard during the mission and thinking "that bit needs to be better." That's the kind of work I do best.
Visit track-artemis.com to explore the dashboard. After splashdown, it runs in replay mode with archived mission data.
