🌉STREET RACER 2D🌉

Project name :- Gamers Paradise

---

Table of Contents

• Table of Contents
• 🗒️About
• 📁 File Structure
• 👨‍💻 Tech-Stack
• 🛠️ Prerequisites
  • Gesture control
  • Jupyter Notebook
  • Game
• 🎲 Starting the game
• 👋 Game Controls
• 📈 Future Prospects
• 🎮 Demo
  • Demo of the game using keyboard<
  • Demo of the game using hand detection
• 🏅 Team Members
• License

🗒️About

• Making a Gesture-controlled 2D Car Racing game using phaser.js

• Implementing stearing control using hand gestures with help of OpenCv library of Python

• Visit our Github repo to clone to play the game.

📁 File Structure

┣ 📂my_game
 ┃ ┣ 📂assets                    # All the images required for the game 
 ┃ ┃ ┣ 📜enemycar.png
 ┃ ┃ ┣ 📜phaser.png
 ┃ ┃ ┣ 📜player.png
 ┃ ┃ ┣ 📜road_test.png
 ┃ ┃ ┣ 📜sound.mp3
 ┃ ┃ ┗ 📜star.png              
 ┃ ┣ 📜game.js                   # It is the main JavaScript file for the game
 ┃ ┣ 📜index.html                # It imports the game.js file
 ┃ ┣ 📜phaser.js
 ┃ ┗ 📜phaser.min.js
 ┣ 📜Gesture_Controls.ipynb      # Gesture controls for the game in .ipynb format
 ┣ 📜Gesture_Controls.py         # Gesture controls for the game in .py format
 ┣ 📜LICENSE
 ┗ 📜README.md

👨‍💻 Tech-Stack

  Html
  CSS
  Javascript
  Python
  Phaser.js
  OpenCV

🛠️ Prerequisites

Gesture control

Following Libraries must be installed. The commands for installation are :

pip install numpy

pip install opencv-python

pip install mediapipe

pip install cvzone==1.4.1 

pip install pynput

In the code there is a part to capture the live stream Videocapture(n) here the index n is by default 0 for most machines but if the webcam doesn't work with 0 you can try 1,-1,0 and so on.

Jupyter Notebook

If you are using the Gesture_Controls.ipynb file, you will have to use Jupyter Notebook. You can install Jupyter Notebook from their website.

Game

Requires Vscode with Live Server extension installed.

🎲 Starting the game

1. Clone the repo using

 git clone https://github.com/ParthShirole/Street-Racer-2D.git 

2. Open index.html
3. Activate environment using . mypython/bin/activate
4. Run index.html using Go Live option of Vscode (enabled after downloading Live Server extension)
5. Now run Gesture_Controls.py or Gesture_Controls.ipynb and place the VideoCapture window on top of the game screen.

👋 Game Controls

We have mapped the controls of the car to the "A" and "D" keys on the keyboard so by using these virtual keys we can control the car . We are using Mediapipe hand detection model under hood for hand detection and the keyboard module for pressing the keys through our code.

• For Left motion : 🤏 Join the index finger and the thumb (distance between them should be less than 30)
  
• For Right motion : Keep the index finger and the thumb far away from each other (distance between them should be greater than or equal to 30)
  
• Press SPACE to Start game
  
• Press ENTER to Restart game

📈 Future Prospects

• Use Flask to import gesture control code
• Implement socket connection between client and server
• Add levels in Game

🎮 Demo

Demo of the game using keyboard<

racing.car.mp4

Demo of the game using hand detection

demo.mp4

🏅 Team Members

• Parth Shirole - parthshirole06@gmail.com
• Aryaman Shardul - aryashardul2002@gmail.com
• Rishabh Bali - rishabhsbali@gmail.com
• Kunal Agarwal - kunalagarwal1072002@gmail.com

License

The License used in this project.