-Mosaic

• 

  3 users create an apple

Inspiration

This project was inspired by r/place and how it brought the world together to make a single piece of art.

What it does

In a similar spirit to r/place, -Mosaic allows people to draw with a strict set of colors. Users are given free placement of the squares and no time restriction.

How we built it

We built the base project using Wick Editor, an online Javascript game editor. We used Firebase to store accounts and Replit to host a server. The HTML/CSS of the project were made from scratch on Github.

Challenges we ran into

While Wick Editor was very convenient, working with servers was very difficult because testing many users simultaneously before pushing to Github (which takes minutes just to test) was time-consuming. Also, after modifying the Replit server to hold different player variables, the Wick project held onto old variables. After lots of head-scratching and undoing, we restarted the Replit server to fix the desync.

Accomplishments that we're proud of

This is the first time all of us have built a cloud project from scratch. Using lots of independent softwares and having them talk to each other was a feat we didn't know we could achieve.

What we learned

Working with multiplayer applications is very hard and time-consuming. We had to learn/use CSS and WebSocket on the spot to make a functioning project.

What's next for -Mosaic

We would want a better way to refresh the canvas and make a much better interface. We also would add avatars and usernames next to the live users' cursors. Brush strokes and different shapes would also be desired.

Built With

• css
• firebase
• html
• javascript
• node.js
• wick