Back to work

Speculative Concept · Cinematic Reveal

AI1

A self-initiated concept reveal site for SpaceX's AI1 — the orbital AI data-center satellite unveiled in June 2026. The specs are real; the cinema and the mythology are mine. A live WebGL starfield, AI-generated film loops, scroll-driven lore, live HUD telemetry, and an interactive orbit you can drag. A love letter to the audacity of putting a mind in orbit — built, not mocked up.

Art DirectionFront-EndMotion / WebGL3DAI Film

A self-initiated concept, built because the idea floored me. Unofficial — not affiliated with, authorized by, or endorsed by SpaceX. “SpaceX,” “Starlink,” “Starship” and related marks belong to their owners. Verified specifications are drawn from public June 2026 reporting; all narrative “lore” is invented for this concept.

The Opportunity

A real announcement worth a real reveal.

In June 2026 SpaceX unveiled AI1: a satellite that runs AI compute in orbit — 150 kilowatts of it, cooled by a 110 m² liquid radiator, parked at 600 km in perpetual sun, with a filing for up to a million of them. It's one of the most audacious ideas in years, and it deserved a reveal as cinematic as the ambition.

So I built the one I wished existed — a concept site that treats the real spec sheet as cinema, and is honest about exactly where the facts end and the mythology begins.

The Reveal / Generated Film

AI1 in orbit — the full-bleed hero loop

The Approach

Myth and spec sheet, interwoven — and labeled.

The organizing idea: make the real engineering feel mythic, without ever blurring truth and fiction. Every claim on the page is tagged VERIFIED (a real, sourced spec) or LORE (invented for the concept). The instruments only ever show real numbers; the story is the connective tissue between them.

Real facts, liveA persistent mission-control telemetry rail and HUD spec readouts run on the actual numbers — 120/150 kW compute, 110 m² radiator, 600 km LEO — with a program clock counting from the reveal, clearly marked SIM.
Fact / lore provenanceA small tag system runs through the whole page so a reader always knows what's sourced and what's imagined — the honesty device that lets the mythology run wild without misleading anyone.
Generated film throughoutA cinematic hero loop and five scroll-driven chapter films — generated in Seedance — carry the narrative from the cold-start fairing to a million-node lattice, all keyed to the same cyan / amber / violet palette.
An orbit you can walkA real-time react-three-fiber constellation lets you drag around a glowing lattice of nodes — the interactive counterpoint to the pre-rendered film.
Instrument-grade systemAn inky-vacuum palette where color encodes the craft's thermal story — radiator-cyan, thermal-amber, an iridescent “mind” violet reserved for the core — plus corner-bracket HUD framing, scanlines, and kinetic display type.

The Film / Three of Five Chapters / Seedance

First Light — the wings unfurl
The Choir of Radiators
The Constellation Remembers

The Build

Cinema that still scores green.

The hard part of a video-rich site is keeping it fast. Posters are the LCP, every clip plays only while in view, all motion respects reduced-motion, and the heavy 3D is code-split — so the whole experience ships in about 5 MB of media and still builds clean.

Next.js 16 + React 19
App Router, TypeScript, Tailwind v4 with a CSS-first token system. Deployed on Vercel.
Higgsfield · Seedance
Six cinematic AI film loops — one hero, five chapters — prompt-tuned to a single deep-space cyberpunk palette, then ffmpeg-compressed for the web.
react-three-fiber
The interactive orbit visualizer — a point-cloud constellation with bloom, drag controls, and viewport-gated render loops.
Framer Motion + Lenis
Scroll-driven reveals, kinetic decrypt headlines, parallax, and smooth scroll — all disabled under reduced motion.
Canvas starfield + HUD
A throttled 2D particle starfield behind everything, plus a live telemetry rail and animated spec readouts.
Honest by construction
A typed FACT/LORE content model drives the provenance tags, so the line between sourced spec and invented story is enforced in code.
~5MB
Total media for a fully video-driven, 3D-interactive site — six AI film loops, a WebGL starfield, and a real-time orbit, all gated to play only when seen. Cinematic and still lightweight.

Experience It Live

It's not a render. It's the running site.

Every pixel here is live — the cinematic loops, the scroll-driven lore, the live telemetry, and an interactive orbit you can drag. Built and deployed, not mocked up.

Open live siteView the Code

Scan to open

Next Case Study

Dr. Dabber↗