Design challenge: Miro. Improving hybrid collaborative sessions

Final Ironhack project.

Our final project arrived. We were meant to collaborate with a real company to improve real scenarios.

Miro, the cloud-based infinite whiteboard that helps every digital team to visually collaborate, brainstorm and ideate remotely in real-time gave us an opportunity to improve one of their biggest challenges.

The challenge: Hybrid Workshops

Eduardo Gómez Ruiz, our mentor for this project is a UX Researcher at Miro. He challenged us to look at the future of hybrid collaborations:

Conduct a User Research about hybrid collaborative sessions (those with people both in the same room and remotely) and provide a better and more engaging experience between facilitators and participants.

My colleague Adriana Fischer (UX | UI Designer) and I start off setting up a meeting with Eduardo to review the briefing, clear doubts and collect as much as possible feedback. Here’s our 3 main outcomes:

1- The main Miro competitor’s (in the following order) :
- Mural, Invision Freehand, Jamboard, Microsoft Whiteboard.

2- Some known pain points of Miro’s users:
- Steep learning curve for new users.
- Facilitators have difficulties in keeping people’s attention. They don’t have either enough visibility or a clear number of how many attendees are engaged following the workshop, meeting, or presentation.

3- An activity proposal that it might help us get more discoveries:
Eduardo suggested us to attend to as many online or hybrids events as possible in a “fly on the wall” way, to observe people’s actions and behaviours.

Sorting, plan and action all this feedback was the next step. We planned a 2 weeks roadmap with the Design Thinking Process in mind. The first was focused on the User Research and the problem definition while the second was around wireframing, usability tests, design / assets creation and prototyping.

Here’s our index:

DEFINE THE PROBLEM

1.Empathise | Develop a deep understanding of the problem
1.1 User research
1.1.1
User Research. Qualitative Method: Interview
1.1.2 User Research. Quantitative Method: Survey

1.2 Business Analysis.
1.2.1 Business Analysis. Competitive Analysis:
1.2.1.1 Feature comparison
1.2.2 Business Analysis. JtBD (Jobs to be Done)

2.Define | Clearly articulate the problem you want to solve.
2.1 Affinity Diagram and How Might We Statements
2.2 Problem & Hypothesis Statement
2.3 User Personas
2.4 User Journey

SOLVE THE PROBLEM

3.Ideate | Brainstorm all possible solution (good and bad)
3.1 Ideation / Brainstorm

4. Mid-Fi Prototype

5. High-Fi Prototype

Road Map— Miro
Road Map— Miro
Roadmap — Miro

DEFINE THE PROBLEM

1.Empathise | Develop a deep understanding of the problem

1.1 User research:

1.1.1 User Research. Qualitative Method: Interview

The qualitative research was our first approach to get the user’s opinions. We organised 8 interviews with users of different online collaborative whiteboards, and we spent around 20 mins with each one talking about their past experiences working remotely and running online collaborative sessions.

We covered from an attendee and facilitator point of view by understanding what tools, softwares and devices they used, and of course we deep dived into the advantages and disadvantages. We did not talk just about the past but most importantly about the future and the upcoming hybrid scenarios. The overall impression about these sessions was full of impediments and blockers.

User’s opinions about Hybrid sessions — Miro
User’s opinions about Hybrid sessions — Miro

One of the users stated that “it just creates a lot of trouble”:

“…if half of the team has to be in person and the other half remote.. everyone is going to work remote. Whether you are in the same office and 3 people working from home, they have to join the session with their laptops..
If the people that are in person want to be in the same meeting room, do it, I don’t care but, when you create something, brainstorm or discuss about something… it has to be shared in the digital space. That is an efficient way from the facilitation point of view, and not moving thing around from the digital to the analog and vice versa…”
Raz. Consultant

This concern is directly related with one common and well known problem: the digitalisation of physical sticky notes. A time consuming task that requires the effort of retyping the content in the online whiteboard.

Some of the users shared with us their solutions. Introducing a co-facilitator that takes full responsibility over these tasks or allow the team to select the most important notes to later digitalise them.

Miro has recently partnered with Post-it® to solve this exact problem.
In the Post-it® App you can capture up to 200 Post-it® Notes at a time, edit them with the handwriting-to-text conversion tool, and export them later into a Miro board. See here how it works.

In any case users in general are sceptical on using sticky notes in the future. Some don’t see it as an environmental friendly idea.

All this feedback helped us to elaborate better questions in our quantitive research in order to get the right answers. We moved into the Quantitative research.

1.1.2 User Research. Quantitative Method: Survey

Through our survey we created the below table. Miro is the most used tool and Microsoft Whiteboard the 2nd preferred choice.

Miro is used in combination with other communication tools like MS Teams, Zoom or Slack. This means that the video and audio features Miro currently offers are not good enough, do not perform well or cover the user needs when they work collaboratively and connect remotely.

The most common devices used on these hybrid sessions are laptops, speakers or microphones. These last two are a basic requirement in order to improve audio quality.

User Research: Quantitative Results — Miro
User Research: Quantitative Results — Miro
User Research: Quantitative Results — Miro
SurveyResult
A result form our Quantitative Survey

Another important output from the survey came from the question “How often people want to come back to the office?”

At the time of this writing the current world is living a covid working from home situation for already a year.

People are generally missing the office and the social interactions in person. Everything is now remote, virtual and done through video-calling interfaces. This requires, for some people, an extra energy and effort from their brains — Zoom fatigue.

It is clear the hybrid format will become soon a new normal.

1.2 Business Analysis.

1.2.1 Business Analysis. Competitive Analysis:

1.2.1.1 Feature comparison

As Miro didn’t provide their analytics for this project we made the Competitive Analysis with the data we manually collected. We compared the features of the main competitors of Miro and we paid special attention to MS Whiteboard because, as mentioned above, the results of our survey revealed it as its main competitor.

Feature comparison of Miro’s competitors
Feature comparison of Miro’s competitors

As a side-note it was interesting to see that Miro still doesn’t offer the option to record the sessions. Some users, especially facilitators, find this an important feature to implement in the future.

Besides, we considered and included on our feature comparison table the trending video call platform Meet Butter . We discovered that some of the Miro users we interviewed also use it for their online communications and collaborative workshops. It has a very friendly user interface that creates an engaging experience when doing group video calls and in addition, it has a Miro integration that allows you to open your Miro board directly in the video call.

And as mentioned previously the current built-in video call functionality Miro has is not perceived as reliable by the people we interviewed.

1.2.2 Business Analysis. JtBD (Jobs to be Done)

We elaborated the JtBD based on stories from user’s interviews:
Job stories: What users tell when they have online and/or hybrid collaborative sessions?

  • When I’m following an hybrid collaborative session from my remote space, I want to hear and recognise the onsite participants well, So I can feel involved in the workshop.
  • When I’m following an hybrid collaborative session from my remote space, I want to have a full overview of what is happening on the onsite space. So I can follow the session and not getting distracted.

2.Define | Clearly articulate the problem you want to solve.

2.1 Affinity Diagram and How Might We Statements

We identified and selected the one we found relevant to find a solution for by moving into the definition phase of the How Might We Statements:

  • How Might We improve the visibility and recognition of onsite and online users’ when talking in a hybrid collaborative session?

From all of our analysis and research this was one of the main concerns amongst our interviewers and fully aligned within the scope of our challenge.

2.2 Problem & Hypothesis Statement

The Problem Statement

Our features were designed to facilitate hybrid collaborative session using Miro. We have observed that hybrid workshops are challenging especially for the online users, because it is often hard for them to follow the conversations onsite, which makes people frustrated and disengaged.

The Hypothesis Statement

We believe that by implementing a feature that shows and highlights who is speaking will achieve more engagement, and therefore higher satisfaction among hybrid collaborative session participants. We will know we are right with an increment of hybrid sessions performed.

2.3 User Personas

The definition of the personas was easily divided in two. The attendant and the facilitator. We spoke with some of them in our interviews, and we identified patterns from both sides we described in the following profiles:

Lisanne that represents the attendant user.
This persona normally follows the meetings remotely.
- Her main frustration is the difficulty of following the conversations that happen in the room.
- And her core need is to be able to brainstorm and participate easily during hybrid workshops.

Thomy that represents the facilitator/moderator user.
This persona runs online and hybrid collaborative sessions.
- His main frustration is to not be able to facilitate successful hybrid workshops.
- His core need is to recognise participants voices.

User Persona. Attendant and Facilitator — Miro
User Persona. Attendant and Facilitator — Miro

2.4 User Journey

Our User flow describes a common journey of Thomy, which includes an hybrid collaborative session:

We found 3 opportunities to improve his pain points, but as mention above, we were focused on finding a solution for one: The complicated audio problem and communication blocker that makes difficult to have fluid collaborative session among online and onsite participants.

User Journey — Miro

SOLVE THE PROBLEM

3. Ideate | Brainstorm all possible solution (good and bad)
3.1 Ideation / Brainstorm

During this last year the majority of us have had several video calls during the day. Our communications have changed into a 100% online digital environment that required a re-learning on the habits of our conversations. We miss body language or spontaneous conversations; besides, distractions and technology issues like audio or internet problems create a disconnection between participants that blocks the performance of a collaborative session and its conversations.

The hybrid scenario is even harder because the participants from the shared room have closer conversation that are difficult to follow for online participants. This creates a bigger gap in the communication between each other.

At the end, the participants don’t feel engaged, their focus and their attention decreases, and the session fails. “You’re on mute” has been a common sentence in our day-to-day remote life.

Following up on our “How might we’s” we focused our efforts on finding a solution for online participants which are the ones that are less perceived. They claim a solution that improves “visibility” and “recognition” about who speaks in the share room.

We consider that the audio has a more important role than the video.
We based our decision from our User Research in combination with some other confirmed factors:

1- The success of the of the social network based on voice Clubhouse

2- The article mentioned above about Zoom fatigue affirms that traditional phone call may be less taxing on the brain…because it delivers on a small promise: to convey only a voice.
A work meeting that can be done by phone, try walking at the same time. “Walking meetings are known to improve creativity, and probably reduce stress as well,” Normand says.

3- A friendly environmental solution. Turning Off Your Camera In Video Calls Could Cut Carbon Emissions By 96% . Reduce carbon footprint it is an important issue for some of our users, we saw that when some of them didn’t consider a positive habit to use physical sticky notes anymore.

The propose is based on 2 features:

1- Add instant Voice call every time someone joins a MIRO Board.

By default a MIRO Board is just a collaborative online board. The proposition is to establish immediately a voice call between all users. By default a user is always muted when joining.

2- Add voice recognition to grouped onsite participants

Two participants onsite (Thomy-facilitator- and Anna)are working in their own laptops in the same MIRO Board shared with other 4 online participants.(Lisanne, Elias, Marta and Andres)

This features improves audio and speech comms and it allows each participant in the onsite group to be recognised in the board by the online users when speaking.

The proposition is to allow the onsite facilitator to be able to use a single microphone and add voice recognition of everyone within the same room.

4. Mid-Fi Prototype

The Mid-fi shows the User Flow of Thomy, the facilitator that is in a shared room with Anna.
Anna is in the same Miro board from her laptop, but Thomy and Anna will use the micro and audio from Thomy’s laptop. For that, he is going to add Anna’s voice into his Miro board by clicking on her image profile.
This way, online participants will be able to listen and identify the voices of the people within the shared room they are working in.

Mid-fi — Miro

Eventually the audio call could become into a video call by adding the feature of “turning on/off” the camera’s participant. This might change current Miro’s interface video calls.

5. High-Fi Prototype

Using Miro’s Design System and by re-creating some additional interactive components we built an Hi-Fi prototype within Figma.

Hi-fi — Miro
Focused Detail Final Hi-Fi Prototype

I added bellow two versions of possible audio recognition animations that might highlight the user when speaking.

Audio-Speaking-Options
Audio-Speaking-Options
Audio Speaking Animation Options — Miro

Learnings and conclusions

The learnings about this project are related with our failures.

At the beginning, we thought that digitalising the physical sticky notes was the most important problem of our users, and then we dived in to it too much. We got very excited and frustrated at the same time. Every solution we had, brought more problems.

AR & tracking-Magnet rolling board
Left: AR & tracking: tokens for the people using physical whiteboard — Right: Magnet rolling board with 360° camera & QR scanning

We went way far beyond by thinking that the Post-it technology mentioned above, might be an interesting resource to implement in combination with the AR technology. After scanning and importing the sticky notes into a Miro board, any online participant could change and work on it. The onsite participants would be able to view any of those changes with Augmented Reality through the recognition of a QR code in every Sticky note.

AR & QR scanning — Miro
AR & QR scanning — Miro

Every proposition was in a good or bad way “solving the input side”. It is indeed possible to digitalise content from onsite to online but it is difficult to do it in a fluid and in realtime without including several steps in the user flow. Collaborative sessions consist on ideating spaces where tone of concepts happen through conversations and notes. It is a huge challenge to visualise all the things that happen in every workspace in order to create an optimal communication ecosystem.

There are expensive devices and high technology that play an important role for businesses that can access to it. Like Surface Hub and Kaptivo (big screens, touch display, hand-writing recognition…)
And, of course ideas like VR Glasses or holograms that will revolutionise one day our ways of working and even socialising between each other.

By focusing too much on this wicked problem we disregarded for a bit the other relevant ones.

The gap communication problem between onsite and online people during hybrid collaborative sessions became our target but even then we weren’t complete right on the definition of this problem. There are still some inconsistencies and unanswered questions.

We definitely needed more time to evaluate and define better the problem. Normally these kind of studies (just the research) take a minimum of 4 weeks. Our project lasted 2 weeks including mid and hi-fi prototypes.

As a conclusion, I’m happy enough to have faced this challenge with a real project and a well known company as Miro is, and yes the big outcome is that I have learnt especially from our failures.

“What doesn’t kill you makes you stronger.”

I’m Rocio. A UX | UI Interaction Designer with a user centric approach to solve problems. https://www.rocioalbertos.com/