/ Shipped
Black Holes: A Space Adventure
My daughter asked what a black hole is. I built her a 3D one she can fly around, with eleven short, true facts she can hear read out loud.
Demo
See it in action
What I made
My daughter got very interested in black holes, and the videos I found were either too scary or too technical. So I made her a small space adventure in the browser. It opens on a glowing black hole that she can spin, zoom into and fly around, and eleven short steps walk through the main ideas: gravity is a pull, a giant star collapses and goes boom, the whole Earth squished into a marble, the edge of no return, light that bends, the glowing whirlpool, space spaghetti, the giant black hole in the middle of our galaxy, and the first photo of one.
Each step has one or two sentences written for a five-year-old and a “Read to me” button, because she can’t read yet. Behind a “For grown-ups” fold, each step has the real numbers and a link to the Wikipedia article I checked them against.
What I’d change
I want to add sound, a gentle hum that gets deeper as you get closer. I also want a “fly into it” mode where the stars squeeze into a bright ring behind you, and a step on time slowing down near the edge, which I left out because I couldn’t explain it simply enough yet.
How I built it
First I read the Wikipedia articles on black holes, Sagittarius A*, the Schwarzschild radius, spaghettification and the Event Horizon Telescope, and pulled out only the facts I could say to a five-year-old without lying. Then I built the scene in Three.js.
The black hole isn’t a black ball with a picture around it. I wrote a shader that traces a ray of light for every pixel and bends it around the hole with the equation for light near a non-spinning black hole. That’s what makes the far side of the disk show up above and below the hole, the stars warp as you orbit, and the shadow come out about 2.6 times the size of the event horizon, the way the physics says. The yellow light beams in the “bendy light” step are calculated with the same equation. One side of the disk is brighter because that gas is moving toward you.
The star, the Earth, the astronaut and the galaxy are ordinary 3D objects drawn on top. The Earth’s texture is generated in code, so the demo loads no images. The narration uses the browser’s built-in speech. It runs by itself and inside this page, and it lowers its own resolution on slower computers so it stays smooth.