Zomato
.
Designing for India's largest
food delivery system
Designing for India’s largest
food delivery system
Designing an AI-powered conversational interface that streamlines decision-making for complex, mood-based food queries.
Designing an AI-powered conversational interface that streamlines decision-making for complex, mood-based food queries.
2023
2023
DIGITAL PRODUCT DESIGN | USER EXPERIENCE | VISUAL COMMUNICATION
DIGITAL PRODUCT DESIGN | USER EXPERIENCE | VISUAL COMMUNICATION
Project(s) Summary
Project(s) Summary
At Zomato, India’s leading food delivery app, i worked on the moments that decide whether someone orders or closes the app. I helped design an AI assistant that helps people pick what to eat (it later launched to all users as Zomato AI), progress cues that show how close you are to a deal, and delivery updates that change with the weather. I also reworked onboarding for new customers, letting them into the app before asking for their details and greeting them with a week of free Gold. Drop-off fell from 13% to 6%.
Off the screen, I spent time in Blinkit dark stores and Zomato Everyday’s cloud kitchens, and reorganised backend interface orders into odd and even flows so staff could prep them like an assembly line.
At Zomato, India’s leading food delivery app, i worked on the moments that decide whether someone orders or closes the app. I helped design an AI assistant that helps people pick what to eat (it later launched to all users as Zomato AI), progress cues that show how close you are to a deal, and delivery updates that change with the weather. I also reworked onboarding for new customers, letting them into the app before asking for their details and greeting them with a week of free Gold. Drop-off fell from 13% to 6%.
Off the screen, I spent time in Blinkit dark stores and Zomato Everyday’s cloud kitchens, and reorganised backend interface orders into odd and even flows so staff could prep them like an assembly line.
Onboarding New Users
Onboarding New Users
Problem: New customers had to get through too many steps before they could place their first order. Every extra screen was a chance to give up, and 13% of first-time users dropped off before ordering.
Solution: We mapped the full journey from download to first order and looked at where people were leaving. Most of the drop-off came from asking for details upfront, before people had even seen the food. So we let new customers into the app first and asked for their information later, once they were already browsing. To get them over the first step, we added a welcome gift: 7 days of free Zomato Gold.
Business impact: Drop-off fell from 13% to 6%, so more than half the people who used to leave now went on to place an order. For a food delivery app the first order is what turns a download into a customer, which makes onboarding one of the cheapest places to grow.
Problem: New customers had to get through too many steps before they could place their first order. Every extra screen was a chance to give up, and 13% of first-time users dropped off before ordering.
Solution: We mapped the full journey from download to first order and looked at where people were leaving. Most of the drop-off came from asking for details upfront, before people had even seen the food. So we let new customers into the app first and asked for their information later, once they were already browsing. To get them over the first step, we added a welcome gift: 7 days of free Zomato Gold.
Business impact: Drop-off fell from 13% to 6%, so more than half the people who used to leave now went on to place an order. For a food delivery app the first order is what turns a download into a customer, which makes onboarding one of the cheapest places to grow.
Designing Micro-interactions
Designing Micro-interactions
Problem: Delivery delays caused by weather showed up as silence or a stalled tracker, leaving users anxious and more likely to contact support or cancel.
Solution: A gentle, reassuring message on the tracking screen that explains the weather-related delay when it happens, instead of leaving the delay unexplained.
Business impact: Fewer support tickets during weather disruptions, and less order cancellation from anxious waiting.
Delivery Delays
Problem: Delivery delays caused by weather showed up as silence or a stalled tracker, leaving users anxious and more likely to contact support or cancel.
Solution: A gentle, reassuring message on the tracking screen that explains the weather-related delay when it happens, instead of leaving the delay unexplained.
Business impact: Fewer support tickets during weather disruptions, and less order cancellation from anxious waiting.
Problem: Offers were visible on the menu but conversion from seeing an offer to adding it to cart was low, visibility wasn’t translating into action.
Solution
Added clear progress cues and micro-interactions at the point of decision, so a user could see how close they were to unlocking a deal rather than discovering it after the fact.
Business impact
Higher menu-to-cart (M2C) conversion.
Offer Visibility
Problem: Offers were visible on the menu but conversion from seeing an offer to adding it to cart was low, visibility wasn’t translating into action.
Solution
Added clear progress cues and micro-interactions at the point of decision, so a user could see how close they were to unlocking a deal rather than discovering it after the fact.
Business impact
Higher menu-to-cart (M2C) conversion.
Opportunity Area: Food discovery with AI
Food discovery with AI
Nobody wakes up craving “cuisine: Indian, price range: mid, rating: 4+.” They think “it’s raining, I want something warm” — and then the app makes them turn that into tags before it’ll do anything useful. Somewhere between the feeling and the filter, a lot of people just close the app.
What if that translation step didn’t need to happen? What if you could type the feeling itself, and the app just worked with it?
Nobody wakes up craving “cuisine: Indian, price range: mid, rating: 4+.” They think “it’s raining, I want something warm” — and then the app makes them turn that into tags before it’ll do anything useful. Somewhere between the feeling and the filter, a lot of people just close the app.
What if that translation step didn’t need to happen? What if you could type the feeling itself, and the app just worked with it?
Introducing Zobu
Introducing Zobu
Zomato’s search is good at answering questions you already know how to ask: cuisine, distance, price. It’s less good at “something light, it’s hot out” or “I want to feel better, order me comfort food.” Those aren’t searches. They’re moods, and moods don’t have filters.
Zobu is a conversational assistant built for exactly that gap. You say what you’re feeling like, and it works from there instead of asking you to translate it into tags first.
Zomato’s search is good at answering questions you already know how to ask: cuisine, distance, price. It’s less good at “something light, it’s hot out” or “I want to feel better, order me comfort food.” Those aren’t searches. They’re moods, and moods don’t have filters.
Zobu is a conversational assistant built for exactly that gap. You say what you’re feeling like, and it works from there instead of asking you to translate it into tags first.
What we did
What we did
Ordering inside the chat sounded exciting early on, but it kept bloating the scope, so we cut it.
The version we shipped only handles helping someone decide what to eat.
Scoped to discovery - dropped in-chat ordering to keep the MVP focused.
Competitive analysis - looked at ChatGPT, Bard, Snapchat AI, Bing, and Replika to see how they handle tone, guided prompts, and multimodal output.
Iterated entry points and onboarding - where the assistant sits in the app, and what the first screen looks like. We tested it inside “What’s New,” a home banner, a floating action button, and an Explore tab. We also tested a separate preferences screen and a dark theme, then dropped both, each added a step before someone could actually start typing.
Iterated item and dish cards - tried large-image layouts, dark cards, horizontal carousels, and grid views.
Ordering inside the chat sounded exciting early on, but it kept bloating the scope, so we cut it.
The version we shipped only handles helping someone decide what to eat.
Scoped to discovery - dropped in-chat ordering to keep the MVP focused.
Competitive analysis - looked at ChatGPT, Bard, Snapchat AI, Bing, and Replika to see how they handle tone, guided prompts, and multimodal output.
Iterated entry points and onboarding - where the assistant sits in the app, and what the first screen looks like. We tested it inside “What’s New,” a home banner, a floating action button, and an Explore tab. We also tested a separate preferences screen and a dark theme, then dropped both, each added a step before someone could actually start typing.
Iterated item and dish cards - tried large-image layouts, dark cards, horizontal carousels, and grid views.
What we shipped
What we shipped
Search-based entry point- Zobu sits inside the search screen.
Restaurant-grouped list cards - dishes grouped under their restaurant header, in a vertical list. Uses more vertical space than the alternatives, but handled variable item counts and long dish names without breaking.
Contextual prompts - fading prompt suggestions in the chat input and intro screen, there to guide input without locking users into fixed phrases.
Light theme, Zobu as the mascot - matches Zomato’s existing visual system.
Search-based entry point- Zobu sits inside the search screen.
Restaurant-grouped list cards - dishes grouped under their restaurant header, in a vertical list. Uses more vertical space than the alternatives, but handled variable item counts and long dish names without breaking.
Contextual prompts - fading prompt suggestions in the chat input and intro screen, there to guide input without locking users into fixed phrases.
Light theme, Zobu as the mascot - matches Zomato’s existing visual system.
Entry Points Iterations
Entry Points Iterations
“What’s New” rail: first choice for the entry point, later dropped from the home page entirely once it proved not durable enough.
Search bar placement: easy to find, but collided with where the mic icon already lived
Home page banner: introduced Z Butler well, but took up too much space to justify a permanent spot.
Floating Action Button: could expand into a greeting after inactivity, but risked doubling up on pages that already had a FAB.
More Categories button: considered as a home for Zobu, but risked burying it too deep for anyone actually looking for help.
Explore cards: tested Zobu there so the feature would be instantly understood at a glance.
Final Entry-point
Final Entry-point
Zobu release- Entry point
Soft-launched in the Explore section first, using a teaser banner that hinted at the feature without fully revealing it, to gather feedback before a wider rollout.
Final Entry Point
The final Entry point sits in the Search Bar, ensuring easy user access.
Introductry screen Iterations
Introductry screen Iterations
The onboarding preferences screen added a step without adding much. Reading order history and asking follow-up questions inline, inside the chat, covered the same ground.
The onboarding preferences screen added a step without adding much. Reading order history and asking follow-up questions inline, inside the chat, covered the same ground.
Balancing a clear explanation of what Zomato Butler does against a design that still felt warm rather than instructional took several rounds of layout and colour exploration.
Balancing a clear explanation of what Zomato Butler does against a design that still felt warm rather than instructional took several rounds of layout and colour exploration.
Considered a dedicated screen asking for name and dietary preference, but since order history already implied preferences and a missing name could just be asked in-chat, the standalone screen was cut from the final version.
Considered a dedicated screen asking for name and dietary preference, but since order history already implied preferences and a missing name could just be asked in-chat, the standalone screen was cut from the final version.
Final Introductory Screen
Final Intro Screen
Education Screen: Shown for a user’s first 2–3 visits, before they open the chat, just enough to explain what Zomato Butler does.
Education Screen: Shown for a user’s first 2–3 visits, before they open the chat, just enough to explain what Zomato Butler does.
Education Screen: Shown for a user’s first 2–3 visits, before they open the chat, just enough to explain what Zomato Butler does.
Item Card Design Iterations
Item Card Design Iterations
Large-image cards showcased the dish well but ate up so much screen space that scrolling became a chore.
Large-image cards showcased the dish well but ate up so much screen space that scrolling became a chore.
Horizontal scroll made it worse: dish names and offer badges varied in length, so card widths stopped lining up and the row looked inconsistent.
Horizontal scroll made it worse: dish names and offer badges varied in length, so card widths stopped lining up and the row looked inconsistent.
The list view fixed the earlier layout problems, but introduced a new one: the restaurant name repeated every time two or more of its dishes appeared in a row.
Fixed by grouping dishes under one shared restaurant header instead of repeating it per item.
The list view fixed the earlier layout problems, but introduced a new one: the restaurant name repeated every time two or more of its dishes appeared in a row.
Fixed by grouping dishes under one shared restaurant header instead of repeating it per item.
Horizontal card scroll: matched the search-results style, but broke visually the moment only one item was returned.
Horizontal card scroll: matched the search-results style, but broke visually the moment only one item was returned.
List view was chosen deliberately for consistency, even though it costs more vertical space than the alternatives.
List view was chosen deliberately for consistency, even though it costs more vertical space than the alternatives.
Final Card Screens
Final Card Screens
Item Card
Item Card
Item Card
Restaurant Card
Restaurant Card
Restaurant Card
Final Flow
Final Flow
The final version stuck to Zomato’s existing light theme, with a food-doodle background running behind the chat meant to feel more like a conversation than a form.
After I left the project, the team changed the mascot and renamed it Zomato AI. It rolled out to Gold members first and is now available to all users.
The final version stuck to Zomato’s existing light theme, with a food-doodle background running behind the chat meant to feel more like a conversation than a form.
After I left the project, the team changed the mascot and renamed it Zomato AI. It rolled out to Gold members first and is now available to all users.
Learnings
Search worked better than a FAB or a pop-up. People just went to the thing they already knew, not the new button.
I thought a good response would be enough on its own. It wasn’t — the card layout ended up mattering just as much as what the text said.
Edge cases came late and they were annoying. Single item, long dish name, odd number of results — stuff that looked done just broke.
Search worked better than a FAB or a pop-up. People just went to the thing they already knew, not the new button.
I thought a good response would be enough on its own. It wasn’t. The card layout ended up mattering just as much as what the text said.
Edge cases came late and they were annoying. Single item, long dish name, odd number of results, stuff that looked done just broke.
Search worked better than a FAB or a pop-up. People just went to the thing they already knew, not the new button.
I thought a good response would be enough on its own. It wasn’t. The card layout ended up mattering just as much as what the text said.
Edge cases came late and they were annoying. Single item, long dish name, odd number of results, stuff that looked done just broke.
Working inside someone else’s design system is different from designing from zero. I had to think in terms of what already existed, reusing components, staying consistent instead of just making what felt right.
Micro-interactions matter more than I expected going in.
Once I started showing designs outside the design team, the feedback changed. Made me keep more options open instead of locking in early.
I left before the launch and the feedback cycle that followed it. That’s the part I’d have wanted to see through.
P.S. Looking at food all day while trying to get actual work done tested my limits more than any of the actual design problems did
Working inside someone else’s design system is different from designing from zero. I had to think in terms of what already existed, reusing components, staying consistent instead of just making what felt right.
Micro-interactions matter more than I expected going in.
Once I started showing designs outside the design team, the feedback changed. Made me keep more options open instead of locking in early.
I left before the launch and the feedback cycle that followed it. That’s the part I’d have wanted to see through.
P.S. Looking at food all day while trying to get actual work done tested my limits more than any of the actual design problems did
Working inside someone else’s design system is different from designing from zero. I had to think in terms of what already existed, reusing components, staying consistent instead of just making what felt right.
Micro-interactions matter more than I expected going in.
Once I started showing designs outside the design team, the feedback changed. Made me keep more options open instead of locking in early.
I left before the launch and the feedback cycle that followed it. That’s the part I’d have wanted to see through.
P.S. Looking at food all day while trying to get actual work done tested my limits more than any of the actual design problems did
.say hello
Open to opportunities, feedback, or a
conversation. I'd love to hear from you :)
.say hello