Inspiration
SaveSavvy was inspired by the financial literacy and education of high schoolers in the United States. Only 24% of millennials understand basic financial topics. Additionally, only 17 states mandate that high schoolers complete a course in personal finance. These alarming statistics inspired us to take action to develop a way for middle and high school students to practice and learn healthy financial practices, in a fun and engaging way! The skills the users develop through this simulation can be used in various aspects of their lives, when faced with similar situations.
What it does
In SaveSavvy, the user assumes the role of recent college graduate who must complete various financial decisions, manage their job, and pursue further education. The user must learn how to make wise budgeting decisions, such as how to account for their student debt and rent, as well as necessities, such as groceries and pleasure. SaveSavvy uses an interactive and aesthetic graphic to inspire users to make wise financial decisions, all while the users complete a fun game! Specifically, the user has to create a budget to account for: utilities, housing, necessities, unforeseen incidents, while they consider their current balance and the various bills they have to pay. When a user clicks the bank icon, they will be introduced to a place where they can invest, save money, and make withdrawals. In the bank, they can also learn about the current stock market, by looking at a regression model of the famous past stock price histories. Using this machine learning model, users can learn about cost benefit analysis, specifically to make smart stock decisions, and to avoid the dangers of the stock market. Through this multimedia simulation, users can participate in an engaging simulation, as well as learn about healthy financial decisions for their life!
How we built it
We built our SaveSavvy using HTML, CSS, JavaScript, Flask, Handlebars, Bootstrap, jquery, and scikit. Specifically, we made our main simulation functions using Javascript, Bootstrap, JQuery, and built the UI using CSS and Handlebars. For our machine learning model, we used flask and scikit.
Challenges we ran into
Implementing The machine learning aspects was really difficult. I first tried to build one from scratch but ran into the problem of exploding gradients, where my weights and biases got exponentially large and caused my loss function to go infinity.
Accomplishments that we're proud of
Creating different locations and making them interactive with css and js. Communicating with SQL databases to hold user and avatar information. Drawing out the background using pixel art while making it understandable and clear what each element represented.
What we learned
What's next for SaveSavvy: A Financial Practice Simulation
For SaveSavvy, we hope to create new avatar backgrounds for the users to play the simulation with. For example, a certain avatar might have certain financial constraints that others, so users can practice their budgeting skills in various scenarios, to prepare for real-life scenarios. We also hope to implement a time slider in our project. By creating a time slider, the user can progress through time and see if their budget can handle any unforeseen incidents. Additionally in our website, we would like to add a changing jobs feature for the users. By doing so, users can try to switch a job to earn a higher salary or get a more suitable position. Finally, we would like to offer a feature for the users to spend some money on certification or job skills in their local university or community college.
Sources
https://www.codingnepalweb.com/budget-tracker-html-css-javascript/
Log in or sign up for Devpost to join the conversation.