Deep Impact: The Past, Present, and Future of Cosmic Impacts
Cinema 4D
After Effects
Lay audience
The goal of this project was to create a data visualization displaying complex scientific subject matter.
Cosmic impacts are a perennial source of fascination for humanity, and maintains a large presence in conversations about the present and future of the planet. I created this project to explore the data we have on the phenomenon; to create accurate visualizations of cosmic scale; and to provide an overview of what would happen should a strike occur.
My personal goal with this work was to create a "capstone project", by integrating as many techniques as I could that I had learned during the semester. As a result, I worked with JavaScript and Observable to create interactive maps; Cinema 4D and After Effects to create 3D videos; and Photoshop/Illustrator to build layouts and vector illustrations. Everything was coded and put together on Webflow.
The final work is a website; however, it is designed to be a museum experience. Please note that it is best viewed on Google Chrome at 1920x1080 resolution; the video above provides an accurate representation of its design.
I began this project as a novice to the vast majority of the programs I needed to complete it, and came to understand—as I learned more about the tools available to me—that there were ways to significantly simplify my workflow. Key takeaways included:

1. Ideation

When presented with the premise for this project, I became interested in presenting a visualization of data currently made available by the Centre for Near-Earth Studies (CNEOS) and the Jet Propulsion Laboratory (JPL) about cosmic collisions, which is highly-detailed and fairly comprehensive. During my initial research, I discovered the Earth Impact Database, which records historical evidence of ancient impacts, which shaped the scope of my project to include not only current impact statistics, but the past and future as well.

2. Research

After selecting the topic, I collated what data was available and used Tableau to clean and compare it, creating rough, preliminary visualizations to understand what information I had to work with. At this point, I began to make decisions about the specific content I would cover: how detailed did I want to get with my visualizations? How could I consolidate a number of very different datasets into a coherent whole? At this point I made note of any data limitations and located backup data sources to validate the information I had.

3. Choosing the right tools

Once the data was selected and finalized, development began. The goal of the project was to have a fully interactive final product, and so a solution was needed that could incorporate all the aspects required: tooltips; mapping data; timeline scrubbing; incorporation of 3D models. Since I was working with a limited coding background, it was necessary to find a tool that was both robust in functionality and easy to learn from existing resources. After experimenting with a variety of options, I decided to code my interactive maps on Observable, which was designed for information sharing and open-source problem-solving; and to host my final website on Webflow, which offered a high level of control over both the setup and interactivity of the visuals.

3. Design and translation

A preliminary wireframe of the website was designed in Adobe Illustrator, with placeholder text and graphics. Finalized assets and text replaced placeholders as they were completed to validate the design at each stage, and the design shifted as I learned that certain representations were more successful than others. A cut animation is shown below, depicting the scale of asteroids; it was replaced by a more simplified, graphical depiction (right, 4th image).
The 2D art and graphics, as well as the 3D models/animations, were planned out and worked on concurrently. Vector art was completed on Illustrator; graphs were built using Tableau and styled in Illustrator; and 3D art was sculpted in ZBrush and animated in Cinema 4D. Rotating globes were built using 3D tools in After Effects, and images from NASA Visible Earth.

4. Development & Troubleshooting

Once designs were finalized, I began to migrate assets to Webflow. Some elements, like the interactive maps created in Observable, required additional coding, and needed to be styled to match the design. Tooltips and micro-interactions were coded manually, and I encountered difficulty in making the website responsive to different devices and browser sizes. In the end, the visualization was optimized for Google Chrome on desktop to keep the scope of the project feasible with the time given.