Terra Prime
An alternate atlas of an untouched Earth — explore 5 global ecosystems in a parallel reality where Homo sapiens never interrupted deep time. Built with React, Vite, and immersive multi-view experiences including a 3D globe, split-screen sliders, and ambient motion layers.
Creative Coding · Data Visualization · React · Immersive UX
Visit live site(opens in new tab)
Overview
Terra Prime asks a single counterfactual question: what if humans never evolved?
The project renders five major global ecosystems — Manhattan, Shanghai, Paris, Cairo, and the Amazon Estuary — as they might appear today had Homo sapiens never set foot on Earth. Each location pairs a present-day view with a Terra Prime vision: restored megafauna, dominant ancient flora, and detailed ecological insights about what would actually thrive.
Awards
- CSS Design Awards — Best Innovation, Best UX Design, Best UI Design, and Special Design Kudos
- Orpetron — Web Design Appreciation and Site of the Day
- MUSE Creative Awards — Silver Winner in Website — Experimental
Experience Modes
The site offers four distinct viewing modes, toggled from the header:
- Atlas — side-by-side split-slider comparing today vs. Terra Prime for each location
- Globe — an interactive 3D globe for spatial navigation between the five sites
- Living — an immersive full-screen "living" lens with animated overlays
- Motion — a cinematic motion layer using looping video footage
Technology
Built with React, TypeScript, and Vite. Animation handled by Framer Motion; the globe rendered with a custom WebGL layer. Ambient audio architecture was prototyped but shipped muted — the engine is in place for future activation.