Mafia is a thrilling social deduction game where deception and strategy are key to survival. This game is developed using HTML, CSS, and JavaScript, with a Flask backend hosted on Vercel. Playable on both mobile and desktop screens, Mafia offers an engaging experience for all players. The game includes sound effects to enhance the experience, with audio cues for kills, votes, and other key moments.

Game Rules

Roles 🎭

1. Mafia (Killer) - Kills one person per night.🔪

2. Doctor - Saves one person per night.🩺

3. Police - Investigates one person per night to determine if they are the Mafia.👮‍♂️

4. Prankster - Pranks one person per night, preventing them from using their power.🎭

5. Civilian (Villager) - A normal villager with no special powers.👤

Game Flow 🌙🌞

Joining the Game 🌐

Go to MAFIA website. Enter your name and join a room. You can create a new room or join an existing one. The host will start the game, and each player will receive a role card.

Night Phase 🌙

Depending on your role, you will perform the following actions:

• Mafia: Choose one player to kill.💀
• Doctor: Choose one player to save.🛡️
• Police: Choose one player to investigate.🔍
• Prankster: Choose one player to prank.🎉
• Civilian: Your choice does not affect the game.👤

Day Phase 🌞

• Discussion Round: Players discuss who they think the Mafia is.🗣️
• Voting Round: Players vote on who they think the Mafia is.🗳️
• Voting Results: If the Mafia is voted out, the game ends. If not, the game continues to the next night phase.♻️

Winning the Game 🏆

The game continues until either the Mafia is voted out or the Mafia successfully kills all other players.

Screenshots 📸

Mobile 📱

Desktop 💻

Game Flow Diagram 🎨

For a visual representation of the game flow and states, refer to the diagram given below.

Game Designs 🎨

Website designs (low fidelity) 📐:

All game dev components used can be found here.

File Structure

Mafia game project structure:

• API Folder 📁

  1. app.py: Main server file.🖥️

  2. templates folder:📄

     • create.html: Create a new game room.
     • index.html: Check if the game is working (old play.html).
     • join.html: Join a game room.
     • landing.html: Landing page for the main game.
     • main.html: Previous landing page (old landing.html).
     • play.html: Main file for playing the game.
     • spectator.html: Spectator page to watch the game.
     • UI.html: Basic UI components for development.

  3. Static folder:🖼️🔊

     • assets folder: SVG images.
     • audio folder: Audio files.
     • images folder: JPG or PNG images.

Background 📜

The game was inspired by the traditional Mafia game played with friends using chats and a human host. This digital version automates the process, making it faster and more convenient, allowing everyone to participate without the need for a dedicated host.

How we used to play... 🎲

We used to make paper chits or cards, and in those chits, we would write the names of the roles like Civilian, Mafia, Police, and others. These chits were then distributed among the players. There would be a god or a host who controlled the entire game. The host would ask everyone to close their eyes, then call on the Mafia to open their eyes and choose someone to kill. Afterward, the Doctor would open their eyes and choose someone to save. The game was very sequential, with each role acting one after another, making the process quite lengthy and sometimes frustratingly slow. The entire game took a lot of time.

Additionally, some players used to cheat between rounds, trying to gain an advantage by peeking or signaling to each other. This added an extra layer of challenge and suspicion to the game.

Contribution 🤝

If you encounter any issues or have suggestions for improvements, feel free to raise an issue or contribute to the project.

---

Thank you for playing Mafia! Enjoy the game and may the best detective win.🕵️‍♂️