Inspiration
College students are expected to understand financial literacy, yet most are never formally taught. Traditional finance apps assume prior knowledge, which can be overwhelming and easy to abandon.
PennyPlanner was inspired by Duolingo and designed for the Game Design track. We treat financial education like a game: users complete quests, earn XP, maintain streaks, and unlock rewards. Saving money becomes a challenge, and learning financial concepts feels like leveling up.
To align with Capital One: The Best Financial Hack challenge, PennyPlanner helps users build real-world financial habits early. Students can connect their bank accounts via the Capital One Nessie API, track real spending insights, and earn tangible rewards like gift cards or small banking incentives such as a 0.01% higher APR. Progress is tied directly to actual financial behavior, making smart money decisions immediately rewarding.
What We Learned
Game Design and Motivation
From a game design perspective, we learned that progression systems dramatically increase engagement. XP, streaks, leaderboards, and unlockable rewards give users constant feedback and motivation. These mechanics transform financial literacy into an experience users want to return to daily.
AI as a Friendly Financial Coach
For the Best Use of Gemini API challenge, we explored how AI can act as a judgment free guide. Many students are uncomfortable asking basic money questions. Using Google Gemini, Penny provides personalized, encouraging financial advice that feels conversational rather than instructional.
Turning Math Into Gameplay
Financial concepts stick best when they are applied interactively. Instead of passive reading, users answer a wide variety of quiz questions that apply real formulas and real world scenarios.
One example is learning simple interest through the formula:
$$ I = P \times r \times t $$
Where:
- I is the interest earned
- P is the principal
- r is the annual interest rate
- t is time in years
This is just one example of the many different types of questions PennyPlanner asks, ranging from budgeting and saving to credit, loans, and long term investing concepts.
How We Built It
PennyPlanner is a full stack web application designed to support game mechanics, personalization, and scalability.
Frontend
- React with Vite for fast iteration and smooth UI interactions
- Zustand for lightweight global state management across quests, XP, streaks, and rewards
Backend
- Express.js server acting as the core game engine
- Handles XP calculation, progression rules, rewards, quizzes, goals, and user data
Database and Persistence
- MongoDB Atlas powers all user state, including progress, quests, streaks, and rewards
- Designed to support scalable progression trees and fast reads for real time feedback
- This architecture was built specifically for the Best Use of MongoDB Atlas challenge
Bank Integration via Nessie API
- Users connect their real bank accounts through the Capital One Nessie API
- Transaction data drives Active Quests, Dashboard insights, and personalized rewards
- Real spending habits influence XP, streaks, and progression in real time
AI Integration
- Ask Penny and daily tips are powered by Google Gemini
- Prompts are structured to be beginner friendly, context aware, and encouraging
- Learning paths adapt based on user progress and behavior, highlighting our Best Use of Gemini API implementation
Challenges Faced
Designing Financial Game Mechanics
Balancing education and fun was one of our biggest challenges. We had to ensure that quests were engaging without oversimplifying important financial concepts.
AI Latency and Responsiveness
Early versions of AI generated tips introduced noticeable delays. We refined prompt structure and backend handling to ensure Penny responds quickly and feels responsive.
Persistent Progress Across Sessions
Maintaining XP, streaks, rewards, and goals across refreshes and devices required careful authentication handling and reliable persistence using MongoDB Atlas.
Closing
PennyPlanner combines game design, financial technology, and AI to make learning about money approachable, motivating, and rewarding. Built for students, powered by Gemini, backed by MongoDB Atlas, and integrated with the Capital One Nessie API, PennyPlanner turns financial literacy into a game worth playing while tying progress to real-world financial behavior.
Built With
- bcryptjs
- express.js
- google-gemini-api
- helmet.js
- jwt
- lucide-react
- mongodb-atlas
- mongoose
- node.js
- react-19
- recharts
- tailwind-css
- vite
- zustand
Log in or sign up for Devpost to join the conversation.