A Redesign Challenge — Process & Thinking
I was assigned a Redesign Challenge by my mentor in mid-November 2020. The purpose being, to challenge ourselves and our creativity to achieve the task in a short duration of time. Though the exploration didn’t end up being short as intended, it still posed a challenge in finding problems that actually existed.
I chose the Zomato mobile app for Android. The challenge was completed between December 2020 and February 2021.
Zomato as a Company
Zomato is a food delivery platform, started in 2008 at Delhi. It has since expanded into 24 countries and over 10,000 cities with more than 100 million users. It facilitates the users with options like home delivery, takeaway, booking table, sharing content (blogs, posts/reviews).
Food quality, accessibility, and assortment are the key focus of Zomato. Their mission is quoted as “Shaping the future of food”.
Methodology
- Research
- Persona
- Design Drivers
- Sketches
- Prototype
User Research
Aim
To find the problems faced by the users while using the Zomato mobile app that (could) lead to a bad user experience.
Initiation- Survey
A survey was drafted at the very beginning, to get an understanding of users’ habits, and pain points. 10 questions were asked ranging from their habits, likes and dislikes, and experience of using the app. The survey was conducted online via Google Forms. 60 people responded to the survey.
Insights
- People mostly use the mobile app over the website, as it is handier.
- Zomato is mostly used for browsing restaurants, other than ordering food. This indicates, that users rely on and trust Zomato as a brand.
- At the same time, there are some features, explored very less by the people. This indicates bad feature discoverability.
- Zomato offers a variety of features to users, therefore making the app very engaging.
- On Zomato Placing an order is a lengthy task, thus discouraging users to order food.
- There is some misconduct on the part of prices, as it is higher on Zomato than the restaurant’s actual menu.
- Both food picture and prices are not genuine, this results in a bad user experience.
Interviews
Interviews were conducted with some of the users through telephonic conversation. The existing UI was analyzed with their help to understand the discomfort posed through the Zomato app.
Home Screen
On opening the app, the first thing to see is a promotional banner and filters everywhere.
There are no restaurants listed in the first fold of the app, but a shower of filters which are repeated in the same first fold and the navigation bar as well.
.
.
.
.
.
.
The app has innumerable information to share, but the organization is lacking.
Various information is shared in a congested manner as if leaving no space for it to breathe.
This makes the interface look messy and cluttered.
.
.
.
.
.
Menu Screen & Info Screen
The app has two different pages for looking at its menu and other information.
And to see customer review one has to go to a different third page.
.
.
.
.
.
Menu Screen
The menu is so long that it seems endless. The user sometimes gets lost while navigating, searching for the dish.
The ‘menu’ also doesn’t help much because of the less focus it attracts, when there are much exciting food pictures present on the screen.
.
.
.
.
Cart Screen
The cart page occupies only 75% of the screen, thus breaking consistency.
‘Place Order’ is highlighted and shadows the payment changing option, so many times users involuntarily skips the step.
.
.
.
.
.
.
Secondary Research
After this, I took reviews and feedbacks from other sources, from which the most prominent were from Google Play Store. It was done to reach a wider audience and reduce the chances of made up reviews, I looked through Google Play Store reviews, and found some interesting insights that supported my research done till before.
Competitive Research
I found platforms that are or could be Zomato’s competitors. The most prominent is Swiggy followed by EatSure (Faasos), and Foodpanda. The data derived is a mix of secondary and primary research. Amongst these, Swiggy and EatSure seem to be the most prominent threats as they have a larger reach and provide good value with their services.
Personas
Based on my research, I categorized users into four types:
- An Outgoing Foodie
- A Foodie
- An Explorer
- A Health Freak
Design Drivers
To cater to the problems identified, I devised design drivers and feature matrix against every problem.
Sketches
Now, it was a time to reflect upon all the research I had done. I constructed low-fi wireframes to frame the ideas of the layout.
Prototype
Home Screen
Key changes
- A prominent categorization of restaurant and groceries, which also showcases the feature of grocery delivery in the app very clearly.
- A ‘Favourites’ tray-list has been added, which showcases the restaurants frequently ordered from or the restaurants that have been bookmarked by the user. A horizontal scroll is given so that it would not hinder the discoverability of other restaurants. Also, the tray-list has been kept in the first fold, so that it is easy to locate your favourite restaurants and eateries.
- ‘Meal for one’ is a feature by Zomato, that has been on the app for almost two years now. I have expanded the area covered by this feature, to increase its usability.
- ‘Popular cuisines’ showcases different cuisines on a horizontal scroll. This will help narrow down the user’s search for food.
- Several filters have been added on a horizontal scroll tray. The restaurants below this would be shown according to these filters, narrowing down the user’s search.
Restaurant Screen
Key changes
- To avoid the repetition of information, that is present on the current app, I have merged the two screens, that is the restaurant menu and info. Now, one can see all the relevant information about the restaurant on a single screen. This also reduces the number of steps to be taken to place an order, while giving enough relevant information about the selected restaurant.
- On the same screen, the user can select from the three options, delivery, takeaway and dine out. Thus, placing all the available options in front of the user.
- The restaurant menu has been added on a horizontal scroll, to enable easy navigation through the menu.
- The bottom navigation bar would help the user go through the reviews and would allow easy switching between the different tabs.
Food Info
Key changes
- A separate page has been added for food information, giving a piece of more detailed and thorough information about the selected food.
- Ingredients used to cook the food and some facts related to the selected food would be shown, to increase the user engagement and also add transparency to the service.
- Also, one would open this screen only if they tap at the picture of the food, making it an optional service and thus not adding to the lengthiness of the whole process.
Cart
Key changes
- When the screen is loaded, a pop-up is shown to confirm the address so that one can verify the address at the end, thus the chances of a second address being selected are reduced.
- The default setting of cutlery being sent along with the order is changed to a setting where the user will have to check in the box to get any cutlery. This will help the restaurant save plastic and take a step towards sustainability.
- At the time of checkout, the user will be directed to payment options, and not direct orders. This is done to eliminate the chances of skipping the payment choice and also because all the other apps allow this kind of transaction. And the change would create a similarity between the different applications.
Order Tracking
Key changes
- Along with all the features/information as the existing one, a few new features have been added in hopes of increasing user engagement.
- A new feature ‘Live Cooking’ has been added so that the user can watch their food being cooked while waiting for the order. This feature could be especially useful in terms of app engagement.
- To motivate the users to tip their Zomato valet, a brief incident is added of the particular valet along with their picture. This would create a sense of identity from the user’s side as they will be able to recognize them with the picture and story.
Overall Approach
The UI of the app has been redesigned keeping in mind the ongoing trends in UI/UX design, therefore softer edges have been given to the elements throughout the design.
I wanted to make the UI of the app modern and trendy along with solving the pain-points identified in the beginning. While at it, I tried to add some value from my side to make the user experience more fulfilling. I kept an open mind not only for the users I surveyed or interacted with but also the other people associated with the Zomato platform and especially their delivery partner.
Please let me know which of my design decisions you agree or disagree with. Tell me what you’d do differently and why.
