Inspiration

Most financial literacy tools either feel like a textbook or a trading app or even a youtube video — and neither teaches the hard part: behavior. People don’t fail investing because they can’t read a definition; they fail because they haven't practiced without real world money. We built Alt F4 Invest to make financial literacy feel like a game you can practice: short lessons, immediate feedback, and realistic simulations that mimic the stock market. We also leaned into the hackathon themes: Learning Tools + Financial Literacy as the core, plus Automation for auto-tracking progress and behaviors and Overengineering with extremely polished UI, and modular architecture to make it feel like a real product.

What it does

Alt F4 Invest is a investing learning platform that combines micro-learning + simulation. We setup:

  • Account + Profile (Supabase Auth): Email login, username, and investor-style stats (discipline, risk, patience).
  • Home Dashboard: Level/XP, streaks, and quick actions (Learn / Simulate / Build Portfolio).
  • Learning area: One concept per card, one question, instant feedback, XP rewards, and progress saved for both actual questions and stock chart questions.
  • Simulation Engine: Year-by-year market simulation with real stocks, events and user actions (buy/hold/sell/rebalance) to track outcomes over time.
  • Automation Layer (behavior tracking): The platform automatically measures how users behave during simulations and converts that into: personalized feedback, unlocks/rewards, missions and streak milestones, and a level system.

How we built it

Frontend:

  • Built a custom overengineered UI with smooth navigation, modular components, and a clean fintech-inspired layout.
  • Designed the dashboard as the core “hub” so the app is easy to use during a demo and intuitive for users. Backend (Supabase):
  • Used Supabase Auth for sign-in and user profiles and setup.
  • Structured user progress data to support XP/levels, streaks, lesson completion, and simulation history. Built with a scalable mindset:
  • Reusable components, clear feature modules, and data that can power future features like weekly reports. Collaboration:
  • Worked in Git/GitHub with a clean branch workflow and used LazyGit to move fast with commits during the hackathon.

Challenges we ran into

We ran into a lot of challenges in designing the UI:

  • Balancing polish vs functionality: We wanted an overengineered, premium UI however it was extremely hard to get it working the way we wanted.
  • We ran into issues setting up s=Supabase keys and having profile data saved, so levels and xp would not work until fixing this challenge.
  • Team setup and syncing: Getting environments aligned (Supabase keys, local setup, GitHub setup) took a long time at the beginning as we were new to Supabase and its platform, once we got it setup we began work on the project.

Accomplishments that we're proud of

We are proud of a lot, as only a team of 2 people working a lot of hours we came up with a clean, product concept that merges financial literacy, learning and simulation. We created a custom-designed UI that looks like a real fintech product, and we had a working foundation for auth, profiles, and saved progress, levels, xp, the simulation game, etc.

What we learned

We gained a lot more experience working with next.js, Supabase, GitHub during this project and also working in a team to complete our hackathon, we had to maximize efficiency as well because of working in only a team of 2. We learned how to setup Supabase, use lazy git, learn more with react, typescript, CSS etc. We faced multiple bugs and problems along the way further strengthening our problem solving skills.

What's next for Alt F4 Invest

We believe that Alt F4 Invest can actually become a full fledged app in the future, we are going to continue working on it as our own personal project to see what we can accomplish. We fully believe there to be a future in our idea.

To go into more detail we will start adding things like a fully implemented simulation engine, more automation builde, a lot more stock options and expanding our already built options like, portofilo, strategies and the profile. Maybe even creating 3D avatar customization options for the user.

Built With

  • git-+-github-(collaboration)
  • lazygit
  • next.js-(react)
  • node.js/npm
  • supabase-(auth-+-postgres-database)
  • tailwind-css
  • typescript
  • visual-studio
Share this project:

Updates

Submission history