Inspiration
We drew inspiration from classic social games we enjoyed as kids, aiming to recreate those fun, interactive experiences in a modern, optimized multiplayer setting. By leveraging OpenAI's API and image generation, we’ve added a creative twist to evoke the same joyful memories with a fresh, high-tech flair. Additionally all of our team members enjoyed playing jackbox games, which also influenced and inspired us for this project.
What it does
Our project is a live-service multiplayer game where up to 8 players can enjoy an exciting game of Reverse Pictionary Murder Mystery. One player, the outlaw, describes the crime they've committed and provides details of their appearance. This information is then passed to OpenAI’s DALL-E API to generate a visual representation of the crime scene. The image is shown to a witness (another player), who describes it to forensic artists (the remaining players), who then attempt to sketch what was described. At the end, the forensic artists’ drawings are revealed, and a democratic vote determines which sketch best represents the outlaw, crowning the winner.
How we built it
Our front end was developed using React and Tailwind CSS for a clean, intuitive user interface. For efficient routing, we integrated Next.js, which allowed us to render both static and dynamic components on the same page.
The backend consists of two services. The first is a Flask API that uses DALL-E 3 to generate images based on the outlaw’s description. The second is a WebSocket service that tracks player states and manages real-time communication, ensuring that different roles receive tailored content while playing in the same game session.
Challenges we ran into
Implementing the live multiplayer aspect proved to be a major challenge. We needed to ensure that players saw unique content depending on their role, requiring the use of WebSockets to track and manage user states. This allowed us to dynamically display the appropriate content to different players based on their objectives. We also faced challenges in animating the front end with React and CSS to enhance the user experience.
Accomplishments that we're proud of
Our greatest achievement was successfully implementing the live multiplayer functionality with WebSockets, despite having no prior experience with it. We were also proud of integrating OpenAI’s DALL-E API and seeing it function smoothly within our game. Additionally, we’re quite proud of our front-end animations and the overall visual polish of the game.
What we learned
We gained valuable experience in backend networking, particularly with network hosting and WebSockets, which enabled us to create a stable, live multiplayer environment. Working with OpenAI’s API was also new territory for us, but we managed to integrate it seamlessly. Most importantly, we learned the value of careful planning before diving into implementation.
What's next for Wild West Murder Mystery
Our next steps include adding more game modes to align the experience with our inspiration from Jackbox Games. The infrastructure we’ve built is versatile and ready to support future mini-games, making the project fully scalable for further development.
Bonus Video with audio and local server starting demonstration! https://youtu.be/I2cYkIkwcyo
Built With
- css
- dall-e
- flask
- javascript
- nextjs
- node.js
- openai
- python
- react
- tailwind
- typescript
Log in or sign up for Devpost to join the conversation.