Know about space

Here is a "Project Story" tailored for a hackathon submission page (like Devpost), highlighting the features found in your code. Inspiration Space exploration is fascinating, but data is often scattered across different websites or hidden in static galleries. We wanted to build a "Mission Control" that wasn't just for viewing images, but for interacting with them. We aimed to turn passive observation into active learning through gamification and accessibility. What it does "Know About Space" is an all-in-one exploration hub. It pulls the "Astronomy Picture of the Day" and raw Mars Rover photos directly from NASA APIs. Beyond imagery, it aggregates real-time space industry news (filtered for missions, satellites, and Mars). What makes it unique is the "Gamified Discovery" engine. Users can play a sliding tile puzzle generated instantly from the daily image or test their knowledge in a "Guess the Image" quiz. We also prioritized accessibility with a Text-to-Speech feature that reads scientific explanations aloud. How we built it We built the app using HTML5, CSS3, and Vanilla JavaScript.

• Design: We created a custom CSS engine with glassmorphism effects and a dynamic background that animates a "Starry Sky" or "Solar Flare" depending on the user's chosen theme (Light/Dark mode).
• Data: We integrated three distinct APIs: NASA APOD, NASA Mars Rover, and NewsAPI.org.
• Logic: We wrote custom algorithms for the 4x4 sliding puzzle game (using Fisher-Yates shuffle) to ensure every game is unique but solvable. Challenges we ran into Handling multiple asynchronous API calls while maintaining a smooth UI was tricky. Specifically, ensuring the puzzle game logic correctly sliced and randomized the high-resolution images from the NASA API required precise DOM manipulation. Accomplishments that we're proud of We are proud of the Theme System. With one click, the entire app shifts from a deep space aesthetic (dark mode with stars) to a bright solar theme, changing gradients, text shadows, and animations instantly. We're also proud of making space accessible to auditory learners via the integrated voice engine. What's next for Know About Space We plan to add a 3D solar system visualization and user accounts to save puzzle high scores.

Built With

• css3
• flatpickr
• html5
• javascript
• mars-rovrer-api
• nasa-api
• newsapi
• newsapi.org