Pavement is a real-time collaborative drawing application where people can create and chat about drawings. Users can sign up and create a board or join one (either public or private).
Within private boards, users can add/delete users with board access, and board owners have the ability to delete any boards they create.
In terms of drawing functionalities, the tools/functionalities available include:
- Pencil
- Cloud
- Circle
- Single Rectangle
- Single Ellipse
- Eraser
- Text
- Pretty Circles
- Pretty Rectangles
- Pretty Ellipses
- Circle (where location of mouse affects the size)
- Color Picking (using hex values or specified colors i.e. black, blue, red, white)
- Select & Move
- Download SVG
- Clear Canvas
- Import SVG
- Stroke Width (applies for pencil and cloud)
In addition to plain Javascript, HTML, and CSS, Pavement also utilizes Paper.js (drawing framework), Socket.io (real-time framework), and Redis (ds store). To improve the efficiency of the app, we setup a server specifically for redis, and the repository dedicated to that can be found [here] (https://github.com/adeaver/ResquePavement). *** For our app, we recommend using Google Chrome as your internet browser.
| Week # | Date | Objective |
|---|---|---|
| Week 1 | Tuesday 3/22 | |
| Week 1 | Friday 3/25 | |
| Week 2 | Tuesday 3/29 | |
| Week 2 | Friday 4/1 | Set up collaborative async chat (with authentication) and have an interactive canvas set up (Design Review #1) |
| Week 3 | Tuesday 4/5 | |
| Week 3 | Friday 4/8 | Integrate backend with frontend |
| Week 4 | Tuesday 4/12 | |
| Week 4 | Friday 4/15 | Add initial features (Design Review #2) |
| Week 5 | Tuesday 4/19 | |
| Week 5 | Friday 4/22 | Work on UI / Add additional features (Informal Check-in #3) |
| Week 6 | Tuesday 4/26 | (last class period!) |
| Week 7 | Monday 5/2 | Code freeze! |