Habitat Heroes

Inspiration

Initially, all three problem statements were equally interesting to us - they were all about highly relevant and critical challenges, and we felt that it would be amazing if we could contribute to solving any of those.

However, we found Habitat for Humanity’s problem statement to be the most relatable, since most of us have had experience volunteering overseas and helping with similar projects, where we helped to build homes, communities, and hope. We were thus inspired by the extensive efforts of Habitat for Humanity in building homes for underprivileged communities worldwide. One could only imagine our dismay when we heard about how the pandemic affected these efforts and initiatives.

As such, we decided to work on this problem statement. Our team was motivated to come up with a solution to help Habitat for Humanity increase its outreach in educating the public about the lack of decent housing, thereby encouraging more donations and volunteering efforts. We decided to do so via a game, as we were inspired by the various games that we’ve played ourselves related to building that were able to draw us into playing the games for hours.

What it does

Habitat Heroes is a virtual house-building game that mirrors the experience of physical volunteering programmes. There are 6 main features that the game supports:

Simulate a virtual house building experience
Update players on news & latest events
Quiz players on housing issues
Provide daily quest challenges
Allow sharing of game experience on social media
Allow donations via purchasing in-game currency

Note: The current house building time and quiz reset time have been shortened for the purpose of allowing users to try out more features in the MVP.

How we built it

The frontend was built using Phaser 3 and Redux. The former is a powerful game framework that allowed us to get started quickly and focus on the key features, while the latter is a state management library that enabled us to manage and persist user data on the client-side smoothly.

The application was then built using Webpack and deployed using Firebase.

The assets that we used for our game were both sourced online and self-designed.

Challenges we ran into

There were two facets to the challenges we faced. The initial challenge was on coming up with a tech-enabled solution to the problem statement. The problem statement itself was rather nuanced and complex, so our team spent quite a bit of time brainstorming to arrive at something that tackled the various aspects of the given problem.

Subsequently, the second challenge we faced was a technical one. Our team, as a whole, was quite new to game development, and though we had an idea in mind, we spent quite some time figuring out what could or could not work. It took a while before our team finally got used to using the Phaser 3 framework and setting things into motion.

Accomplishments that we're proud of

We are proud to see our ideas come to fruition. The Habitat Heroes game ended up looking better than we expected and is also very immersive (to us, at least). Moreover, by playing the game, players get to learn more about the motivations of Habitat for Humanity through building houses, decorating their habitats, doing quests and quizzes, and more.

Although the game is played virtually online, we strove to achieve the same level of engagement and impact as that of physical volunteering events. We hope that players will feel a similar sense of pride and accomplishment seeing how their efforts can make a difference, be it in terms of spreading awareness about the lack of decent housing worldwide to their friends and families, or the concrete impact that their donations are making.

Our team is also proud to complete such a comprehensive MVP in a short span of time. The graphic assets were largely customised and curated. Furthermore, despite none of us having any experience developing a web game and using the game engine framework, we worked together to accomplish and build quite a variety of features in less than a week.

What we learned

This hackathon was an exciting journey where we applied our software engineering skills to solve real-world problems. We did extensive research on various aspects relating to Habitat for Humanity, such as its vision, targets, events, beneficiaries, and partner organisations, from which we learned to appreciate the meaning of this community and the efforts of the volunteers. Thus, this strongly motivated us to contribute our own strengths to this effort of building habitats for the less fortunate. In this journey, we built Habitat Heroes from scratch, like sowing a seed, planting a tree, raising a baby. It was very satisfying to see it grow from an empty page to a virtual world! Although some of us have had previous experiences in building games, we all have improved our programming and problem-solving skills. We have also grown together as a team, as we learned to work efficiently and effectively, bolster creative ideas and cultivate team spirit.

What's next for Habitat Heroes

Although our prototype is sufficiently well-developed to be deployed as an actual product, we still have plenty of features in mind to integrate into Habitat Heroes.

Firstly, we are planning to add multiplayer features so as to further increase user outreach. Secondly, we also intend to add mini-games to mirror the physical act of building houses to raise awareness of the laborious nature of constructing a house from scratch. Thirdly, we are planning to automatically update players on the impacts of their donations. Last but not least, we would also like to integrate additional functionalities such as volunteer registration, Firebase authentication, better advertisements, and mobile support.