GrabFood Driver's App - UX Design Challenge


May 2019




Design Challenge Task

The Brief

Imagine that Grab is introducing food delivery service in Philippines (like FoodPanda). You are tasked to design the driver app for motorbike drivers. Please describe your approach / problems / considerations / when you start designing the app. Here is a rough outline of how the process is like;

📌 Customer orders food delivery through the Grab app.

📌 A job card is shown to the driver. Driver has to decide if he/she wants to take up the job. Note that the job card has to be flexible to show not just food delivery jobs, but also courier jobs like Courier Delivery.

📌 Once driver accepts the job, he will have to go to the restaurant to pick up the food

📌 After picking up the food, the driver will have to deliver the food to where the customer is.

Task Overview

The challenge calls for a thorough end-to-end design for a food/courier delivery motorcycle driver app. To be frank, I read about this challenge before - someone has attempted to complete this and write a whole case study on Medium.

Before doing any design for this challenge, I tried to recall as much experience I could about Grab app and made a mental map in my mind on how to tackle this challenge. I have been a long time Grab user, and in fact, my brother-in-law does “Grab” in his free time. I’ve seen how Grab driver interacts with their app in many ways such as while driving, resting and so on.

FoodPanda and DahMakan are two big players in Malaysia when it comes to on-demand food delivery service. I liked how seamless the order experience was and managed to spoke with the delivery guy a few times about their earnings and journey. I foresee my past experience using both services will help me to understand this challenge better.

In my attempt, I’ll try to walk through each process from start to end and elaborate on my assumption, hurdles, and solution.

TL;DR - I didn't get the job 😿

Ideation and Process

Stakeholder Map

In order for me to understand and define the people that will be involved in using and delivering the service. I make use of stakeholder map exercise that can shows who the people are, why they are there and the relations between them.

Skipping a stakeholder map before designing any service, will often find that the service design doesn't work because it has missed a key stakeholder. Making a quick stakeholder map will help avoid such a costly mistake.

Stakeholder Map able to show its direct and indirect users quickly.

Although there are many listed stakeholders, the most important section for this challenge is its Direct Customer which is the motorcycle driver. This stakeholder map will then help us to define our assumption later down in the process.

Bird’s Eye View User Flow

Based on my learning with other on-demand food delivery in the market, this is my early broad assumption on the whole journey that involves multiple stakeholders in the process.

Identifying User Stories & Its Context

Since I already know who the users are from the stakeholder map, now I’m able to carve out a few assumption and hypothesis that will help me to design the app. One ample method that able to crystallize this process is Impact Mapping. An impact map is a visualization of scope and underlying assumptions created collaboratively by senior technical and business people. However, since I was doing this alone, this result is my best attempt to identify every single information in this exercise.

This impact map will help me later in crafting the epic user flow and also what featuresthat needed to be built and designed.

Visual Design

User Journey

In order to save time and iterate quickly without investing much effort doing the wireframe, I prepped a block diagram user flow to test out both the impact and the deliverables from the previous exercise. In this stage, we are looking at most “desired flow” with some little deviation from it. The goal at this stage is to come out with a flow that both users and developers will understand—otherwise you end up with a solution that neither understands.

To see the full view of the User Flow, you may go to this URL -


I then adapted the block diagram user flow in the form of wireframes, whereby I put in more information into it. This combination will help me in the implementation stage later. This wireframing exercise incites a deeper thoughts in whole functionality of the end product, as for example—I played around with the best positioning of the toast dialog informing pickup timer and also whether TAC confirmation is going to be a burden to all parties involved?

To view the whole wireframe in the complete flow, you may go to this URL -

Final Mockups

I selected a few of the key screens that I think collectively able to deliver my design aspiration in this challenge. The concept is heavily influenced by current Grab app styling. Because the app is going to be catered for motorcycle/bicycle rider, some of the essential information was deliberately designed to be larger than the rest of the UI for ease of usage.

To view the whole set of the end UI, you may go to this URL -

Hurdles, To-dos and Challenges

Provided all the variables are fixed, and no other deviation from the designed flow, the app experience will be perfect and simple. However, a further experiment in term of user testing (Qualitative) and usage statistics (Quantitative) must be observed in multiple scenarios in order to have the best final product for the masses. Some of the hurdles are;

  • To instill time discipline and honesty to both Rider and Restaurant, I’ve introduced TAC confirmation in the flow. However, it brings out a sentiment of trustworthy lacking between Grab and its partner. Perhaps, a better reward system may be used to encourage said values. I.e a higher profit percentage based on better time in completed job?

  • There are many unforeseen events that may break the flow while the delivery is in progress. Such as road accidents, bad weather, burglary, theft as well as a fraudster. How do we address such events?

  • I’ve seen many bad and dangerous riding etiquettes by FoodPanda, DahMakan and GrabFood riders in my area. Smartphone Map navigation is not designed for motorcycle user, hence the dangerous riding—One hand holding phone, while the other on the throttle. How better-designed navigation able to help them ride safer?

In a Nutshell

On-demand delivery is a totally new area for me. I learned a lot just by reading multiple findings on this topic alone. I positively think if I could harness the vast findings Grab has collected over the years, an inclusive exploration that is more versatile in its UX can be achieved.