Been working on a larger change for awhile and its pretty much done now! In the previous events there was a script to have pings for where pixels were placed and then I adapted that so that it existed in the actual codebase so more people could use it (global pixel pings). Some of the feedback people gave from that was that it added a lot more activity to the canvas to make it seem more alive.
Cursors!
When thinking of other ways to make the canvas seem alive I got the idea to do something similar to cursors.io (which was shut down now but was a multiplayer team work game) or cursor camp (https://neal.fun/cursor-camp/) where you can see the cursors of other users on the canvas as they go around and place things.
This feature can be disabled (and then you dont send or receive cursor events) and is disabled on mobile as phones dont have cursors.
When you select a color your cursor is colored that color and you show up that way to any other users on the canvas. Cursors for people that are zoomed more out from you are a bit larger (and fade out when theyre overly big so they dont block things) and ones from people that are more zoomed in are smaller than you.
Reactions
As a little communication method between cursors you can send one of 10 different reactions using the number keys. These are various emotes I commissioned from Rincs (who is a great artist, highly recommend looking at their stuff https://vgen.co/Rincs)
Hope you enjoy! This is a feature that I don’t think exists in any canvas type website currently but I think is going to be great to make it feel a lot more alive
That’s amazing! Cannot wait to see it in action. Is it on by default or is it an opt-in?
And I remember cursors.io, it was super fun (before it became overrun by cheaters). I wish someone recreates something with similar concept someday.
For people on PC its on by default when logged in and can be turned off with a toggle in the settings. When logged out or on mobile its off
Only the cursor is sent and there isnt a name shown currently unless you then place down a pixel and someone inspects that pixel to see who placed it
Theres various things that are part of the change so that its optimized. You can only see cursors of people in similar zoom levels for example as one of those. Exact cursor positions arent shared but people just see the cursor snapped to the pixel on the canvas its hovering over so that objects sent are smaller
Thanks for the info, I was infact wondering how it works technically. If the cursor position is always snapped to the grid, won’t it make your cursor movement look noticeably choppy to others? Or maybe I’m just imagining it wrong…
Random extra implemetation info.
When viewing the canvas you send the left right top bottom of your screen and zoom to the server. The server then sends back all cursors that are valid to be shown based on what you sent. On future times you ask the server it only sends back what changed (so a cursor that doesnt move doesnt get sent again and your local version knows its just still in its same position). That helps cut down more on bandwidth being sent around.
The map is split into various chunks of different sizes. When you send the position and zoom to the server it tries to fit you nicely into chunks and then the cursors it sends back are the cursors within those chunks. Then if somebody else asks for the cursors and they fit into the same chunks it sends back the same data to them due to it being cached for those chunks instead of computing it again which helps reduce server load.
Glad to hear it seems to be more optimized than 99% of modern webapps. Way too many devs nowadays treat bandwidth like it’s unlimited.
Let’s hope everything works smoothly when the event starts ^^
If things go bad theres a killswitch so that the entire feature can be disabled but have my fingers crossed everything works the first time. Did some testing but havent been able to simulate 300 actual users moving around
theres some interpolation so you dont just teleport to the new position but yeah its still a bit choppy. Not much I can do else to smooth that out unless I want a bunch more bandwidth used and I think its decent enough