Messaging apps have seamlessly integrated into our communication habits. While their convenience and connectivity have undeniable benefits, messaging apps can be distracting, sometimes leading to losing focus and productivity. One potential solution is the Focus Mode concept, a presumptive WhatsApp feature that allows users to temporarily restrict incoming messages, granting access only to selected contacts.

My role

In March 2020, I participated in a solo design challenge where the objective was to identify a daily problem and create a digital solution within a two-week timeframe. Taking on the role of a UX designer, I chose to address an issue of a friend who struggled to disconnect from WhatsApp notifications when facing important projects. To tackle this problem, I used design tools such as Sketch and InVision to develop a user-centered solution.

Problem

Full withdrawal and societal comfort are mutually incompatible

Disabling all messaging app notifications may not be effective due to several reasons. Firstly, it can lead to a fear of missing important messages or updates, causing anxiety and a constant need to check the apps manually. Secondly, it may create a sense of disconnection from close social circles and a fear of being out of the loop. Lastly, some people rely on messaging apps for work-related or time-sensitive communication, making it challenging to completely disable notifications without impacting their productivity or responsibilities.

First research steps

Having an idea but still without a solid understanding where it might lead me, I started a research phase and conducted a survey with 21 participants to understand for whom and in which context I will be designing for. First of all, I wanted to understand the behavioural patterns, and here what I learned:

To understand why people would need to disable incoming messages, I made a parallel with a WhatsApp feature Mute and asked if the participants use it and why. The survey showed that 95.2% used the Mute feature (33.3% often used it, 23,8% used it sometimes, and 38.1% rarely used it). The reasons are the following:

I questioned whether the Mute feature in WhatsApp is a sufficient solution for maintaining focus. However, it falls short. While muting a person or group prevents notification sounds, users can still see message counts, sender names, and partial message content. The constant display of new messages can lead to distraction. Inquiring about the participants' feelings when not responding to others, common adjectives used to describe their emotions included indifference, anxiety, negativity, rudeness, okay, and guilt.

When asking participants about the reasons for not deleting WhatsApp, the top three factors that emerged were: the necessity to stay connected with work and study groups, the fear of missing important information and losing memories from existing chats, and the convenience it provides for communicating with family and friends, especially across different countries.

Ideation process

Before we start with the ideation process, let’s try to put on Frankie’s shoes:

Finding a sweet spot

I believed that placing the feature in a highly visible position wouldn't be beneficial for users. It would create a constant temptation to activate or deactivate the mode to check for new messages. Instead, I chose to locate it within WhatsApp Settings. To demonstrate this, I created a user flow illustrating how to navigate to the feature.

Design & testing

Using pen and paper, I sketched low-fidelity wireframes to showcase the functionality of the feature. Moving forward, I transformed these wireframes into a digital format using Sketch, bringing them to life with more detail and interactivity.

Usability testing change #1

Usability testing change #2

Final design

ACTIVATE FOCUS MODE TO STAY CONCENTRATED

CUSTOMISE FOCUS MODE BY CHOOSING CONTACTS AND GROUPS YOU WANT TO GET MESSAGES FROM

SELECT A TIME FRAME & SET AN AUTOMATIC MESSAGE TO KEEP OTHERS INFORMED WHEN YOU ARE BACK

SEE WHO HAS FOCUS MODE ON RIGHT NOW

Reflection

Adhering to existing design scheme

One of the new things for me was implementing the feature to the already established interface by following its existing design scheme. Whenever I was putting text or menu items, I always searched for similar patterns in the app to understand how product would do it. For example, instead of letting the users insert a specific date to indicate the end of Focus Mode, I had to offer a limited set of time frame options to choose from.

Adding a human touch with storyboarding

I have never storyboarded before, but this was a nice way to put a human face on the research problem and communicate the design solution. It just makes it easier to relate yourself to the user you design for when you fulfill the character with emotions and life.

Final thoughts

Digital well-being is like a healthy diet. We can cut all kinds of fatty food but it’s not always the best way to get fit if some fats are actually healthy. Being able to control content instead of deactivating it completely can sometimes be a more harmonious way to balance online presence with real life.

More projects