Member location

Display the live location of a user within the app using this React starter-kit.

What is member location?

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
  • Chat
  • CRM
  • Slide decks
  • Spreadsheets
  • Collaborative forms
  • Whiteboards
  • CMS
View the docs
Where to use live cursors

Member location best practices

Show instant movements,

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.

ake it useful, not a distraction,

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

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

Live cursors

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.

Check it out
Avatar stack

Avatar stack

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.

Check it out
Component locking

Component locking

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.

Check it out
Spaces Integrations: datadog, AWS, React, Lambda, WebHooks, Apache Kafka, AWS SQS, AWS Kinesis

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

Start building with Ably today

Join more than 900 companies already building with Ably.