Display the live location of a user within the app using this React starter-kit.
What is member location? Member location is a way to show where fellow collaborators are located within a shared space. This can be useful for understanding what other members are working on, and how their work might affect yours. There are a variety of ways to display user location, such as using a border matching the member's avatar, the avatar itself, or a textual name.
Where to use member location
Displaying member location can add value to a range of multiplayer collaboration experiences, especially when used in combination with other collaborative features.
Some example use cases include:
- Project management
- Slide decks
- Collaborative forms
Member location best practices
Show instant movements
Don’t underestimate the importance of instant updates to member location. Make sure the location updates are reflected immediately in the UI so users take appropriate action based on that information.
Make it useful, not a distraction
Member location is meant to provide a subtle, visual cue indicating who is working on what. The UI should not distract from the core application or components being worked on.
Jump to a member’s location
Avatar stacks can be used in conjunction with member location to show where exactly someone is within a space - allowing them to jump to their location or follow their movements.
Discover more live demos
A host of collaborative features to enhance your user experience.
Live cursors show the mouse pointer position of other collaborators. They can be useful to show what someone is currently looking at and their movement around a space.
Avatar stacks show all the users collaborating within a shared space. They can help users make informed decisions by indicating the connection state of fellow collaborators.
Component locking can be a valuable tool for collaborative applications. A lock displayed over a particular component signals to other members that they are currently being edited.
Integrations, whatever your stack
From Webhooks to Lambdas to stream processors like Kafka, Ably has built integrations for a range of protocols, frameworks, databases and cloud services.View all integrations