Two years ago, where and how we work changed drastically due to COVID-19.
Businesses were forced to either adapt to the changing environment or close their doors for good… and the ones who chose to adapt were having to learn new technology and how to navigate remote work at unprecedented speeds, which essentially meant crossing their fingers and hoping for the best.
However, there were several new(er) technologies that quickly became unsung heroes of the pandemic (for business at least). One of those companies was Zoom.
Before Zoom, many businesses used Skype or GoToMeeting as means for virtual meetings, but no where near in the same capacity in which they now use Zoom. Mainly due to Zoom’s interactive features.
With Zoom, virtual meetings instantly became more personal and as close to an “in person” meeting as you can get due to the ability for participants to meet using video, as well as having the ability to share their screen, use reactions and voice and other features that make engagement easier.
As with everything though, when products are built/grow very quickly, often times, things get overlooked.
Over the last 2 years, Zoom has grown over 42%. So, it’s understandable that with such significant growth over a short period of time, some design aspects of their interface got overlooked.
If you’ve ever used Zoom, you probably have noticed that the participant window often covers up the content being shared. This primarily happens when a slide deck is being shared.
I don’t know about you, but for me, it’s pretty annoying to have to move the participant window all over the screen in order to see all of the content being presented. I actually never realized how annoying this was until the other day when I was sitting in an all day NN/g class (Effective Ideation Techniques for UX Design).
The instructor kept referencing things on the right side of the slide deck that were covered by the participant gallery window. It happened numerous times throughout the day and by the end of the class, I was fairly frustrated and remembered a quote by Don Norman (ironically, the founder of NN/g and one of the pioneers of User Experience), “Good design is actually a lot harder to notice than poor design, in part because good designs fit our needs so well that the design is invisible.”
I thought to myself, “This isn’t great UX. Why is this a thing? How can I fix this?”
This is an example of the slide deck:
As my class progressed throughout the day, I began to think more and more about this pain point in Zoom’s UI.
Keeping in the spirit of the class, I started using divergent ideation and writing down and and all ideas that could potentially solve the problem. As the day progressed, I shifted to convergent ideation and began identifying flaws in some of the initial ideas and kept narrowing down potential solutions.
After a bit of thinking, I’ve come up with two solutions:
- Send Zoom a well-articulated hand written note attached to a box of chocolates and an already built UI.
- Put together a Zoom friendly PowerPoint slide deck and share it with the world.
Improved Zoom UI
I’ve always found it odd that the participant window moves around. I truly don’t know why someone would need to move the window unless it’s on top of content they’re trying to view. Why is this window not pinned to either the top, left, or right of the screen?
That seems like the easiest problem solve. Why not add a static participant gallery section to the right of the screen? Because there are numerous screen sizes, the section could be responsive, which could make the participant gallery larger with larger screens… or, the section could be a fixed with (my recommendation) as it would be easiest to design/code for.
In the mock-up below, you will notice the participant view fits nicely in-between the top and bottom control sections. All of the various views available are also grouped together with the section the user would be altering. It’s nothing fancy, but it would allow the remaining space to be dedicated to content being shared.
You’ll also notice in the “before” version, the instructors name and LinkedIn URL are hidden by the participant gallery. Whereas in the modified version (“after”), all content is visible and fits comfortably in the dedicated content space.
Design for Zoom
Another alternative is to simply design for Zoom. This option would be a much lighter effort lift as it wouldn’t require coding/UX effort by Zoom.
I’m sure other designs have come to this conclusion already, but I’ve yet to see it implemented IRL… but, when creating a slide deck that is going to be potentially share in a Zoom meeting, why not leave space on the right of the deck that is allocated to the participant gallery and make sure your content stays within the remaining space?
It would look something like the example below. Notice how the participant galley is floating in the “before” version, but looked to be nested in the 2:9 portion of the slide deck on the right. Not only does adding a section for the participant gallery reduce visual distraction, but it also gives you guidelines for content and media placement within your slide deck.
If you want to create your own…
- Go to file, then select “New Presentation”
- Make sure your presentation is set to Widescreen (16:9)
- Insert a rectangle that is either 2:9 or 170px wide
- Remove the border and change the fill to #242424
If you don’t want to create your own, you can also download this pre-made slide deck here.
Less Features, More Usability
Zoom is a great product (one that I personally use every single day). I’ve seen its interface progress drastically over the last two years. I’ve also seen it add more and more features. However, the lack of awareness (or empathy) of content being hidden by a default view is very frustrating.
“The best products don’t focus on features, they focus on usability and functionality.” -@jashleypanterLuckily, there ARE ways to combat poor UX with creativity. Give it a try in your next Zoom meeting and tell me what you think!
Are you a fan of designing for Zoom or not?
