Planet Finder

• 

  Main Screen

• 

  Information about Planet Screen

Inspiration

Space has always fascinated us — yet for most people, the solar system feels distant and abstract. We wanted to make exploring it interactive, visual, and fun, allowing anyone to learn about planets in a way that feels natural and intuitive. Existing space education tools are often cluttered, outdated, or text-heavy. That’s why we created Planet Finder — a clean, modern, and data-driven way to discover the wonders of our cosmic neighborhood.

What it does

Planet Finder allows users to explore detailed information about every planet in our solar system. Each planet includes key stats like diameter, distance from the Sun, number of moons, temperature, orbital period, and more. Users can:

Instantly search for any planet.

Filter planets by type (Terrestrial, Gas Giant, Ice Giant, or Dwarf Planet).

Adjust sliders for diameter and distance ranges to narrow results.

Open interactive cards to view in-depth planetary data with a sleek modal view.

The result is an elegant, educational platform that makes astronomy more engaging and accessible.

How we built it

Our project was built using HTML, CSS, and JavaScript, with Tailwind CSS providing the responsive and modern UI design. Planet data was collected and organized from NASA’s Planetary Fact Sheets and structured into a dynamic database for quick retrieval and filtering. We focused on user experience — implementing smooth animations, clean typography, and a dark space-themed aesthetic. The entire project is hosted on Replit, allowing instant access through any web browser.

Challenges we ran into

We initially struggled to design an efficient filter system that could handle multiple conditions (like planet type, distance, and diameter) at once. Styling the responsive modals to fit all devices was another challenge, as was ensuring the interface remained fast despite the data-rich layout. We also spent time debugging overlapping modal layers and ensuring animations didn’t cause performance drops.

Accomplishments that we're proud of

We’re proud to have built a fully functional, data-driven web app with a polished design and smooth user experience. The filter and modal systems work seamlessly, and the layout adjusts perfectly across devices. We’re especially proud of how clean, educational, and professional the final design looks — it feels like something NASA itself could showcase.

What we learned

We learned how to organize structured scientific data and present it in a visually intuitive way. We also improved our skills in frontend interactivity, responsive UI design, and user-centered development. This project helped us appreciate the balance between aesthetics and performance, and how thoughtful design can make learning more engaging.

What's next for Planet Finder

In the future, we plan to expand Planet Finder beyond our solar system by integrating NASA’s Exoplanet Archive API. We also want to add 3D visualizations of orbits, AI-generated summaries for each planet, and real-time space mission data. Ultimately, our goal is to transform Planet Finder into an interactive space exploration hub — a gateway to the universe for learners everywhere.

Built With

• css
• html
• javascript
• react
• tailwind
• typescript