Penny - Your Financial Pet

Inspiration

Managing finances is boring, stressful, and often confusing, especially for Gen Z. We wanted to make money management fun, adorable, and interactive. Inspired by Tamagotchi, Neopets, and Pou, Penny gives your finances a heartbeat and turns financial self-care into a game.

What it does

Penny is a virtual pixel pet whose health depends on your financial decisions. Feed her your income, track spending, and watch her grow stronger when you save, or get sad when you overspend. She makes budgeting engaging and visually rewarding, turning your money into a cute companion you actually care about.

How we built it

We used a Node.js backend to securely call the Gemini API for AI-powered financial analysis, and a front-end built with HTML, CSS, and vanilla JS. The UI is styled with pixel art vibes, pastel colors, and retro Tamagotchi-inspired fonts. The pet’s state updates dynamically based on AI-analyzed user input, giving a playful, interactive experience.

Challenges we ran into

  • Securely handling API keys: We needed to hide secrets while allowing the front-end to access analysis results.
  • Parsing AI output: Gemini sometimes returns unpredictable JSON, so we had to normalize and validate responses.
  • Pixel-perfect styling: Translating a Tamagotchi vibe to responsive web design took extra tweaking.
  • CORS & local development: Connecting the front-end and Node server while testing locally required multiple adjustments.

Accomplishments that we're proud of

  • Creating a fully interactive AI-powered pet that visually responds to financial data.
  • Achieving a cute, pixel-art retro aesthetic with a modern UI.
  • Making financial wellness feel rewarding, playful, and gamified.
  • Handling AI output edge cases gracefully so the app never breaks on invalid responses.

What we learned

  • How to safely connect a front-end to a Node server with environment variables.
  • Techniques for parsing and normalizing AI JSON output.
  • Pixel-art styling tricks for web interfaces.
  • How to gamify a traditionally boring experience to improve user engagement.

What's next for Penny - Your Financial Pet

  • Add more animations and pet interactions based on spending habits.
  • Introduce achievements, mini-games, or unlockables tied to savings goals.
  • Expand the AI to offer personalized financial tips and fun commentary.
  • Deploy to Vercel or similar platforms for easy public access.

Built With

Share this project:

Updates