real-time collaboration
Atlassian
Background
Exploring development of real-time collaboration features across Atlassian products.
With the change in landscape to how people work due to the pandemic there is a need for a better way to collaborate with others in the digital space. The quality bar was raised for collaborative products in the digital world and we felt Atlassian, a company that’s sole focus is on teamwork was starting to slip behind its competitors. This led to the formation of a new team that was tasked with coming up with a vision and strategy for real-time collaboration across our products. Features that are real-time include avatar presence, live cursors, audio huddles and highlighting when someone has selected content.
Customer pain points
Screen sharing in third-party products
Disjointed collaboration
Passive observers instead of active collaborators
Lack of direct interaction and manipulation
Design deliverables
Provide research into the customer pain points and needs around collaboration with multiple people.
Develop a vision and design concepts to sell back to different Product Leadership teams.
Design guidelines on how to adopt and use Multiplayer presence components such as avatars, telepointers, cursors and selections.
Research
We started going through all the products that we know offered collaborative experiences and began scoring based on feature richness. We immediately noticed Atlassian was lagging behind with features, only offering avatars and cursor telepointers.
Through past customer studies we were learning that teams were more likely to collaborate in our competitor products due to them feeling “easier” to collaborate with colleagues. Showing more in-depth visibility of who was working in a document such as what they had highlighted and if they were still typing something made teams feel more engaged with each other.
“What would I expect to see if we're all in there at the same time? Yup. Yup. So for starters, I'd expect to see like cursors, just because I've gotten so accustomed to that with, with mural, I'd expect to see if somebody has a new card open, perhaps it's, it's not yet completed, but seeing at least the fact that a card is being worked on even further, like we could, if we could see like real time typing on the card.”
Our initial focus for more real-time collaboration was going to be improving our presence features that included avatars, selection highlights and telepointer cursors. We wanted to show customers that were working on the same document or looking at the same board more information.
Design
One of our newer products Jira Work Management was looking to adopt our improved presence features to a cohort of their customers to gather learnings. With our new designs we focused on making it as easy as possible to identify who is collaborating with you and what they are doing. Some of the current problems to solve for existing designs included:
Confusing when people have the same letter initials.
Avatar letters not needed with photos or initials being used to represent a person.
Text and background colour not always meeting colour accessibility standards.
Single letter telepointers are hard to spot sometimes on a page.
Testing
We arranged interviews with customers to show them early concepts of all the new multiplayer features we had designed and wanted to get their feedback. This involved showing them some mock-ups of real-time collaborative features turned on for different products such as Jira, Confluence and Trello. We wanted to learn which features they saw the most value in and would help them the most in their day-to-day work.
The response from participants for the avatar and cursor improvements was positive and designs aligned to their expectations of what they had seen in other products. Some of the most wanted advanced features were audio huddles, real-time cursors and emoji reactions.
Audio huddles would help cut down meeting time and allow for quicker collaboration. Time saving is important in a remote world when people want to protect their calendar.
Real-time cursors allow people to see who is in a product with them and helps draw focus into specific areas of boards or certain sections of a page.
Emoji reactions bring a positive team culture into otherwise stale or boring meetings and allow a more human expression to be introduced. This feature is especially useful for the more introverted individuals who might struggle to speak up. Giving a :clap: is a lot easier.
I would expect cursors to move around. I would expect sort of the tickets themselves to move from, like in progress to ready for review or something that's done moved back into the backlog. So I would like, I would imagine that I would see some movement of tickets here in real-time as multiple people are kind of interacting with this board, if that's what's happening. - P4
Overall participants welcomed the new features we showed them. A few of them mentioned how it gives them a Google or Figma vibe and liked how it gave the feeling of interaction while working together. Real-time cards moving across the board was a particular highlight, you can see who is making the changes and what they are doing. One participant noted that he would like to see when someone is typing or editing a particular card giving that extra level of context.
Results
Our new avatar, selection and cursor improvements have been designed and ready for product adoption and we have some validation and a roadmap of what features customers want next. Jira Work Management has been the first product to adopt the new designs. This now shows improved colour contrast with the telepointers, full name titles instead of one letter initials and shows you when someone has selected and is typing in a ticket.
Results since release:
The new designs have helped Jira Work Management increase retention.
4% increase in one week retention rate for users who experienced real-time collaboration.
15% increase in two week retention rate for the same cohort of users.