cft

Whatsapp Call History Filter | Case Study | Micro Flow | 10Day Design Challenge

Let me take you through my 10-day UX/UI micro-flow design challenge. I select the 2nd project WhatsApp, the Microflow is the “call history” adding a filter function.


user

Sheron G Gabriel

7 days ago | 3 min read

Let me take you through my 10-day UX/UI micro-flow design challenge. I select the 2nd project WhatsApp, the Microflow is the “call history” adding a filter function.

Whatsapp Call History Filter

The reason to select this Microflow project

I select a microflow for my design challenge workshop. Selected microflow to make a better version of it.

I select WhatsApp and add a filter function to the “call history” for my design challenge workshop.

A small change makes a good impact on the user experience and business. A full project will include many microflows. Improving a microflow is equal to a bigger project.

So I am very excited to do the microflow of the “WhatsApp call history filter”.

Problem

These days more people use WhatsApp for calling. But in the current version, WhatsApp has no call filter for identifying the different call details. Like missed calls, group calls, video calls, etc.

If the user finds any call details, the user will scroll through the call history page or search for the name, but it could not possible because there are unknown numbers and multiple groups call which is difficult to get a proper result.

Solution

Nowadays, more people use WhatsApp to call. WhatsApp provides free calls to use, Cross-platform compatibility, End-to-end encryption, Group calls, and high-quality audio-video, so users can easily switch between messaging and calling without having to switch between different apps.

In Jacobs laws “Users spend most of their time on other sites”

All users are accustomed to utilizing traditional telephone call services, and these services typically provide the ability to categorize and access previous calls in various manners. This includes the ability to view a list of recent calls, organize calls by contact, and even filter calls by missed, outgoing, or incoming. These features make it convenient for users to quickly access and review past call history.

Maintain Consistency and Adhere to Standards (Usability Heuristic #4)

Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform and industry conventions.

Adding this filter includes the ability to view a list of recent calls, organize calls by contact, and even filter calls by missed, outgoing, incoming, or group calls. These features make it convenient for users to quickly access and review past call history.

Whatsapp Call History Filter

Whatsapp Call History Filter

Benefits to the user and Business Impact

The new design has user control and freedom, and flexibility and efficiency of use which will help users to always feel that things are in their control,

Reduce the session length in the previous.
Users can easily find the calls applying the filter. Users can easily find the appropriate call details.

My Process

The process I used for this UX problem was the design thinking process.

This process has 5 main processes:

Empathise

Define

Ideation

Prototype

Testing

After Brainstorming I find some ideas and choose an appropriate idea to create a low-fidelity design. This low-fidelity design has led to the main design.

Draw the low-fidelity make prototype. The low-fidelity Prototype was possible with the help of “The Marvel app”.

https://marvelapp.com/prototype/85j1g0e/screen/90463695

After completing it I went on to make a High-fidelity prototype in Figma.

Whatsapp Call History Filter

After completing the design. Assign a task to the user, it helps to validate the design. The design is fine if the user performs the task quickly. If the user has faced any difficulty, then the design should be redesigned again and checked

The task for the user

  • Did you find only missed calls/ only outgoing calls/ only incoming calls/ only group calls in your WhatsApp?

Observe the user

➡️Does the user easily complete the task?

Before - Users scroll the calling page
After - The user will apply the filter option and easily find the call details.

✅Key Learnings

A problem should be identified and make a solution to the problem, should be found within a short period. To brainstorm to find possible solutions for the problem.

To make the founded solution in a real working model. First Draw the low-fidelity and convert it into a high-fidelity. Check this design with the user. The user is not satisfied and works again. Find a better solution.

A full project will include many microflows. Improving a microflow is equal to a bigger project.

The change in the “microflow” design process is equally valid to the full-fledged app.

🚩Learning from existing design

Every design is a several days designer’s effort. Find how the designers design a user-centric model. How the designer uses the “Heuristic Evaluation”. How to diagnose the problem with “Heuristic Evaluation”.

It helps to improve design thinking and find the proper solution to the problem.

🚩Learning in Usability testing

Find a problem and make a solution to the particular problem. It’s work? Is the right solution so user can easily complete their task.

Checking the solution with real users is very interesting and finds the user behavior to the particular task. If the user isn’t satisfied again, work with the problem and find a solution.

🙏🏽Thank you for your valuable time to read this article! 😃
Comment 💬your feedback

Upvote


user
Created by

Sheron G Gabriel

UX / UI Designer, Product Designer

I am a self-taught UX / UI designer. I am driven by curiosity, empathy, and my desire to develop simple, intuitive, and beautiful experiences. I am interested in helping the business satisfy the customer.


people
Post

Upvote

Downvote

Comment

Bookmark

Share


Related Articles