Cosmic Time Machine is an interactive web experience that lets users travel through the history and future of the universe simply by scrolling.
Used ChatGPT for debugging.
Through this project, I learnt that refining small details like scroll behavior, and animations can significantly elevate the overall feel of a project, even if the core idea stays simple. I also realized that implementing visually complex features, like the Saturn rings, often requires more planning and patience than expected. Most importantly, I learned that debugging is not just a frustrating obstacle but a major part of projects, it forced me to read my code more carefully. Overall, this project taught me to manage my time better and appreciate the progress.
Fixed a few bugs that I didn’t notice before. Specifically, a plant bugging and debugged it. Also fixed the scrollbar as it wasn’t mentioning to what point the user was scrolling.
Log in to leave a comment
I refined the overall user experience by customizing the scrollbar to better match the site’s aesthetic, adding subtle sound effects to create a more immersive atmosphere, and enhancing animations so interactions felt smoother and more intentional. However, I ran into persistent challenges while trying to implement the Saturn rings feature, it was more complex than expected and took several attempts to get even partially right. I also tried to expand the project with additional features, but this introduced a series of bugs that were difficult to trace. As a result, a significant portion of my time ended up being spent debugging rather than building, which, while frustrating, ultimately helped me understand the codebase more deeply and improve my problem solving process. Also added a slider at the bottom to go through the whole process smoothly, and at the side just different steps.
Log in to leave a comment
While building the prototypes for Cosmic Time Machine, I learned how challenging it is to turn something as massive as the universe into an interactive experience. Experimenting with Three.js helped me understand how to render and animate objects in 3D space, from simulating the expansion of the Big Bang to creating simple orbital motion in the Solar System.
I also learned the value of prototyping. Instead of trying to perfect everything at once, building small versions of each idea helped me test how the experience should flow. Each prototype brought the project a little closer to feeling like a real journey through time.
n the second prototype, I expanded the experience by introducing two major visual elements: a Big Bang animation and an interactive solar system view.
The prototype now begins with a brief visual sequence representing the early expansion of the universe after the Big Bang. Particles rapidly spread outward, forming the foundation for the cosmic environment that follows.
I also added a simplified solar system scene where users can view planetary orbits around the Sun. This establishes how the project transitions from large cosmic scales to more familiar astronomical systems within the Solar System.
Log in to leave a comment
I created the first prototype of the Cosmic Time Machine interface, focusing on how users will navigate through time.
The interface is centered around a vertical timeline that allows users to scroll across billions of years in the universe’s history. As the user moves along the timeline, the background sky changes to represent different cosmic eras from the early formation of stars to the distant future of the universe.
The prototype establishes the basic layout, including the timeline navigation, space visualization area, and placeholders for educational cosmic facts that will later appear as interactive constellations.
Log in to leave a comment