https://github.com/jayrichh/whiteboard

A collaborative whiteboard app featuring persistent drawing, with modes for Local Drawing, Team Collaboration, and Color Clash games.
https://github.com/jayrichh/whiteboard

Last synced: 24 days ago
JSON representation

A collaborative whiteboard app featuring persistent drawing, with modes for Local Drawing, Team Collaboration, and Color Clash games.

• Host: GitHub
• URL: https://github.com/jayrichh/whiteboard
• Owner: JayRichh
• License: mit
• Created: 2023-09-22T16:45:47.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2023-09-24T01:07:53.000Z (over 1 year ago)
• Last Synced: 2023-09-25T02:02:06.228Z (about 1 year ago)
• Language: JavaScript
• Homepage:
• Size: 25.4 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Collaborative Sketchpad: A Multiplayer Drawing Game

## Overview

This is a collaborative sketchpad, developed using socket.io, HTML, CSS, and JavaScript. It allows users to connect with others via unique room codes, create and share real-time sketches, and save their creations either in the shared workspace or locally.

![Game Screenshot](./assets/game-screenshot.png)

## Credits

Base code provided by Craig @cdev010

![Banana](./public/icons/icons8-banana-48.png)

## Features

- **Collaborative Workspace**: Create and share real-time sketches with others.

- **Multiplayer Support**: Connect with others via unique room codes.

- **Real-time Updates**: Workspace status and sketches update in real-time.

- **Local Storage**: Sketches are saved locally and can be accessed anytime.

## How It Works

- Users join a workspace using a unique code.

- Real-time sketching allows for collaborative work.

- Sketches are saved locally and linked to your socket.io connection.

### Workspace Initialization

- Connect to the workspace using a unique code.

- Workspace status updates for all users.

### Workspace Interaction

- Join or leave using a unique code.

- User names are displayed in a list.

- Sketches are saved in local storage and can be accessed anytime.

### Drawing Tools

- Users can select from a variety of colors and stroke sizes.

- Users can clear the canvas at any time.

### Saving and Loading Sketches

- Sketches are automatically saved locally in real-time.

- Users can load their saved sketches anytime.

## Tech Stack

- Socket.io

- JavaScript

- HTML/CSS

- ![Banana](./public/icons/icons8-banana-48.png)

## Installation

1. Clone the repository.

2. Run `npm install`.

3. Run `npm start`.

## Usage

Open `localhost:3000` in your browser and follow the on-screen instructions.

## Contributing

Feel free to submit issues or pull requests.

## License

MIT