What Inspired Me
The inspiration for Bets Buddies came from a real moment of frustration and opportunity. I was at a friend's bachelor party weekend a couple of weeks ago in June, and we were having a blast with some improvised trivia rounds. Everyone was engaged, laughing, and trying to outsmart each other with their guesses. But we kept running into the same problems: it was hard to keep track of scores, we were limited to one-off questions, and most importantly, we couldn't get everyone in the room involved in a structured way.
My friend Ben mentioned missing a trivia/betting game he'd played before, one where you not only guess answers but also bet on who you think got closest. That's when it hit me: this was the perfect use case for building a quick web app with Bolt, and a potential new entry for the hackathon. Why couldn't we have a real-time, multiplayer version that everyone could join with their phones? The idea of combining trivia knowledge with social betting strategy seemed like it could create those magical party moments where everyone's engaged and invested.
What I Learned
The projects for this hackathon have been my first time using Bolt and Supabase. This project is also the first time I’ve tried making an online multiplayer game, which relied heavily on Supabase Real-time features. Using Bolt, I discovered how quickly you can go from concept to functional multiplayer game. Within hours of that initial conversation, I had a working version that our group could actually play.
I also learned about the nuances of real-time multiplayer game design. Balancing fairness, engagement, and simplicity required constant iteration. The betting mechanics needed to be strategic enough to be interesting but simple enough that anyone could jump in after a quick explanation. I also discovered some of the technical limitations of trying to connect multiple separate browsers to an app running in Bolt. Fortunately, the feature in bolt for synching with GitHub worked flawlessly, and I was able to iterate quickly with an instance of the app running locally on my machine.
After getting the game fully functioning and refining some of the animations and state transitions, I was about to call the game finished and move on. However, through my play testing with different groups, I realized a key element to making the game particularly fun for a given group was that I had created customized trivia questions for that group. Deep research queries in both ChatGPT and Gemini had proven effective for getting some good, fact-based trivia questions. Why not open up that kind of experience for everyone who would be using Bets Buddies? So at the last minute I decided to tack on a major new feature: custom deck management. I had a clear vision for how I wanted this to work with authenticated users able to create and manage custom decks with a sharing model similar to Google Docs. And this turned out to be an excellent fit for the capabilities of Bolt and Supabase. I used some discussion queries to help me analyze the current code-base and craft a suitable set of prompts for the enhancements, and these turned out to work amazingly well, requiring minimal intervention from me. I was able to add on this major new feature in a matter of hours, including the time to iterate in Bolt and test the complex new features for authentication, deck CRUD operations, and my deck visibility rules.
How I Built It
Core Technology Stack:
- Frontend: React 18 with TypeScript for type safety and modern component patterns
- Real-time Backend: Supabase providing PostgreSQL database, authentication, and real-time subscriptions
- UI/UX: Tailwind CSS for rapid styling and Framer Motion for engaging animations
- Deployment: Netlify for seamless CI/CD and global distribution
Development Approach:
- Rapid Prototyping: Started with Bolt to quickly establish the core game loop - join game, answer questions, place bets, see results
- Real-time Architecture: Implemented live game state synchronization so all players see updates instantly
- Mobile-First Design: Ensured the game worked flawlessly on phones since that's how people naturally play at parties
- Content Creation: Used AI tools (ChatGPT and Gemini) to generate themed question decks for our specific group
Advanced Features:
- Built a complete deck management system for creating custom trivia sets
- Implemented three visibility levels: private, link-only sharing, and public
- Framework for AI-powered question generation for custom topics. Note that the AI-generation feature is currently mocked to avoid potential costs to me while offering the app for free.
- Created import/export functionality for question sets
Challenges I Faced
Real-time State Management: Coordinating game state across multiple players proved tricky. I had to carefully design the database schema and real-time subscriptions to handle scenarios like players joining mid-game, network disconnections, and simultaneous betting actions.
Content Scalability: Initially, I manually curated question decks, but this didn't scale. Building the deck management system required careful consideration of user permissions, content moderation, and sharing mechanisms.
Social Features: Creating the right social dynamics required understanding that the game needed to work for both close friends who know each other's knowledge areas and mixed groups with strangers. Features like avatar selection and visible betting created the social engagement that makes the game special.
Multiplayer Testing: Testing the multiplayer dynamics with multiple real-time subscriptions and frequent state updates required using an instance of the app running outside of Bolt. The integrations with GitHub and Netlify proved critical in efficient testing workflows.
The end result is a game that captures the spontaneous fun of that bachelor party trivia session but scales it to work for any group, anywhere, with a library of questions that keeps growing through community contributions and AI generation.
Built With
- netlify
- postgresql
- react
- real-time
- supabase
- tailwind
- typescript
Log in or sign up for Devpost to join the conversation.