Creating a new feature to organise WhatsApp communications
4 days | Hi-fi prototyping | Ironhack UX-UI Design Bootcamp
Corona-quarantine is leaving you locked down at home with your smartphone as the remaining device connecting you to the outside world. Yes, more than ever, your WhatsApp chat feed is exploding, packed with communications of all natures: friends and family checking on your health, bored acquaintances madly posting on hobby groups, work colleagues in home office struggling with video-conference systems, and even recently-converted smartphone users (never texted so much with your grandma?…).
What about a feature that helps you organise your WhatsApp feed?
At IronHack UX-UI Design Bootcamp, I had 4 days to make a high fidelity prototype for one userflow of this feature. Challenge accepted!
→ Let me introduce you to the Marie Kondo feature ;)
I will guide you through the process that led to the userflow that I designed for iOS. I created the wireframes on Sketch, did the prototyping on InVision with Craft plugin and documented all steps and source files in Notion.
A few key figures
WhatsApp counts 2 billion users* worldwide in February 2020. 100 million voice calls and more than 65 billion text messages are exchanged via the app every day. In April 2020 WhatsApp introduced a new limit on forwarding message to fight the spread of disinformation. This is in line with 2019’s effort to limit exchanges by preventing users from forwarding a message to more than five users at once.
But what problems do the users face?
I conducted 5 interviews and compiled them into an affinity diagram to highlight the main usage habits and pains encountered. It disclosed 3 common patterns and the problem statement:
- Disturbances caused by group communications: participants of some groups are sometimes even unknown to the user or start a bilateral conversation “spamming” them.
- Answering pattern: users set up push-up notifications, check the sender and 3 first sentences of the message on the notification upon or after reception and decide whether they would like to answer right away.
- No or late reply due to the context: voice messages, and longer or more sensitive messages require the right context or more time to be answered.
I summarised these into the following problem statement:
Users forget to answer important messages that get lost into the chat feed when they could not be read nor answered right away upon reception.
Applying the 5 WHYs method, I identified that the underlying cause of the problem is that WhatsApp's chat feed is organised chronologically.
In parallel, I also compiled these findings using the Jobs-to-be-Done methodology:
How does the feature fit into the current UX?
After defining the major traits of my persona Melany, 34 years, the sociable digital marketing freelancer, I worked on one user story and its userflow (happy path).
After a successful meeting, Melany decides to separate her business contacts and groups from the rest of her chats. Melany uses her smartphone and WhatsApp account for both business and private purposes. Her business conversations often get lost in the high volume of private messages which causes her a loss of time. She decides to separate her business contacts and groups from the rest of her chats. The corresponding useflow is as follows:
I sketched low-fidelity wireframes in InVision Freehand which I turned into a prototype. I realized some tests with sample users and they led to the following iterations:
- Feature name: before the tests, I short-listed 3 possible names: Label, Category and Folder. Influenced by Gmail, I opted for “Label”. During testing, users did not find it self-explanatory and were spontaneously looking for “Folder”.
- Button location: I initially included the feature below “Broadcasting list” in the current navigation. Users were more successful finding it under “Group”, probably because they are more used to creating Groups than Broadcasting lists (they asked on several occasions what this was).
After some iterations of the high-fidelity prototype …
I created the hi-fi wireframes on Sketch and exported the prototype to InVision using Craft plugin. The testing highlighted the following crucial finding:
- Buttons “Cancel” / “Back” / “Skip” in Navigation: the feature enables creating a folder and placing both contacts and groups in it. Users pointed out that they would like to isolate some groups from the rest of their feed. Therefore the possibility to create a folder with groups only (and no contact) should exist, as well as the possibility to create a Folder with contacts only. Consequently, I included a “Skip” button in the "Add Groups" & "Add Contacts" screens. I also refined the use of “Cancel” and “Back”, deciding that the user always needs the possibility to go all the way back to the initial screen dedicated to “Create Folder”.
- User feedback when selecting Contacts & Groups: Once the user is in “Add Group”, I included a feedback displaying the name of the Folder and the Contacts already added. In the last screen of the user flow (after the action is completed), I included a separating bar with the headline "All conversations" where all the unclassified chats are classified by default.
This is the prototype corresponding to the userflow presented:
What’s next?
I will work further on the chat feed section with extended userflows including unhappy paths and the creation of additional "Folders". I will develop and test the following options pointed out by testers:
- configuring the number of conversations displayed in each folder (by minimizing or hiding conversations);
- configuring the order in which the folders appear in the chat feed;
- hide or display some folders according to the week-days (e.g. the Business folder should not be on top of the feed during week-ends).
I will work accordingly on the Settings section as well.
I then quickly need to develop an Android version given that most WhatsApp users use it. This may require consequent adaptation as the Material Design rules are quite different from iOS.
Always learning :)
During this process I learnt how important it is to make an inventory of all buttons and their instances before starting the hi-fi prototyping. I can then build up only the ones that are necessary for hi-fi. This saves precious time. I enjoyed structuring my documentation on Notion and using its Kanban template to organize my tasks over this short project period. I confirmed (again) how insightful and unexpected user feedbacks are. I especially enjoyed conducting interviews, tests and designing iteratively based on users’ inputs.
Sources:https://techcrunch.com/2020/02/12/whatsapp-hits-2-billion-users-up-from-1-5-billion-2-years-ago/
https://techcrunch.com/2020/04/07/whatsapp-rolls-out-new-limit-on-message-forwards/
