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! 🎮🌍
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.
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.
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.
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. 🚀
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.
Future improvements for Eco Quiz include:
- 🎮 Adding more fun mini-games on diverse environmental topics.
- ✨ Enhancing the design with animations and better UI elements.
🚀 Play. Learn. Make a Change! 🌍