UI/UX Case Study: Grab Express Revamp

Fauzan Yafi Ariansyah
6 min readAug 2, 2022

--

Introduction

This case study was created as one of the assignments from the UI/UX online bootcamp that I participated in.

Project Overview

Grab has been one of the biggest super-app in Southeast Asia, especially in Indonesia. They offer a lot of services from mobility, deliveries, until financial services. All of those services could be found in their app. One of the services is called Grab Express. It is a delivery service, which allows users to send goods and packages. It is one of their most used service, besides Grab Food. However there are some problems with their Grab Express service in their app, which I later tried to validate with other users.

Challenge

In this Design Challenge, I was asked to find any improvements that are suitable for Grab Express. This could include big or small improvements.

Design Process

https://miro.medium.com/max/1200/1*33khN9zpFCMWnF8pLqeVTQ.png

For this case study, I decided to implement the design thinking method to find the best solution.

Emphatize

During this phase, I would like to get information from the users about what they like and what they dislike from the app, and the habits of the users when they are using this app. These information will later be used to improve the UI and UX aspects of the app.

  • Method

In order to obtain the information needed for this research, I chose to use the qualitative research. I conducted an interview to five people who frequently use Grab Express. I asked the interviewees to complete some tasks that I have prepared before, which are related to Grab Express. The interviews were conducted online through Zoom. These are the requirements that I need from the interviewee:

  1. Use Grab Express at least once a month
  2. Age between 20–35 years old
  3. Indonesia citizen
  • User Persona

This is the user persona that is concluded from the five users that were interviewed for this case study.

  • Research timeline

August 1st — August 7th

  • List of tasks:
  1. Send a package to an address.
  2. Send packages to two different addresses.
  3. Change the order of the targeted addresses.
  4. Choose a suitable promo for Grab Express.
  5. Send a package to an address another city.
  6. Create a template for sending packages.

Define

After conducting those interviews, I tried to collect the insights from users by categorizing the task completion rate into three types of result, which are: succeed, partially succeed and failed.

From the task completion rate above, we could see that these five users have some difficulties in some of the tasks that were given. From the difficulties that they experienced, I could take the pain points that they were feeling while trying to complete these tasks

  • Pain Points
  1. The users found it difficult to arrange the order of the addresses if they were to send to more than one address
The symbol for arranging the order of the addresses is marked with a blue circle

2. Not all promos that are shown in Grab Express were meant for Grab Express. Some of them could be used for other Grab services. So users had to do trial and error until they find the right promo for Grab Express.

Promo section

3. The option to send packages to other city is hard to find. You could see from the image below, the Intercity delivery option is shown at the bottom part of the menu. In some cases, that option couldn’t be found there. Some also found it strange, that the option for intercity delivery is located in the “You may like” section.

Intercity delivery option

Ideate

After collecting the pain points together, I came up with solutions suitable for the problems.

How Might We & Solutions

The pain points are known, and now what’s needed is the solutions. Here, I listed the mentioned pain points along with the how might we questions and the solutions.

Problem 1: Users couldn’t arrange the order of the recipient address

How might we make the symbol more noticeable for the users?

Solution: Change the original symbol that looks like a hamburger menu to an arrow symbol

Problem 2: Not all promos that are shown in Grab Express could be used for Grab Express

How might we make the users could choose the right promo?

Solution: List only the promos suitable for Grab Express

Problem 3: Users couldn’t find the option to send packages to other cities.

How might we make the option visible?

Solution: Change the position of the intercity delivery

User Flow

User Flow

The picture above is the new user flow for Grab Express. This describes the way that users have to go through when they use Grab Express, from choosing which option they want to choose (Intracity or intercity delivery), until closing the payment. There is also a change for the intercity delivery menu placement. It is not located in the “You May Like” section anymore. It is now located in the main menu.

Wireframe

This is the rough concept that has been made as a basic for the high fidelity design. It is a mixture of the solutions that are mentioned above and the elements from the original design that have no problems.

Wireframe 1
Wireframe 2

High Fidelity

High Fidelity

On the landing page, users have to choose first which kind of delivery service they want to have, intracity or intercity delivery. If users choose intracity delivery, they can directly fill in the information needed for the delivery, such as the item weight, etc. If they choose intracity delivery, they have to choose which city they want to send the package to.

Prototype

The next step after finishing the high fidelity design is creating the prototype. Here is the link to the prototype.

Testing

After the prototype has been created, the final step is to test the new version to users. I conducted a usability test to the same five people that I interviewed before. This test was meant to try, whether the change really improve the app or not. The test was carried out again with Zoom. The prototype was sent to those five people and they were also asked to do the same tasks as before.

Summary

All participants were able to do the tasks 100%. Although at first they were a bit confused with how the prototype works, but along the way they were getting comfortable with it.

Conclusion

The most important thing that I can take from this case study is that as a designer, we have to always listen to what the users need. An assumption has to be validated first with users. Do enough research before taking actions, because the more information you have, the more accurate your solutions will be.

Thank you for spending your time reading this case study. In case you have something to say or if you have any suggestions, you can freely contact me and I will gladly answer!

--

--