Skip to content

LestathRiveraD/EcoQuiz

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

51 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🌱 Eco Quiz - Climate Change-Maker Hackathon 2025

✨ Inspiration

For the 2025 version of the Climate Change-Maker Hackathon, our team aimed to create an engaging and educational experience to raise awareness about environmental issues. We were inspired by the need to teach people who just want to have fun about the impact of human actions on nature and how small changes can make a big difference. Gamification felt like the perfect approach to make learning fun, interactive, and impactful! 🎮🌍


🎯 What Does It Do?

Eco Quiz is a webpage featuring five interactive mini-games, each focusing on different environmental topics:

  • 🚗 Vehicles: A simulation of a 10 km car ride that showcases the environmental impact of the trip on a kilometer-by-kilometer basis.
  • 🗑️ Garbage: A recycling and waste management quiz with personalized tips to reduce pollution.
  • 🚿 Water: A game about responsible water usage during bath time.
  • 🌿 Plants: Highlights the ecological importance of plants and their role in the ecosystem.
  • 💡 Lightbulbs: Shows the impact of energy consumption based on your type and number of lightbulbs.

🛠️ How We Built It

We developed Eco Quiz using:

  • HTML - To structure the webpage.
  • CSS - For an appealing and user-friendly design.
  • JavaScript - To handle quiz functionality, user interactions, and score tracking.
  • Flask - For backend functionalities and hosting.
  • Git - For collaboration and version control.

🚧 Challenges We Faced

During development, we encountered a few obstacles, including:

  • 🏗️ Ensuring the quizzes worked correctly and provided dynamic feedback.
  • 🎨 Making the design visually appealing and intuitive.
  • 🐞 Debugging JavaScript functionalities.
  • 🌐 Learning how to host a Flask web application.
  • 📁 Figuring out the best file structure for our project.

🎉 Accomplishments

We're proud of:

✅ Successfully creating a functional and interactive webpage.
✅ Designing a visually appealing and easy-to-navigate UI.
✅ Implementing JavaScript and Flask to enhance user experience.
✅ Learning new coding techniques and improving teamwork.
✅ Deploying the website using Render. 🚀


📚 What We Learned

This project taught us:

  • 🔹 How to use JavaScript for interactive web elements.
  • 🔹 How to host a Flask web application with Render.
  • 🔹 How to collaborate effectively using Git and GitHub.
  • 🔹 The importance of environmental awareness and digital engagement.

🔮 What's Next?

Future improvements for Eco Quiz include:

  • 🎮 Adding more fun mini-games on diverse environmental topics.
  • ✨ Enhancing the design with animations and better UI elements.

📸 Screenshots

Eco Quiz Screenshot 1 Eco Quiz Screenshot 2 Eco Quiz Screenshot 3 Eco Quiz Screenshot 4


🚀 Play. Learn. Make a Change! 🌍