Improving presence & activity status

Parabol

When I joined Parabol I made it my task to identify, document and propose improvements to key areas of the app where I considered our UX was not meeting quality expectations.

One of these examples was on the meeting view. This view was what every user saw when their team was running a meeting in Parabol, and one of the most critical points of our app.

ℹ️

The following is an adaption of a proposal document I presented internally to my team at Parabol.

ℹ️

The following is an adaption of a proposal document I presented internally to my team at Parabol.

ℹ️

The following is an adaption of a proposal document I presented internally to my team at Parabol.

Background

As it stands right now, there is no way in a Parabol meeting to accurately know of the total number of members in a meeting, how many are currently present, how many are offline, and how many have engaged with a particular phase.

While facilitaros have the Next button's completion ring to give them an idea of how many team members have completed a phase, it is an unreliable signal because it does not factor in members who are not present and have not interacted with the meeting. It is also a very small surface area in the overall meeting UI that can be missed by some users:

This can produce uncertainty for facilitators, particularly when it comes to deciding when it's time to advance to the next phase or stage in a meeting. We keep seeing this feedback come up from customers:

"During a Retrospective today, I kept having to ask the participants if they were ready to move to the next phase. According to them, they click a Ready button when they are Ready. I as a facilitator have no way of seeing when they are. If would be super helpful if I can get an indication or notification when everyone is ready to move on."

"The Next button wouldn't work, but it didn't tell me why. I figured out it was because no votes had been cast. It would have been nice to tell me why I couldn't go forward."

"Show a list of who hasn't voted yet so we can know who hasn’t voted so we don’t have to play process of elimination with the top. If we can't get who hasn't voted, we'd like to be able to expand the "+1" in the team list at the top so we can do the mental process of elimination."

Summary

This is a proposal to bring more awareness, particularly for facilitators, around user presence and activity, with the goal of providing a useful signal that makes meetings in Parabol more efficient and smooth.

Goals

As a facilitator, I should be able to answer the following questions without much clicking around:

  1. How many members are in this meeting?

  2. How many are currently online?

  3. How many are offline?

  4. For any particular phase, how many members have completed it? How many are still working on it?

  5. How many members have not interacted with the meeting at all?

Before moving forward

I think it's important we are all on the same page when it comes to two important concepts: meeting IA (information architecture) and the 3 levels of user presence/activity.

Meeting IA

In simple terms, the meeting interface in Parabol can be divided in two distinct areas:

  1. The place where all the meeting properties are (title, team, agenda, etc.), and

  2. The place where each phase's content is shown (icebreaker question, reflect prompts, poker voting, discussion threads, etc.)

This basic distinction helps us keep an efficient separation of concerns: what is meeting information should go in the yellow area on the left (the meeting sidebar), and what is content related to a phase goes in the green area to the right.

The levels of user presence and activity

In addition to meeting IA, I want us to look at the 3 distinct levels of user presence and activity that we currently support in Parabol: global, phase, and inline.

Global

This is the meeting-wide level of user presence. This is how we know who is a member of this meeting. Currently, this is shown on the upper right corner of the meeting UI, in the phase content area:

Phase

Phase

This is the phase-level user activity and helps us answer who is engaging with or has completed a phase. We currently don't have a way to surface this information beyond the Next button.

Inline

This is at the granular level and shows us who is interacting with a specific component. Think when someone is moving a card, or has voted on a sprint poker story, or has added a comment. We currently show this level in different places, depending on where the action is happening:

The proposal

I'm proposing we introduce the phase-level of user presence to a Parabol meeting, and make a clear distinction of the 3 levels in the meeting IA. To do that, I first started by exploring what it would look like if we kept the global level of user presence contained to the meeting sidebar.

A new meeting members component

We can display the full list of meeting members in the same area where we currently show who the meeting facilitator is:

We can still indicate who is the meeting facilitator by placing a visible badge on top of their avatar, and placing this avatar at the start of the list:

This list of avatars will also help us communicate who is online and who's not, by way of making the avatars of the disconnected users semi-transparent, like the last four members in the image above.

In addition to displaying the full list of avatars, we can also be nice to our users and show the total number of members below the avatars (e.g. "16 members") so they don't have to manually count 😃. That said, I've intentionally made it so each row of avatars can contain up to 10 members with the goal of making it easier to also figure out the amount of members by looking at the size of the row.

I've also added a clear and prominent Invite button below the list, making it obvious how to add more folks to the meeting.

What I like about this approach is that everything member-related is contained in this little component. No need to look or click elsewhere to figure this out.

Member info

Focusing or hovering on an avatar will show a little member popup, revealing member-specific information and actions:

When I hover the facilitator's avatar, the popup tells me their name, that they are the facilitator, and I can access the 'Take the facilitator role' option.

Something similar is shown when hovering the avatar of a regular member:

The popup shows me their name, and in the case of a disconnected user, when was the last time they were connected. I can also see the phases they have completed, revealing that this user has been active in the meeting. I also have access, as a facilitator, to a 'Remove from meeting' control.

For those members who have not engaged with the meeting at all, we can display a message along the lines of "Has not joined the meeting":

The popup can also scale to include more actions, for example:

Handling a lot of meeting members

While rare, let's say a meeting has 56 members. We obviously don't want to display them all at once since it'll be a lot of avatars. We can define a threshold at which we hide the rest of the avatars, say our threshold is 20, and what we do then is show an option below the group of avatars that lets you expand to see more:

This allows the facilitator, and anyone else on the meeting, to view the complete list of members and interact with all of the avatars. If they wanted, the list can then be collapsed again by way of the 'See less...' text button.

Going back to the goals I stated earlier in this document, I think this design will help the facilitator, and anyone else in the meeting, easily answer questions 1, 2, 3 (and 5 with a some hovering).

  1. How many members are in this meeting? ✅

  2. How many are currently online? ✅

  3. How many are offline? ✅

  4. For any particular phase, how many members have completed it? How many are still working on it?

  5. How many members have not interacted with the meeting at all? ✅

So let's move on now to addressing question numero four: For any particular phase, how many members have completed it? How many are still working on it?

Phase-level presence and activity

Now that we've moved meeting membership (the global level) to the meeting sidebar, we are left with fresh new available space in the top-right corner of the phase area:

I think this is the ideal space to explore displaying phase-level user activity for the simple reasons that is within the phase area (see the law of common region and the law of proximity) and is also a very visible space with a decent enough surface. This will make it easier for facilitators to be aware of phase completion. I think it can look something like this:

As users start to engage with and complete a phase, everyone, including the facilitator, will start to see the avatars animate and appear in this space. This should provide the necessary signal for facilitators to understand the engagement level of a particular phase.

I don't think the goal of this component is to be super granular, but instead give enough info for facilitators to know when is time to move to the next phase.

The End

🙏 Thank you for reading this far down, I really appreciate your time. I really want to hear what you think. Any kind of feedback, comment or suggestion in any medium of your preference is most welcome.

✌️