Pictionary

Phase: Development

This application digitizes the traditional game of Pictionary by making players compete online The rules of the game are simple

• A Random player is choosen and is given a word
• The player than has to illustrate something based on the word s/he has recieved
• Other players in the room should guess what the player is drawing
• If other any of the other players are able to guess, they are rewarded with a point based on the timing of guess
• The player who is drawing also will be awarded if atleast one player is able to guess the word
• The player with most points in the end, wins.

Features

• Drawing and Erasing strokes on the canvas
• Real Time sharing of the drawing and Erasing
• Real Time background and stroke color change
• Real Time chat with other players
• Real Time user join/leave notification

Tech Stack

Client: PUG, HTML5 Canvas, CSS 3, Vanilla JavaScript

Server: Node, Express, Socket.IO

Demo

The project is in development phase. Thus, if any bug is encountered, feel free to create an issue in GitHub.

Screenshots

Realtime Drawing Sharing

Home Page

Draw Pad

Chat

Users

Run Locally

Clone the project

  git clone https://github.com/suparthghimire/pictionary.git

Go to the project directory

  cd pictionary

Install dependencies

  npm install express socket.io pug dotenv

Create a .env File

  touch .env

The Env File only has a PORT variable

    PORT = 3000

Start the server

  npm run dev

Contact Developer

Gmail LinkedIn Instagram Facebook