Background

Navigating Life Through a Computer Screen

Over the past months, nearly every social experience has gone digital. The COVID-19 pandemic has forced us to experience life through our computer screens, ultimately serving as yet another reminder of our reliance on technology. With the sudden demand for web-based communication, Zoom has emerged as the primary video-conferencing platform on a global scale. Because of its widespread use, we wanted to research user’s experiences and see if there were any potential areas for improvement.

Through the course of 6 weeks, our team navigated through the entire design process, starting with research and working our way through ideation, creation, and prototyping. All of our work and collaboration was done through Figma, while group communication was primarily organized through Slack and further discussed over Zoom meetings. By updating the interface and introducing new features like a calendar page and group function, our efforts lead us to a high-fidelity prototype that we presented to both our cohort and a panel of judges on Presentation Day.

Meet the Team

Problem Statement + Guiding Question

Based on data collected from our research, we created a problem statement that summarized the issues that needed to be addressed and improved upon:

“Zoom users find themselves using external resources to manage and create their meetings because the current zoom desktop application doesn’t offer the necessary features to create a cohesive experience.”

In conjunction with our problem statement, we formulated a guiding question that would help lead us through our design process:

“How might we create a Zoom experience that centralizes and simplifies the invitation process?”

The Process

6 Week Sprint

Our entire project was conducted within a six-week-long design sprint where we followed the entire design process, from the initial research phase all the way through final user testing of a completed prototype.

Research

Analyzing Zoom’s competitors

User Survey and User Interviews

In order to narrow down which aspects of Zoom needed updating and to specify our target audience, we needed to pinpoint potential areas for growth and, more importantly, identify existing user pain points. To do so, we relied on two methods to gather this data: a survey and user interviews.

Our research began with a survey that we created through Qualtrics, which was then sent out electronically and taken by users from a variety of backgrounds. We included questions about Zoom’s feasibility, their purposes of use for the application, and how often they both schedule and participate in meetings. We received over 80 responses, primarily from college students and working professionals in fields like higher education, which we used to gauge and construct a general overview of the user experience. From the data collected, there were a couple of key points:

  • 91% access Zoom through use the desktop application rather than a mobile/tablet version or dial-in option
  • 83% rated the experience of joining a meeting a “2 out of 5” or below
  • 74% rated the experience of inviting participants to a meeting a “2 out of 5” or below

Continuing with our research, we conducted around seven virtual user interviews. Because the majority of respondents from our survey used Zoom in an educational setting or one associated with education, we interviewed people in academia in order to narrow down our audience. Through these interactions, we gained valuable insights regarding how users currently navigate through the Zoom application and were able to identify more specific pain points. These were the areas of concern that came up for all participants:

  • Issues finding meeting links
  • Difficulty with visualizing and keeping track of meetings
  • Frustration with having to exit the application to manually invite people

We used an affinity mapping activity in which we wrote out our findings and organized each thought into specific categories. We then voted on the points that were most frequently brought up and mentioned throughout the research phase, which is marked by the blue dots. This helped us identify key takeaways and areas of concern, as well as other questions that we could refer back to as we began designing.

Our key takeaways from both our survey and interviews were that most of Zoom’s current features aren’t utilized, both processes of joining and creating meetings are too complex, and lastly, users rely on outside platforms to manage their zoom information. We also concluded from the majority of users in academia that Zoom was an essential tool in education, which allowed us to specify an audience and therefore create relevant solutions. Additionally, the majority of users from our research indicated a strong preference toward Zoom’s desktop application over mobile.

All of the data from our research phase was used to develop our problem statement, as well as inform our design decisions moving forward.

Ideation

Sketches and Lo-Fi Prototyping

After synthesizing our data, we each began a round of wireframe sketching in order to visualize any ideas we had, which were very much influenced by the insights we gained from the survey and interviews. After some discussion, our team agreed to incorporate key features in all of our sketches, like three main tabs in the navigation bar: home, calendar, and contacts. These sketches are shown in yellow, and we used them to determine how we should move forward with our project. We then converted the sketches into a lo-fi prototype that would allow our team to test the basic functionality and flow of our ideas. In other words, it helped us visualize, again, at a very basic level, whether or not our ideas were cohesive and created a setting that addressed our users’ pain points. While we based our first round of lo-fi prototyping on these initial sketches, we ended up returning to the sketching phase after we felt that our many features were complicating the process instead of simplifying it. In our second round of sketches (shown in blue) we eliminated the “contact” system and simplified other features.

Prototyping

Mid-Fi and User testing

After completing our lo-fi wireframes, we began prototyping a mid-fi version of the design, in order to conduct user testing to see if our designs were actually effective. Once our mid-fi design was fully prototyped, we began user testing by interviewing current Zoom users to implement in hi-fi. We found consistent confusion with the purpose of certain buttons such as the “sync” button, as well as the titles of the meeting creation buttons. Users also expressed dissatisfaction with the amount of white space which dictated our visual decisions for the background of our redesign to deviate away from the original design conventions of Zoom.

However, users did feel that the process of creating a meeting was simpler and more intuitive which means that generally, our information architecture and user flow were established successfully during our lo-fi stage. From the user testing feedback, these are the key changes we implemented in the final iterations of our designs:

  • Changing the button layout and homepage significantly to display the hierarchy of the content in a clear, direct way
  • Changed the location of the “sync” feature
  • Visual background for the entire application

Final Solution

High fidelity Prototype

1. Centralized Home Dock

We included the most essential features and information on the home page, visible to the user the moment they open the application. To address the unfavorable “white space” issue, we made the background customizable so that the user has the option to make their zoom experience more personal. Users can click on a meeting to expand the meeting details and easily join the meeting through the join button on the sides.

2. Notifications

This notification feature alerts users of reminders for upcoming meetings and verification of additional actions. While notifications first show up after they occur in real-time, they are logged in to the notification icon that sits right next to the profile icon in the top right corner. This feature was created to solve the user pain points of users forgetting about meetings and also feasibility to understand.

3. Sync

The “Sync” feature allows users to sync to an institution or email, which means that the meetings from a synced institution or email will automatically be stored in the participant’s upcoming meetings panel. The user will be able to easily access these meetings right from their zoom application without the need to retrieve a link from elsewhere. In addition, email address databases from the institution will be synced to autosuggest when the user begins typing a matching email address or name.

4. Groups

Through our research, we found that there are many instances where users frequently create meetings with the same groups of people regularly. To make it easier to organize these contacts and add them to meetings, we created the option to add all of these individuals to a single group card. Once named, the user can easily type in the group name when scheduling a meeting to automatically add all of the members that are part of the group. All groups have their own unique info card that has a customizable group profile picture, the group name, a description of the group, and the contact information of each member (visible once the group card is expanded).

5. Process of Scheduling a Meeting

When inviting individuals during “schedule meeting”, all users will have to do is type in names and auto-suggest will do the rest based on the synced institution database. Grouping individuals together allows for the user to add multiple people under one name rather than adding them individually. Users will no longer have to exit the application to add participants or share links because it will be added to the participants’ upcoming meetings list on their own home page as well as the participant receiving an invite email (the one associated with their contact info) as further documentation of the new meeting information.

6. Calendar

The calendar page serves as a more visual representation of their meeting schedule, and on a much larger scale since users can see all of their upcoming meetings for the entire month. Users have the option to filter which meetings are visible based on their institutions along with interacting with the meetings on the calendar. When they click on a meeting, its information appears on the right of the calendar, where they can easily view its details. If a meeting host clicks on a meeting that they created, they have the ability to edit the meeting details and easily remove/add participants. Additionally, users can also quickly schedule meetings from the calendar page after taking a good look at their monthly schedule and visualizing the most opportune dates/times.

Wrapping Up

Takeaways

At the end of the six weeks, our team came out with more design experience and knowledge than we had at the start. For most of us, it was even the first time following the design sprint model and working with a team on a big project such as this. While all of us gained valuable skills in conducting research and prototyping with design tools like Figma, we also learned essential details about the design process that we did not know before:

  • The design process is not linear
  • Design is heavily influenced by feedback from users and design critiques

At a glance, the design process may seem like an easy model to follow, where one moves easily from point A to point B and so on. As our team navigated through the sprint, however, we quickly found ourselves rethinking and reshaping the design. We would often revisit and discuss past steps and decisions, like when we scrapped our first lo-fi prototype and went back to the drawing board in search of a more intuitive solution. This goes hand in hand with our other key takeaway, which highlighted the fact that good design must draw inspiration from the users themselves. Feedback from user testing and critiques from our peers played a large role in informing our design decisions and changing the direction of our project as a whole. As designers, we can sometimes fall into the trap of creating solutions on behalf of users, but our project reminded us of how important it is to directly connect with those that you are designing for.

Moving Forward

After weeks of research, planning, prototyping, and virtual teamwork sessions, we were able to present our project to our cohort group on Presentation Day. While we were proud of what we had accomplished regardless of the outcome, our efforts paid off, as our team was awarded “Best Prototype”. Due to the time constraints, we could not explore and implement all of our ideas, but further development of our interface would include features like dark mode and other areas for users to customize and make the Zoom application more personal. Additionally, we would have also liked to redesign the mobile version of Zoom, because although it isn’t heavily used, it’s still an integral part of accessibility.

We are grateful for the opportunity to take on a project that explored a system that plays such an integral role in our lives, and the lives of millions of others, during this period of quarantine. Our redesign reminded our team of the potential that exists in solving design-related problems and has made all of us excited to see how virtual communication systems like Zoom will evolve in the future.

Link to full prototype:

https://drive.google.com/file/d/1N2Fl9bRNcaEimGr0NbxNShJG4o86CNss/view

We’re a student-run design consultancy @ UC Davis!