[Oogiri (Comedy Contest) Mode] I was told to 'go beyond the solar system next,' so I made a site that warps to the edge of the universe.
How is everyone doing?
The other day, I published an article titled 'I made the world's hottest site (6000°C) that melts your browser as an apology for making it too cold,' and it was enjoyed by more people than I expected.
Then, I received these kind (?) words in the comments section.

I visited your site. I really feel the sense of humor. It's turning into an Oogiri contest lol. For now, it might be fun to make a site that crosses the solar system and heads out. I'd love to see a visual where you stop by all the planets and satellites and head out of the solar system.
From absolute zero to magma (6000°C), and now you want to go beyond the limits of temperature to a 'journey into outer space'? ...That's awesome. Challenge accepted!
So, in response to your prompt, I've created a site that crosses the solar system and warps even further into the unknown universe beyond.
It's called 'The site that goes the farthest in the world - VOYAGER'.

Click here for the site (PC and sound recommended!)
What kind of site is it?

This time, instead of temperature parameters, I went all-in on 'distance and scale.' It's an interactive site that builds a 3D space in your browser, starting from Earth, stopping by the planets of the solar system one after another, and finally warping to the 'edge of the observable universe (13.8 billion light-years away).'
I didn't just want you to look at the stars; I packed in several carefully crafted elements to enhance the 'immersion' of space travel.
1. 'TPS (Third-Person) Perspective' to travel with the probe
Instead of just moving the camera, I placed a 'gold probe (artificial satellite)' in front of the player. When you press the 'NEXT PLANET' button, pale blue plasma flames erupt from behind the craft, and it warps to the next star while shaking violently.
2. From the solar system to black holes, and to the 'edge of the universe'
Beyond the planets of the solar system (Mars, Jupiter, Saturn's rings, etc.), once you pass Pluto, you can warp 'outside the solar system.'
You can stop by the giant Orion Nebula, the M87 black hole spewing plasma jets, and even go beyond the Andromeda Galaxy to the 'edge of the universe,' the limit where light can reach.

3. 'Sounds of the universe' generated in the browser (Web Audio API)
This time, I also implemented audio so that you can feel the cold, vast universe not only visually but also auditorily.
While a low ambient drone sound echoes, the roar of thrusters rings out during the warp. Please try experiencing it with headphones on.
4. What lies beyond the edge of the universe...?
When you arrive at the final celestial body, the button changes to 'BEYOND UNIVERSE.' When you press it along with the warning sound, where does the probe fly off to...? Please see for yourself.
How I made it (a little bit of technical talk)
This time, I implemented it using a 3D library called 'Three.js.' Surprisingly, I didn't use any image texture materials at all.
Celestial body rendering: I represent gas planets, black holes, and galaxies simply by combining parameters for color, transparency, and light emission (AdditiveBlending) on spheres (SphereGeometry) and rings (RingGeometry).
Starry sky: I scattered 20,000 particles (tiny dots) across a range of 150,000, and by flowing them toward the back of the camera during the warp, I created a sense of speed.
Sound: I didn't use any audio files (like mp3s) either; I used the 'Web Audio API' oscillator (waveform generation) to synthesize engine sounds and ambient noise in real-time within the browser.
Conclusion
To the commenter (Jun-chan) who gave me such a wonderful Oogiri prompt, thank you so much! Thanks to you, I am now able to enjoy an endless space journey within the browser.
'Ice,' 'Magma,' and now 'the edge of the universe'...
I wonder where the next impossible request will come from (I'm trembling with fear).
When you have some time, please turn on the audio and take a detour drive to the edge of the universe!
The site that goes the farthest in the world (VOYAGER)
[Previous] The hottest site in the world (MAGMA CORE)
いいなと思ったら応援しよう!
よろしければ応援お願いします! いただいたチップはプログラミングの開発費に使わせていただきます!学生なのでいただけるととても助けになります!