Project Overview

Zoom is one of the industry-leading video communication tool. Under the situation of COVID-19 out break, the video conference market has been vastly growing. Besides work and acedemic use, Zoom is also serving as a platform for virtual events that connects people over the world. In this project, Zoom wants to introduce a social feature that improves users' social engagement in and retention in the app.

Goals

a. Examine the current user pain points when attending virtual events via Zoom.

b. Design a social feature that embeds within the current Zoom platform to solve the pain point and improve social engagement.

What I discovered

What I did

Goal 1

Users need a way to form a discussion group (either with 1 person or a group of people) without disturbing the on-going event.

Goal 2

Users need a way to better interact with others without disturbing the on-going event.

Goal 3

Users need a better way of talking to the event host/speaker.

View Prototype

Research

What's the Market Trend?

I started my research on the current video communication market first, and followed up with analyzing the market trends and opportunities. I wanted to know where does Zoom stand in the video communication market? Who are the competitors? Who are our target users? I gathered information of 4 other competitor apps (Google Meet, Microsoft Teams, Whereby, and Discord), and analyze their strength and weakness and most featured functionalities.

How would our users use the feature?

Based on the research results, I started to sketch out designs that fulfills user goals, as well as designing flows that the target group of users will experience with the new feature.

This is John, a young professional who has been regularly attending virtual events and sessions with his colleagues and friends, and keep in touch with others via video communication tools since pandemic outbreak. Here is his story of attending virtual events with friends and using the Zoom Discussion Group feature.

Along the storyboard, I marked out several problems that the users will encounter with the current Zoom app. I followed up with ideas and opportunities that will be helpful solving these frustrations and create a smoothier and more engaging user experience.

What should be in this new feature?

After having a clear idea of the market trends and target user flows, I created the feature roadmap to include all the features and functionalities that will lead to a better user experience.

Designs

When coming into the designs, I wanted to design the feature that fulfill the 3 user goals while also maintain the currently Zoom design style. The design should be intuitive, accurate, and easy to learn. The new users should find it straigh-forward and easy to understand, while the more experienced users should find it familiar and consistent with the original Zoom designs.

Sketches

Before jumpping into the wireframe and prototypes, I sketched out several ideas of designs that fulfill different goals. I wanted to find out the most solid idea that is well-rounded yet simple.

There are ideas that went along well with others (for example, 1 and 2 under Goal 1 board). They display the possibility that users are able to form groups through multiple ways (by add user to the list, or by directly invite a user, etc). However, due to the time limit of this project, I'll only be able to accomplish one or two of them, and these will go to the "good to have/can come later" category in the Roadmap and accomplished in the future.

For Goal 3 (Users need a better way to talk to the host/speaker), I was also debating between having a "Raise Hand" or a "Question Board". I followed up a question with my research participants, asking what kind of interaction do they conduct with the host/speaker during the events. The result shows, the request of interaction can be emergent sometimes, and the content of interaction does not limit to Q&A. So I decided to choose "Raise Hands" instead of "Question Board".

Wireflow

After made decisions on the sketches and designs, I wanted to create wireflows to better convey the flows and behaviour patterns that users will experience when using the new Discussion Group feature.

Based on the goals, I divided the flows into 3 parts: when users forming a discussion group, when users are in a discussion group and interacting with others, and when users wanted to interact with the host/speaker.

Prototype

For the prototoype, I created mid-fi UI set following the current Zoom design guide, and integrated the additional feature into the existing Zoom UI.

Testing

After finishing the first iteration of the Discussion Group, I started Usability Test with 4 testers using the mid-fi desktop version Zoom Discussion Group prototype. I set up several scenarios and tasks for the testers to see if there are any problems or confusions come up at any point during the flow. I also wanted to see how new users and experienced Zoom users recognize the new features and if they can easily pick up the feature and make use of it.

Here is the Affinity Map that I created after synthsized the results and feedbacks.

Based on the feedback from Usability Test, I made changes as listed below to the prototype:

The Final Result

Here is the final result after the iteration, both testers with minimal experience of Zoom and experienced Zoom users are able to smoothly use the add-on feature and meet their goals.

After the project

Reflections and chanllenges

Creating new features for an existing app is no doubtly an challenging but exciting journey! It is an eye-opening experience to work with existing design system as big as Zoom. I get to see their organized and well considered design guidelines, and thinking how I will be able to create consistent designs and UIs that can be well embedded into the current app.

The biggest challenge for me is to create this consistency from both UX and UI side. For UX, I need to analyze the original designs and see their task flows and logic behind the designs. For UI, I have to consider the color usage, shapes, fonts, etc. I wanted to create a experience as close to the original as possible.

Next Steps

Thanks for the reading!