🕵️

Elmokhber

Featured

An interactive social deduction game based on intelligence, understanding, and strategic deception, with live voice calls

Overview

Elmokhber is a unique interactive social deduction game that combines intelligence, analysis, and strategic deception in a live voice environment. The app uses LiveKit technology to enable live voice calls between players, adding a realistic dimension to interaction and discussion. In each round, players are given secret roles they must hide or reveal based on their strategy. The goal is to discover the inspector's identity while the inspector attempts to deceive and mislead. The system supports creating private game rooms and finding public ones, with a spectator mode for watching without participating.

Features

  • Live voice calls via LiveKit with high audio quality and low latency for real-time communication between players
  • Random secret role assignment system that adds surprise and strategy elements to each game round
  • Interactive voting mechanism allowing players to nominate and select suspects with real-time result display
  • Game lobby with the ability to create private rooms or join open public rooms
  • Strategic gameplay based on deception and analysis where each player must convince others of their innocence
  • Spectator mode that allows watching gameplay and listening to discussions without participating in voting

How It Works

The app relies on Next.js for the frontend and LiveKit for live voice calls. When a player enters a room, their role is secretly assigned and stored in the database. During gameplay, players communicate verbally and exchange accusations, then voting is conducted to determine the suspect. The system handles disconnections automatically and restores the player's session upon return.

Challenges

The biggest challenge was integrating LiveKit into a Next.js app while ensuring voice call stability even with weak connections. Designing the secret role mechanism and player behavior analysis also required complex logic to ensure game balance. Managing game state across all connected players was a real challenge, especially when a player's connection drops.

Technologies Used

Next.jsReactTypeScriptTailwind CSSLiveKitPrismaNextAuthSocket.ioshadcn/uiRadix UIFramer MotionZustandRechartsReact Hook FormZoddnd-kitSonnerEmbla CarouselLucideVercelGitNode.jsBunnext-intlnext-themesReact QuerySharpcmdkdate-fnsTanStack TableMDX EditorReact MarkdownAblyESLint