Whiteboard

Inspiration

Due to outbreak of covid virus in 2020, education sector has also suffered a lot. It has gone through a sudden shift from offline classroom to virtual classroom, from blackboard to whiteboard, from hard copies to e-notes and a lot more. Based on the my research, I made a Whiteboard which serves user with several functionalities.

Project Use-Case

My project Whiteboard can facilitate a professor during his/her lessons in delivering of knowledge to the students. It can be used by different users all over world to accomplish their task/work. Along with assisting individuals from different working culture, it can also be used as a fun element by children. They can paint their imagination on Whiteboard using different colour and shapes. In lockdown, an online whiteboard has supported youngers in making learning process more fun, increasing their productivity and creativity to next level.

How I built it

Tech Stack of my project is: HTML, CSS, JavaScript and HTML5 Canvas API The main technology behind the working of my Whiteboard is JavaScript and Canvas API. The Canvas API provides a means for drawing graphics via JavaScript and the HTML element.

Project Features - Accomplishments that I am proud of

Along with some basic functionalities like hand-drawing (with varied pencil colors and size), erasing, undo, redo, trash (all-clear), it also provides sticky notes for writing some notes, it can also download the board drawings as PNG image and can also upload any image. The Whiteboard is also capable of drawing several shapes with different outline colors. User can also switch between white and black theme. Multiple pages feature is also implemented.

What I learned

"Learning by doing", according to me, is the best way of learning any new concept or a technique. My project makes maximum use of JavaScript. Through this project I learned more concepts of JavaScript and enhanced my knowledge. Further, Canvas API was new to me. I used it for the very first time. I tried and tested it before applying. I really found this very interesting and loved working on this project.

What's next for Whiteboard

The project involves all the basic tools a user will need to annotate on whiteboard along with some enhanced features like, color theme and multiple pages. With more experience and a business model the project could be expanded on a great level.

A real time share feature can be added to the whiteboard with which user can share the whiteboard among their friends or colleagues and can work simultaneously.

Built With

• canvas-api
• css3
• html5
• javascript