Inspiration
Most of us will spend our entire lives managing money — yet nobody teaches us how. Less than 25% of US teens can answer basic personal finance questions, and only 22 states require a personal finance class in school. We built CoinWise because we believe that gap shouldn't exist. Every teen deserves to understand a budget, know what compound interest means for their future, and feel confident — not anxious — about money.
What it does
CoinWise is a free, no-sign-up web app with four core tools:
- Lesson Library — 6 bite-sized lessons covering budgeting, investing, credit scores, emergency funds, stocks & ETFs, and taxes. Each takes under 10 minutes and uses real-world examples.
- Adaptive Quiz Engine — 10 scenario-based questions (not just definitions) that show a full explanation after every answer, so you learn even when you get it wrong. Earn XP as you go.
- Budget Simulator — Pick an income preset (first job, part-time, or custom) and build a real monthly budget. Watch your 50/30/20 breakdown update live and get instant feedback when you overspend.
- Progress Dashboard — Track XP, day streak, topic mastery, weekly activity, and unlock achievement badges.
How we built it
We built CoinWise entirely with Next.js 14 (App Router + TypeScript), Tailwind CSS for styling, and Lucide React for icons. All lesson and quiz content lives in TypeScript data files — no database, no backend, no API keys needed. The app is deployed on Vercel and is fully offline-capable after the first load.
Challenges we ran into
The hardest part was the budget simulator's real-time state management. Every time a user adds or removes an expense, or switches income scenarios, the 50/30/20 breakdown, progress bars, remaining balance, and smart feedback tip all need to update instantly and stay in sync. Getting that to feel smooth and never stale required careful state design. We also spent significant time on the feedback system — making sure the green/yellow/red indicators felt encouraging rather than punishing, especially for students who are just starting to learn.
Accomplishments that we're proud of
- Built a genuinely useful financial education tool from scratch in a hackathon timeframe
- Designed an experience that requires zero sign-up and works in under 30 seconds from first load
- Created lesson content that is accurate, jargon-free, and actually applicable to a teenager's real life
- Made the quiz teach, not just test — every wrong answer is a learning moment
What we learned
Building CoinWise taught us how much thought goes into making something feel simple. The 50/30/20 rule is easy to explain in a sentence, but building a simulator that makes it intuitive took real iteration. We also learned that good financial education isn't about throwing facts at people — it's about connecting concepts to decisions they'll actually face.
What's next for CoinWise
- Add more lessons (negotiating salary, renting vs. buying, understanding student loans)
- Persistent progress saved with a lightweight account or local storage
- A "Financial Health Score" that grades your simulated budget and gives a personalized improvement plan
- Spanish language support to reach more students
Built With
- lucidereact
- nextjs
- tailwindcss
- typescript
- vercel
Log in or sign up for Devpost to join the conversation.