Key insights
- The server streams roughly 10 positions a second while the screen redraws at 60fps. Interpolation fills the gaps so cursors glide instead of teleporting between discrete points.
- Give every user a color hashed from their ID, not assigned at random. The same person keeps the same color across sessions, so you can track identity from the corner of your eye.
- An avatar stack with an overflow counter (three faces, then a +5) signals presence before anyone edits or speaks. You feel the room before you read a single name.
- When someone selects an element, lock it and outline it in their color. Two people editing one shape is a corrupted shape, so the lock prevents the conflict before it can exist.
- Follow mode binds your viewport to another user's: click their avatar and their pans and zooms drive your screen. It replaces a screen share for live design review.
Do / Don't
- Do: Interpolate cursor positions between server ticks so movement reads as smooth motion at 60fps.
- Do: Derive user color from a stable hash of the ID so it survives across sessions.
- Do: Lock an element the instant it is selected and badge it in the editor's color.
- Don't: Render cursors at the raw server tick rate, which makes them jump between points.
- Don't: Assign colors randomly per session, which resets identity every time someone rejoins.
- Don't: Allow two users to edit the same element at once.
