MoneyVille | Devpost

💡

Inspiration

Only 31 percent of women considered themselves to be financially knowledgeable according to a Statistics Canada Survey. Women of all ages and backgrounds struggle with the pressure to earn enough, access education, care for a family and plan retirement. We want to become part of empowering young girls to learn financial education to sets them on the path to future financial independence. MoneyVille gives girls the skills to make their own wise purchasing, saving and investing decisions, as well as donating to feel a greater sense of community involvement.

🔎

What it does

MoneyVille is a gamified web app that allows girls aged 7-14 to learn to make wise financial decisions. The website takes the form of a location roadmap that allows the user to explore places like the bank, donation centre, stadium, and more. Each individual location offers unique learning and experience, where the stadium allows you to work towards ‘quests’ which are things you want to invest towards and it shows your progress. The bank allows you to visualize your spending habits and make transactions of either earning or spending money, where you’ll also be able to see your transaction history. The donation centre is a unique feature of the app that allows the user to select which items they would like to donate and offers locations nearby with donation centres accordingly. The user can earn stars from their donations, which can save up to provide exciting rewards like free admission to attractions and food items. Another feature is that parents can switch to their side of the app to visualize their child’s progress, as well as add chores or tasks.

🔨

How we built it

We utilized Figma and Canva for graphic design and building high-fidelity wireframes, where we also built almost all the art and graphics on our own. The application was designed with our target audience of young girls in mind, where we ensured the interface was as user-friendly as possible. We used JavaScript, HTML and CSS** to build the website and stylize it, and Google Maps API** to make the map on the ‘donation centre’ page using the Google Cloud Platform.

🥇

Challenges we ran into

We ran into many challenges as this web application had many intricate parts that operate dynamically. One of the challenges is making JavaScript functions that overlaid the changes in the account balance across all interfaces based on the changes in the bank page, main page, etc..

⚠️

Accomplishments that we're proud of

We are proud of making a useful website for young girls to develop their knowledge and skills and become better positioned for future success. We are also proud of how seamless our user-interface looks and the attention to detail of the animation and the color scheme used which brought our project together.

🧠

What we learned

We learned the importance of financial literacy education, especially when starting a young age. We also learned useful technical tools like how to use the google maps API, and some new JavaScript functions, as well as how to create our own art for the application.

💭

What's next for MoneyVille

We would like to further extend on MoneyVille by creating more donation features in the donation centre and applying our application to more locations. We would also like to add social features like connecting with your friends to see their progress, as well as sending them gifts to encourage each other.