Back to projects
02Orbital Mechanics

3D Solar System

Kepler's laws rendered in WebGL.

CourseFoundation / Juniors
Age11+
TimelineWeeks 11–12
TechThree.js · WebGL · Astronomy
VIDEO COMING SOON

What students build

Students build a complete 3D solar system from scratch using Three.js and WebGL. Every planet orbits the sun on an elliptical path following Kepler's laws — not fake circles, real ellipses with correct eccentricities. Mercury moves fastest, Neptune crawls. Earth rotates on its tilted axis. Saturn's rings catch sunlight. Students build camera controls to fly through the system, zoom into planetary surfaces, and see orbital mechanics working in real-time. The sun glows with volumetric light. Stars fill the background. It runs in any browser.

What makes it real

01

Elliptical Orbits

Kepler's first law — planets orbit in ellipses with the sun at one focus. Real eccentricity values for each planet.

02

Camera Fly-Through

OrbitControls + custom camera paths. Zoom from the sun to Pluto. Lock onto any planet and follow its orbit.

03

Planet Textures & Atmosphere

Real NASA texture maps on each planet. Earth has a blue atmosphere glow. Jupiter has visible bands.

04

Gravitational Visualization

Toggle gravity field lines showing how the sun's pull weakens with distance. Inverse square law, visible.

05

Correct Relative Speeds

Kepler's third law — planets closer to the sun orbit faster. Mercury completes 4 orbits before Earth finishes 1.

06

Interactive Info Panels

Click any planet to see real data — mass, distance, orbital period, surface gravity. Learning built into exploration.

Skills that transfer

  • Three.js and WebGL — professional 3D graphics in the browser
  • Kepler's Laws — elliptical orbits, equal areas, period-distance relationship
  • Coordinate systems — 3D space, camera positioning, rotation matrices
  • Texture mapping — applying 2D images to 3D spheres
  • Lighting — point lights, ambient light, shadows in 3D
  • User interaction — mouse controls, raycasting for click detection

Why parents care

01

Three.js is used by Google, Apple, Nike for web experiences

02

Combines astronomy knowledge with engineering skills

03

Runs in a browser — share the URL with anyone in the world

04

Portfolio-worthy project that impresses in interviews and applications

Your child can build this.

Book a free demo class — they'll write real code in the first 45 minutes.

Book a FREE Demo