Inspiration

Soha and I (Muhammad) have been friends since high school. Back then our Grade 11/12 board exams were as intense as the SATs, so we tried every productivity hack under the sun that could help us ace our exams. One of these hacks was having accountability partners, but it didn’t quite work out, and we ended up scrapping the idea. Fast forward two years, and today, we've come up with Commit Coin.

What it does

Commit Coin is a gamified productivity web app with a fun twist, in it users (friends) need to "commit" to a certain goal/task that they will complete within a deadline. When a task is added the user gets a hot plate thrown into their hands by the GameMaster, the longer they take to finish their task, the more money they lose to their friend! Yes, that's right we have implemented a monetary incentive into the app. This creates a fun yet thrilling experience for friends who want to keep their grades up while making some money on the side earned through their friends ;) (don't let them). Similarly, the your friend also has the same stakes set.

How we built it

We used React and Vite for our frontend and using Flask (python) was the obvious choice for such rapid prototyping situations. Setting up a server and virtual environment for testing. We used API routing and Axios to connect the front and backend. Unfortunately due to time constraints, we could not complete our project but we wanted to at least have a demo version ready to give everyone an idea of the app and its vibe.

Challenges we ran into

Building Commit Coin came with its fair share of hurdles. Especially since it was my first time doing full-stack development. Setting up the frontend and backend connection was tricky at first, especially when serving static assets like music files through Flask. We also ran into issues with properly structuring our React components, such as positioning avatars correctly and ensuring each user had their own taskbar.

Another major challenge was unexpected component rendering issues, like the CommitArea page appearing below other pages despite the URL pointing elsewhere. Debugging React Router and ensuring components were properly nested took time to fix.

Additionally, integrating payment handling for the "hot plate" feature was a learning curve, as we explored different payment gateways and their costs. These challenges helped us refine our skills and ultimately shape Commit Coin into a functional, engaging platform.

Accomplishments that we're proud of

Being new to full-stack development, we’re proud of how much this project has pushed us to learn and grow. From setting up a Flask backend to building a React frontend, we tackled real-world challenges that strengthened our problem-solving skills.

We successfully implemented dynamic task management, and even overcame tricky routing issues. One of our biggest wins was coming up with the "hot plate" mechanic, which adds a unique gamified twist to productivity.

What's next for Commit Coin

Commit Coin is just getting started! Our next steps include completing the code for the backend databases, finish our design vision for Commit Area and refine the user experience, adding more gamification elements, and improving the "hot plate" feature to make it even more interactive.

We also want to integrate a secure payment system so users can deposit and withdraw funds seamlessly. Expanding the app’s functionality with leaderboards, streaks, and social features could make productivity even more competitive and fun.

In the long run, we envision Commit Coin becoming a go-to tool for university students, helping them stay accountable while making productivity feel like a game. We’re excited to keep building, testing, and improving—this is just the beginning!

Share this project:

Updates