Simplifying Time-zones
 

This case study was conducted to understand the challenges remote teams face when trying to plan meetings with their remote workforce. Understanding time zones and presenting a visual guide to aid in the planning meetings is the core idea behind the Zang solution. 

Our Team: Avissa Noorian, Beauty Ray, Akshobhya Sharma 

Tools: Figma, Github, Sublime, Photoshop

Role: UX Researcher, UI Designer, FE Dev

Through this case study, you will follow along with my team and me in a journey of understanding the problem, designing multiple solutions, and testing each iteration. We faced many obstacles that caused us to start from scratch. We finally arrived at our idea and prototyped our solution; an all-in-one web-based platform that helps teams around the world schedule with efficiency.

The Journey:
Research
Define & Empathize
Ideate & Develop
Prototype & Test
Delivery & Future Outlook

Research

Hypothesis 

The pandemic of 2020 changed our reality dramatically. One of the most significant changes that arose from this phenomenon was the increase in the remote workforce. We took a deep dive into remote teams. 

Hypothesis: Having a tool that helps users in different time zones schedule meetings effectively can reduce cognitive loads on the user.

Proto-Persona

Behaviour/Demographics:

• 28 year old, tech savvy remote, software developer 
• Runs multiple side projects 
• Likes to maintain her own schedule
• Is in charge of her bookings, clientel and all business related decisions
  

Needs & Goals:

• To be organized and punctual
• Continuously schedule new clients
• Successfully run her freelance business
  
  

Pain Points:

• Scheduling meetings and keeping track
• Coordinating with teams
• Maintaining Deadlines and communication with clients
• Last minute bookings
• Overworking and burning out
  
  
  
  
  

Competitor Analysis 

Here is a glimpse into the current business competitors:

 

User Research

Research Plan

As researchers, we want to

• Learn how groups synchronize their online meetings with members in different time zones.
• Understand their pain points and how we can improve their experience.
  
  

Objectives

1. To understand the tools used by groups to plan, synchronize and notify each member regarding meetings or gatherings.

2. To understand the obstacles users face when scheduling meetings or gatherings.

key quotation

Key Findings

61% of our users collaborate with team members from different time zones.

Scheduling meetings to accommodate different time zones can be difficult.

About 65% of users schedule their meetings on a weekly basis. 

The majority of our users relied on Team Management Applications such as Microsoft Teams, WebEx, Google/Apple Calendar, to schedule and conduct their meetings.

Definition & Empathize
 

Empathy Map 
 

Feature Prioritization
 

We brainstormed our ideas through the I Wish, I Like, What if method voted on the best features, and organized them into a prioritization matrix.
 

User Persona 
 

Storyboard

User Journey Map

User Insight

During our user research interviews, we discovered that our users working in small remote teams have challenges coordinating meetings due to members being located in different timezones and having to use multiple different platforms.

Solution

Zang will be designed to coordinate team meetings that are distributed across multiple time zones using the "Golden Hour" feature and integrating different apps into one platform. The application will help sync itineraries in a visual and efficient manner and also provides integrations with other apps. 

Ideate & Develop

User Flow

Site Map

Wireframes

The wireframes were originally created with a video call ability, and a manual entry of team members that would allow for a demo feature without the need of signing up. This was all centered around a “temporary meeting room” that could be digitally reserved. We later learn from testing that this concept would have to be scrapped. 
 

Visualizing the Solution
 

Our first visualization of the time-zone solution would illustrate the time zones of teammates and the error message would inform users if a scheduled attempt was made during a time that another teammate was unavailable. It would also illustrate the Golden Hour for the team. 
 

Prototype & Test 

Mid-Fidelity Prototype Testing

Usability Testing Feedback

When conducted usability testing on the Mid-Fidelity Prototype, the overwhelming feedback was that our visualization does not work. It's too difficult to understand and it was back to square one. We incorporated the following changes from the feedback: 

• Demo Video
• Re-visualization of the Zang clock
• Slack Visualization 

• Rewording CTAs and copy

Iterations & Design Decisions

The Zang Clock:
It was back to the drawing board.  This time we took a traditional, analogue look for the redesign of the clock as user feedback stated that our original design looked like a calendar. Through our different sketches, we decided to go with a 24hr clock to represent the night and day difference between each member more clearly. We also added a map to represent the location visually. MOST IMPORTANTLY we removed the Golden Hour! 

Why the Golden Hour failed? 
The Golden Hour was our initial selling point. We wanted a common hour that would show in a visual format that all members can book meetings in. Sounds great, right? However! When we went over the design mechanics of how such a solution would work, we came across two issues.

Firstly, each member would have to manually enter their "office hours" or a time frame that is a minimum of 8 hours. The golden hour would be the overlapping time frames. It would demand labouring work from users to set up and enter the data. It would also require all members to sign up for Zang in which case the application would be obsolete if only one of the members of the team were not registered. 

Secondly, if one or more of the members just happened to be exactly on the opposite side of the world, you would never get a time frame that would overlap. One or more persons would have to accommodate in which case many variables appeared and once again required manual entry. The more members that were in a group the more difficult it would be. 

Unless there was an algorithm that takes care of the office hour entry in the back-end, this solution required more work from the user than simply not using the application. Thus, we scrapped the Golden hour idea. 

Before

After

In the redesign, we made the meeting window adjustable through a slider on the top right. The revised solution allowed the user to enter a name and location with the desired time frame. Once that data was in, you can drag a frame around the clock and see the frame move with respect to other members' time zones. You can then see the appropriate time for each member at once. 

The Demo Video:
As per user feedback, we added a demo video displaying the features available on Zang thereby making it a more user-friendly interface. 

User Testing - Round 2

User testing revealed a better understanding of the clock by our users. 

A/B Testing

One iteration that we have made was changing the content of the page.

Preference Testing of the Clock face
 

We tested our 24-hour clock iteration to determine whether to start from 01 or 13. Results were close but displayed a  0.04 point increase in difficulty in Version A. 

Version A

Version B

Integrating Zang

We needed the application to be integratable with all popular web tools for the task and team management.

Zang Dashboard viewing connected integrations 

Zang Dashboard viewing the Google calendar Integration 
 

Through the Zang dashboard, you can view your applications, and you can view the Zang clock on your applications and vote on meeting times with your team.

Viewing Zang integrated into slack

Hi-Fidelity
 

FE Development

Heat Map

We used Github to store our pages and deploy them on the Github environment.

Style Guide

Heat map of the main dashboard tested to visualize user’s experience, taken through Hotjar.

Delivery & Future Outlook

Conclusion & Final Thoughts

Time-zones get difficult to visualize the more people you are trying to coordinate with. By providing visual assistance, we help ease the cognitive load while coordinating with people spread across multiple time zones. The more we tested our solution, the more we narrowed our focus and simplified our idea. In presenting our case study we found that many were enthusiastic about this solution.

Our future plans for Zang include:

• Improving the features
• Understanding the schedule mechanic
• Creative automation algorithm for meetings, emails, etc.
• Making a centralized dashboard for all your apps so that collaboration is easier for remote teams.