Front Page
Stat Dashboard
Game Page
Result Page
Trottier Grind

PromptDuels - Project Story

Inspiration

We made this project because, let’s be honest, AI is everywhere now. It is helping us write emails, plan meals, and sometimes even finish our homework at 3 a.m. Since talking to AI has basically become a life skill, prompt engineering is the new superpower everyone needs. So we thought, why not turn it into a game? That’s how PromptDuels was born: a chaotic, competitive showdown where players battle to see who can out-prompt everyone else. It’s fun, it’s fast, and it might just make you the best prompt wizard in your friend group.

What it does

PromptDuels is a real-time competitive game where two players face off by writing prompts that guide AI to generate web designs. Players receive a design challenge (like "Coffee Shop Landing Page" or "Personal Portfolio Site"), craft their best prompt, and watch as LLM generates a website based on their instructions. The AI automatically scores both submissions across five categories which are 5 of the most important criterias of creating a perfect mvp: visual design, adherence to requirements, creativity, prompt clarity, and prompt formulation. The game features real-time matchmaking, lobby systems with ready states, and live updates via WebSocket, making every match feel fast-paced and engaging.

How we built it

We built PromptDuels as a full-stack application with a clear separation of concerns. The backend uses Python with Flask and Flask-SocketIO for real-time communication, organized into a modular service architecture. We integrated Google's Gemini 2.5 Flash API for AI generation and scoring. The frontend is built with Next.js 15, React 19, and TypeScript, featuring a modern UI with Tailwind CSS, real-time WebSocket connections, and smooth animations using Framer Motion. The architecture supports matchmaking (automatic pairing), with comprehensive REST APIs and Socket.IO events for live updates throughout the game lifecycle.

Challenges we ran into

This project exposed us to various challenges related to Full Stack Development and AI integration into our application. Early into the project, we had trouble implementing a reliable matchmaking queue feature that accurately opened a game for two players in queue. Another significant challenge we faced was dealing with the max token limit on our Gemini agent. The API key was limited to 15 API calls a minute, so we could not make too many calls at once. This led us to limiting the matchmaking to only 2 users at a time, instead of a game lobby with many players.

Additionally, we also had trouble integrating the MongoDB database into our project. Along our project, we needed to store images into a persistent database so that it can be reused in later pages. However, MongoDB is not the best in storing databases, but we found a working implementation by converting images to binary.

Accomplishments that we're proud of

We're proud of building a fully functional real-time competitive game in a short timeframe, with zero breaking changes during our architecture refactor. The matchmaking system now works flawlessly with safe polling, and our modular service architecture makes the codebase maintainable and testable. We created a comprehensive test suite that verifies all services work correctly, and we built a beautiful, responsive frontend that provides real-time feedback throughout the game experience. The AI integration successfully generates and scores designs automatically, creating a seamless gameplay loop from prompt submission to winner declaration. Most importantly, we delivered a fun, engaging game that demonstrates the power of prompt engineering as a competitive skill.

What we learned

This project was a deep dive into the complexities of building a real-time, full-stack application. We learned how to effectively integrate a Python Flask backend with a Next.js frontend using WebSockets for live, bidirectional communication. We also gained critical experience in designing systems around the practical constraints of third-party APIs, adapting our game's architecture to manage Gemini's rate limits. Finally, we learned the importance of a modular service architecture for maintainability and how to creatively solve database challenges, like storing binary image data in MongoDB.

What's next for PromptDuels

We want to refine the grading system to looks at the dynamic website instead of comparing the static image of the website. In addition, we want to host the PromptDuels online so that players around the world can match against each other and refine their prompting skills.

Github Link: https://github.com/Tsha0/PromptDuels