Drawnter | Devpost

Inspiration

We wanted to make a tool to help students work in a team by providing them with a virtual whiteboard on their own computer which is linked with the whiteboards on other computers. This allows them to communicate their ideas on one whiteboard, even though they are all in different locations.

What it does

Each user that visits the URL will be able to write on the board with a unique colour. Everything they write is sent to the server, which distributes it to everyone else with that URL open.

How we built it

We used node.js for the back end communication between the server and the clients. A HTML canvas was used to display the drawing.

Challenges we ran into

We experienced some difficulty with being able to update all the screens in real time since sending the RGBA value of each pixel on the screen every cycle proved to be too slow. Instead, the client sends every pixel it made a change to to the server, which then distributes the information to the other clients.

Accomplishments that we're proud of

We are proud of how we were able to update all the screens at relatively the same time, allowing all of the users to see each others changes in nearly real time.

What we learned

We learned that communication between a server and a client can be very slow, especially when sending large amounts of data.

What's next for Drawnter

We could add rooms, allowing for multiple whiteboards to be running at one time. This allows multiple groups to use this tool while keeping their whiteboards separate.