Gamifying is a very good way to increase the efficiency of any campaign by making it fun and competitive.
Gamer4Good's first application was recycling in a university campus, and the campaign was named Go4TheGreen. This first pilot proved that gamifying does indeed increase the efficiency of recycling and energy saving.
The target audience of this first implementation was students on the campus, so mobile was the main focus. The web application created was mobile first, and the target was to make it as responsive as a native app, so Angular2 with animated interactions was the solution chosen. This also opened up the opportunity to later build native mobile apps on the same APIs that the web application used.
Gamer4Good allows its users to compete in multiple competitions in teams (fraternities, dormitory floors etc.) and earn points by adding recycling actions, doing reading articles, spreading the word or by scavenging actions.
Beside points in the competition, uses also received G$ rewards which they could use on the shop to buy prizes offered by sponsors or choose to donate to one of the selected charities. The shop was built on Magento and featured full connection with the web app, including single sign-on and G$ balance synchronisation.
The first game was a big success, with great user engagement, and the next step is to expand this gamification to other industries.
Beside the very responsive Angular 2 implementation, one of the fun things in this project was dynamically drawing the game board with SVGs and animations. We used Raphaël JS for this and the result was a super flexible and beautifully animated board.