Case study: Introducing Chat Tabs for WhatsApp
A personal project featuring a new way to find, organize and manage chats in WhatsApp
Introduction
WhatsApp is a widely-used messaging app that enables users to send messages, photos, and videos to other users around the world. As of 2021, WhatsApp has over 2 billion active users, making it one of the most popular messaging apps in the world. Users of all age groups, ethnicities, cultures and socio-economic backgrounds engage with this app. A lot of Businesses use WhatsApp as a tool to connect with their customers and their employees as well.
However, as the number of chats in a user’s chat list grows, it can become arduous to find and manage specific chats. A typical user would have an extensive list of chats, some which have not been interacted with for years. To add to this, the number of chats initiated by business also coexist within this space. This can be especially challenging for users who have a large number of chats with friends, family, colleagues, and businesses.
Understanding the problem
User Research:
Survey
A predetermined set of questions was used to interview a sample size of 10 users. The users age ranged from 16–54 and were from different professions. Users from a metro as well as a tier 2 city in India were interviewed.
What do people use WhatsApp for?
People typically use the app for a myriad of reasons. The following are broad categorizations of its uses:
- To keep in touch with friends and family
- To engage with co-working professionals
- To engage with businesses
Key insights
Through my research I found that some issues were recurrent amongst users, which led me to these insights:
- Organization of chats: Users were frustrated with the long list of chats and wanted better organization. This is because the chats they want to engage with regularly get lost amidst a sea of less important ones.
- More Control and Customization: Users felt the need for more control over chats and notifications. They feel the existing options provided are not enough for their use.
- Time spent in searching: Users tend to scroll through chat lists to find desired chats, wasting time and repeating the process multiple times a day. Despite the search option being available, users often resort to it only after trying to find chats through scrolling.
Problem statement
From the above data, it is evident that most users have a long list of chats that is very unorganized. Some users find it difficult to navigate to certain chats. Users would also like more control of their chats without having to individually manage them.
How might we design a feature that allows users to find, manage and organize their chats in WhatsApp, without disrupting the normal user flow, in an easy and efficient manner?
Introducing Chat tabs
What is a Chat tab?
A list of chats and groups which help the user to better organize and interact with the chat interface on WhatsApp.
A series of tabs make up the chat tab carousel, which can be edited and customized as per the user’s liking.
Note: The default WhatsApp chat list remains unchanged. This feature is meant to enhance the chat experience without disrupting it’s current flow.
Why is this useful?
- Improved chat organization: Users can organize their chats by category, which could make it easier for them to find and categorize as per their requirements. This could be particularly useful for users who have a large number of chats with friends, family, colleagues, and businesses.
- Quick Access: With chats organized as per the user’s preference, they can quickly access different chats by using the Tab bar.
- Customizability: Allows users to customize the notification settings for different chat groups, which could help them to better manage their chat notifications and avoid being overwhelmed by constant notifications. This could be particularly useful for users who have a large number of active chats.
- Enhanced collaboration: Businesses or team leaders could use this to facilitate communication and collaboration. For example, they could create different chat tabs for different sets of customers or projects. Thereby, helping them keep track of various stakeholders in different contexts in an organized and efficient manner.
Target users
This feature will be useful for users who:
- Frequently interact with a set of chats
- Interact with a set of chats differently from another set
- Temporarily have to interact with a set of chats
- Want to categorize chats and customize notifications for personal reasons
Iterations
While iterating on various design options, I had to consider the following:
How do I design new features using the same WhatsApp design philosophy and enhance the user experience?
How can I not force the user to use the feature, but make it quickly accessible when they need it most?
How do I provide options for more control and customizability without confusing the user?
Personally, coming from an architectural background, I am used to quickly sketching out my thoughts on a piece of paper as it allows me to quickly iterate and get my ideas out onto a tangible medium.
Anatomy of the Chat Tab carousel
The carousel is made of three constituents:
- Default chat list icon: This tab is pinned as the first tab in the carousel and cannot be rearranged. Under this tab, the user can access the default WhatsApp chat list, i.e., the normal list of chats you see when you first open WhatsApp. When a different chat tab is in use, the user can press this icon to return to the default chat list at any time.
- Created chat tabs: To the right of the default chat list icon are the created chat tabs. The unread messages in a chat tab appear next to the name of the tab as a number. These chat tabs contain chats as per the user’s preference and are arranged in chronological order, akin to the default chat list.
- The order of these tabs can be rearranged as per the user’s liking.
- The chat list can be edited by adding/ subtracting contacts and groups from the list.
3. ‘Plus’ button: The button is pinned to the right of the last chat tab so that the user can create a new tab quickly.
Different states of a tab:
The default tab doesn’t show the number of unread messages as the data point is already provided in Upper ‘Chats’ tab bar.
Using Chat Tabs
User Flow:
- To access Chat Tabs: A hidden carousel is used so as to not hinder the normal user flow of WhatsApp, but rather enhance it. Thus, users are not forced to use the feature but can avail of it easily if they require it at any time.
Note: Archived chats is moved under the three dots menu at the top right corner of the screen.
- To create a new Chat tab:
A new tab can also be created by long pressing on any tab and pressing the ‘plus’ button in the options at the top of the screen.
- To edit a Chat Tab:
- To rearrange the order of tabs:
This allows users to customize tabs in the carousel in the order of their preference.
Pinning chats
Users want to be able to pin more chats
Presently, WhatsApp allows for a user to pin a maximum of three chats. According to my user research, most people wanted the ability to pin more chats. However, doing this on the main chat list will hinder the visibility of the unread messages below it.
To solve this problem, a user a can now pin a maximum of three chats in each Chat Tab. This increases the number of pinned chats overall, while also maintaining the same pinning limit principle in each Chat Tab.
Custom Mute:
Users want the ability to customize the mute duration as per their requirements.
In order to mute a chat, a user is presented with 3 options: To mute for 8 hours, 1 day, or always. With Custom mute, a user can now mute a Tab for any time period they choose.
For example, Rekha has created a Chat Tab with chats and groups related to work. She only wants to receive notifications from this set of contacts between 9 AM and 6 PM every day. She can now custom mute the Chat Tab to mute notifications between a given timeframe every day.
Set Time and frequency: Set the desired period of time between which messages will be muted. Switch on the ‘All-day’ option if the desired duration if for the entire day. Next, select the ‘Repeat’ option if the mute action has to repeat with a desired frequency.
Repeat:
On selecting the ‘Repeat’ option, the user can choose between 3 different options of frequency for the Mute action:
- Repeat Daily: The Mute action will repeat according ton the interval of days selected. The user can choose to repeat the mute action Daily, after 2 days, 7 days, etc.
- Repeat Weekly: The Mute action will repeat according to selected days of the week. It can also be repeated every week if the user desires.
- Repeat Monthly: The Mute action will repeat according to selected days of the same or different calendar month.
After executing Custom Mute:
The tab that has been muted will be displayed with the Mute icon next to the name of the Tab. The icon will be active when the Mute action is in play, which informs users that the Tab is actively muted. When the Mute action is not active, the Tab will go back to its normal state without the Mute icon.
Forwarding messages
Currently, when a user wants to forward a message, they must individually select the recipients by manually selecting each chat they want to forward the message to. This can be time-consuming, especially if the user frequently sends messages to the same set of chats and the chats are not in a sequential order of their preference.
To make this process quicker, the Chat Tabs carousel appears at the top of the forward messages screen. This allows the user to quickly toggle between different tabs and either select all or select individual chats across multiple tabs.
If a contact or group in a tab is selected: The contact or group remains in the selected state even in the default chat list, so that the message doesn’t get sent twice.
Key takeaways:
Learnings:
- In a sample of 2 billion active users, there are both general and niche user groups. But the size of niche groups is so large that it’s important to design features keeping them in mind.
- You can learn a lot by observing how a user interacts with an app, sometimes the best answers to your questions are unspoken ones.
- When designing a new feature for an already established app, it is very important to retain familiarity for the user.
Challenges:
- Even after many iterations, sometimes you feel stuck and waver from the original intent. Addressing the core problems is absolutely essential.
- Days after designing a feature, sometimes I thought of a much better solution and wondered why it never dawned on me earlier. This resulted in going back to the drawing board multiple times.
Overall, I loved working on this project as I use WhatsApp avidly. Gradually, I became more confident at rendering solutions with logical reasoning although the tasks seemed intimidating at first. By spending a lot of time recreating screens and analyzing the app, I came to realize and appreciate certain design decisions that were made by those at WhatsApp.
You can find me on LinkedIn and Twitter if you want to discuss further :)
Spam the 👏 button if you liked my work.
Check out my other case study: