Case study: UX flaws in WhatsApp that nobody is talking about

whatsapp redesign cover

When you get to a point in your life where you realize this is not what you want, it’s time for a redesign

-Lynn Louise Wonders

Although WhatsApp doesn’t need any introduction but still here is some brief about it: WhatsApp Messenger, or simply WhatsApp, is an American freeware, cross-platform centralized messaging and voice-over-IP (VoIP) service owned by Facebook, that allows users to send text messages and voice messages make voice and video calls, and share images, documents, user locations, and other content.

WhatsApp has become an integral part of our daily life. In January 2020, WhatsApp registers over 5 billion installs on Google Play Store making it only the second non-Google app to achieve this milestone.

Therefore, identifying problems in a well-functioning system was the real challenge because Everyone knows how to fix a bad experience. But I believe the real test lies in making good things work even better! However, I found some UX errors while using WhatsApp so I decided to fix these issues because, why not? Ok so let’s jump into the problems.

I identified 4 problem areas 🔍

  1. Delete for me option
  2. Can’t edit the WhatsApp Status
  3. Unable to update status sequence
  4. Process of deleting group chat

Let’s get into the specifics –

  • Problem 1: Delete for me

Current design

WhatsApp screen
Screen After selecting any message
Screen After selecting delete icon
Screen After selecting ‘delete for me’

When we select any message (send by us). A bar comes up with a delete icon, after clicking on the delete button a pop-up appears with three options- “Delete for me, cancel and delete for everyone“. If you choose the ‘Delete for me’ option it just deletes the message.

What is wrong ❓

Imagine, you sent the message in the wrong group and in hurry to remove that message, instead of clicking on “delete for everyone”, you clicked “delete for me”. Now everybody can see your post (except you 😶)

so what will you do now? You can’t get that message back. Don’t you think it can be a disaster sometimes?

Here the design failed to prevent a user from accidentally clicking that button.

UX improvements

Error prevention is the most important concept to have good usability in a design. There can be two ways to solve this problem:

Solution 1: Add a pop-up for confirmation

After selecting the “delete for me” option. It should ask for confirmation. It’s worth the interruption because you want to prevent accidental clicking.

Redesign screens

delete option

After selecting ‘delete for me’

confirmation message

Solution 2: Add an undo option

Having an undo button is a great way to at least prevent errors from becoming permanent. If someone goes down that path of making mistake, they can still catch it and hopefully undo it.

Redesign screens

delete option

After selecting delete for me

undo option
  • Problem 2: Can’t edit status

We all update WhatsApp status from time to time. But there is some UX failure. After uploading the status you can’t edit it you have only the option to delete it and upload it all again. Have you ever become the victim of such a situation where you had to upload the status all again just because of some spelling mistake 😣

Current design

Screen After clicking 3 dots
screen After selecting status

In current design, we can see there no option to edit the WhatsApp status.

UX improvements

Solution: Add edit option

Just add an edit option and you are done ✌️!! Now you have option to edit your WhatsApp status to update it

Redesign screens

Screen, After clicking 3 dots
Screen, After selecting status
Screen, After clicking edit icon
  • Problem 3: Story Sequence

After uploading multiple statuses if you realize that accidentally you have skipped the sequence, there is no way to correct that without deleting all the statuses. That is frustrating.

Current design

current status screen
current design after selecting any status

if a user want to modify his/her status he/she has only delete and forward option.

UX improvements

Solution : Add swapping option

The solution is to provide users swapping option to rearrange the status in desired order. This can be done by providing a ‘grid’ icon. On tapping grid icon user can swap status when modifications are done click on check icon to save the changes. Now your status sequence is updated.

Redesign screens

Redesign Screen, After selecting a status
Redesign Screen, After clicking grid icon
Redesign Screen, After rearranging status
updated status redesign screen

design Inspired with

  • Problem 4: Delete group chat

Unlike the personal chat, The process of deleting the chat of the group is unnecessarily lengthy.

Current design

Group chat screen
Group chat screen
screen after clicking 3 dots
screen after clicking 3 dots
screen after clicking more option
screen after clicking more option
screen after clicking clear chat
screen after clicking clear chat

UX improvements

Solution : delete directly

There can be a simple approach to do this just like a personal chat. When we long press on any group then a bar appears why no just add a delete icon in the bar, after clicking on the delete icon a pop-up message should appear that allows us to delete the entire chat at once.

Redesign screens

Screen after selecting any group
Screen after selecting any group

After clicking ‘delete icon’

redesign screen for deleting chat
redesign screen for deleting chat

Ending Notes

I do not work for WhatsApp, nor was I contracted for this project. I did this project purely out of interest and desire to solve problems I often face. If you have any experience with bad UX, feel free to share in comment section ✌️

Thanks for reading! 😇

6 thoughts on “Case study: UX flaws in WhatsApp that nobody is talking about”

  1. Pingback: 5 takeaways from “steal like an artist”-5 things no one ever told you about being creative - all-about-design

  2. Pingback: 6 Examples of design failure in everyday life We’ve Become Used To - all-about-design

  3. Pingback: 10 Useful Figma Tricks That will Enhance Your Work ✌️ - all-about-design

  4. Pingback: 10 Essential Figma Plugins that will boost your work 🚀 - all-about-design

Leave a Comment

Your email address will not be published.