UX research, UX Design
UX Designer
52 hrs
Prototype
As an avid user of WhatsApp, I always had a wishlist of features for the app. My training in UX UI bootcamp gave me a tool to materialize some of these wishes. The three main ideas I had were:
Adding Event planning capability within WhatsApp
Adding pinning capability
Anonymous voting while using the embedded poll feature
My other motivation for working on this project was impact. Knowing that WhatsApp has over 2 billion users globally, of which 25% live in my immediate community here in the US, I assumed that any positive change would have a noticeable magnitude of positive impact on the user’s experience.
It was reassuring to see that WhatsApp launched a feature similar to the one I had proposed just a few weeks after I had completed my project. This confirmed that the problem I was solving was legitimate and that my research was aligned with the company's goals.
The start point of this project and to gain direction on which idea to focus on, my approach was a mix of research and sketching on lo-fidelity prototypes
Before proceeding with any research, I created a few flows on paper for each idea to help me imagine its approximate feasibility. All ideas looked good on paper.
I talked to 7 adults, ages 23-43, five experienced and two less experienced cooks to understand their regular frustrations when meal planning, their tools, and their expectations.
Based on these results, all the competitors I chose already had pinning features while none had event planning, and only one offered a poll feature at all.
As the research unfolded, it became clear: crafting a pinning feature for WhatsApp stood out as the top priority, promising enhanced communication and engagement.
WhatsApp is the only app without pinning feature
40% of users struggle with locating important information
80% of the users seek faster message retrieval methods
To determine the optimal placement for the new pin feature, I reverse-engineered the app's navigation flow, then designed user flows for imaginary users Lindsay and Sven, ultimately nesting the pin option among the press-and-hold options on a published message.
To ensure my testing screens mirrored reality, I crafted a comprehensive style guide to steer my typography, colors, and design elements.
Colors: I used Figma color tool
Typography: I used Whatfont font recognition tool and Tracing method
Elements & Styling: tracing method
My testers were 9 adults ages between 26-49. I tested three possible scenarios where users will interact with the pin feature:
Task 1: Pinning a specific message
Task 2: Finding all pinned messages on a thread
Task 3: Unpinning a message
Task completion time was reduced by 50% from task 1 to task 2, followed by another 20% reduction from task 2 to task 3
90% of testers successfully found the happy path and accomplished the tasks
100% of the testers agreed that the testing screens match their expectations of the actual app very well
After completing each task, 30% of the testers mentioned what they intuitively expected to do next, which aligned with what I had in my testing plan. I found this noteworthy
I had only designed screens for iOS users and did not consider this when recruiting testers, and had 3 Android users in the group:
This created a hiccup during the first task since Whatsapp Android's interfaces differ from iOS
Turning the challenge into an opportunity, I tested the feature's learnability with novice users. Initially, they struggled with task 1, but once they got the hang of it, tasks 2 and 3 were a breeze. This confirmed that my design was intuitive and user-friendly
Pin alert placement: The "Pin notification" button was initially placed opposite to the "Scroll" button. However, during testing, 20% of participants got confused because the two buttons looked similar but functioned differently. One button opened a new page, while the other scrolled down to the end
Before:
After:
Add a scenario: Only allow admins or authorized members to delete pinned messages in group chats. It avoids confusion and misuse. Created admin vs. non-admin views on the pin board screen.
Member view: can only unpin
own message
Admin view: can unpin all
messages
Wipe confusion: between the “Unpin” and “Delete” options during task 3
Before:
After:
This will require a new round of testing due to the significant differences in the app flow compared to iOS
To help summarizing the highlights in a long conversation thread
To explore the possibility of pinning a message simultaneously with publishing
Design all the screens in dark mode to include this group of users
-1.png)
