The Power of Investing Early – My Project Story
Inspiration
As young people, we’re constantly told to “start saving early,” but very few tools help us visualize why that advice is so important. We were inspired to create an interactive financial literacy simulator that makes the concept of compound interest tangible—especially for kids and teens. By connecting things like starting investment, interest rate, and years invested to a graph, we hoped to show how small decisions made early in life can lead to massive results later on.
How We Built It
We used React to build the front-end interface and SVG graphics to dynamically render a graph showing the exponential growth of an investment. Here's a breakdown of our stack:
- React for interactive UI and state handling
- Vanilla JavaScript math for calculating compound interest
- SVG for custom graph rendering without relying on external chart libraries
- CSS for styling and layout
- Markdown-based educational content to teach users how compound interest works and why it matters
The user can input their own parameters—starting investment, interest rate, years invested, and compounding frequency—and watch the graph update in real time. We also included a separate educational page to explain the concepts in a fun format with emoji-enhanced tips and visual callouts.
What We Learned
- How to create dynamic SVG graphs in React
- How to simplify financial concepts into user-friendly, interactive content
- The importance of clean UI/UX in making educational tools approachable
- That financial literacy doesn’t have to be boring—with the right tools, it can be visual, interactive, and even fun!
Challenges We Faced
- Styling and layout glitches: Making the simulator both functional and beautiful took many iterations. Balancing readability with interactivity for the app was a challenge.
- Math accuracy and graph scaling: Getting the compound interest formula to behave as expected across different values (especially edge cases) required extra planning and work
Final Thoughts
We’re proud of building a tool that doesn’t just tell people why to invest early—it shows them. My hope is that this simulator becomes a spark for teens to start learning about money and make decisions that their future selves will thank them for.
Built With
- html/css
- react
Log in or sign up for Devpost to join the conversation.