A food delivery chatbot app for a restaurant in a city run by food aggregators: A UX Case Study

PROJECT OVERVIEW

The Product:
A clean and simple solution that allows users to order food from the restaurant by enabling ways to provide customized order instructions, accurate delivery tracking & prompt issue resolution.

Project Duration: 14/03/21–14/05/21 (2 Months)

The Business Context:
The food ordering market in India is a duopoly comprising of 2 food aggregators — Zomato & Swiggy. Users prefer to place orders via these aggregator platforms over private apps. As a result restaurants lose control on their pricing and margins. This also dilutes the quality of their service levels, ultimately impacting their brand image.

The Problem:
User recruitment onto private apps is a barrier to entry. While this is easily remedied by incentivizing users to onboard onto a newly designed platform (price offs/ discounts run by the restaurant). The biggest challenge has always app stickiness.

• How do we ensure that users keep coming back onto the app to place any orders with this restaurant?
• How do we make the restaurant’s app the default choice for ordering take out?

The Goal:
To design an experience that would trigger the user to switch apps while ordering from our restaurant. Ensure that the user starts defaulting to the restaurants private app every time they were in a mood for take out from our restaurant.

My Role: End to End
1. UX Research
2. UI/UX Design
3.Prototyping

Project Type: Academic

We will be entering our taxi with an entire set of maps and a compass

UNDERSTANDING THE USER

Primary Research: I started my journey by conducting a simple survey with a 3 pronged objective,

1. A user’s mindset while using delivery tracking apps

2. Current satisfaction levels of the Indian user with restaurant aggregators.

3. Identify gaps/user frustrations that can be solved to design a smoother , delightful user experience

Competitive Audit (what I call FAB): Features | Attributes | Benefits
Here is a snapshot of my findings:

This helped create a checklist of features that users tend to intrinsically expect from a delivery app and establish common pain points experienced by users on the existing aggregator platforms

The Issue resolution processes in food aggregator apps focused only on the delivery. Personalized preparation instructions, allergen related ingredient substitutions and care , the cornerstone of a personal dining experience were traded of for a modular system of polite messages and partial refunds. This was a definite gap that could be fixed for user delight!

Sampling Rationale of target user:

• Our target user is well educated with a high amount of disposable income who regularly consumes digital media.
• Age range of user 19–50.

This gives us 3 distinct user groups:
College student (19–23) | Young Professional (23–35) | Affluent Boomer (+35–50). 10 participants from each generational cohort were selected at random and then asked to fill in a simple survey.

Using the research responses , I proceeded to identify themes. Eventually the above 4 pain points emerged. Note: While Zomato used a chatbot style issue resolution mechanism with typed in dialogues , Swiggy used a more modular FAQ based method with multiple choice action buttons to direct users through issue resolution. This was a quicker system that cut down on resolution times and increased successful completion rates of the process

User Personas:

Based on the user groups identified earlier , I created a set of personas to help visualize our users in their natural environments.

This exercise drilled a layer deeper, to uncover our user’s goals and frustrations.

This subsequently allowed me to frame our Problem questions, of which there were 3..

Problem Questions:

1. How might we create a comprehensive order-delivery experience that offers supporting information and feedback to users at each stage of their digital journey?
2. How can we reduce user anxiety during the order tracking process & make the experience more reliable and delightful for the user?
3. Can issue resolution processes be streamlined for quick efficient completion ?

Defining the user journey and getting a glimpse of the user’s headspace

STARTING THE DESIGN

Part 1: Wireframing ft Paper: Once the broad sequence of actions that formed the user flow were determined , it was time to start wireframing the most important pages of the App.
Onboarding →Home Page →Ordering System

Star marks represent some elements that I thought would look good in the final design

Part 2: Digitizing the finalized ideas!: Let the fun and games begin!!!

Placeholder text was replaced with real copy, to get a better feel for the apps layout and information hierarchy

Part 3 : Low-Fidelity Prototypes

A low fidelity prototype with the completed user flow : This would set the foundational canvas for our high fidelity prototype & UI Design

Going a level deeper: A system usability study

Basis:

Users were asked to complete a set of tasks on the low-fidelity prototype while verbalizing their thoughts and feelings, each step of the way.(aka the think out loud method) The users interactions with the prototype was recorded and metrics like, “Time taken to complete task” were measured .

The system usability study conducted with the lo-fi prototype would help catch bottle necks in the flow and further streamline the flow before the UI design phase .

The above findings helped detail out the user journey by the addition of new screens and re-designing older flows to be completed in simpler steps, efficiency!! It was in this step that I learned:

“ Iteration is the only path to perfection”

Here is an illustration of the powers of iteration!:

Every step is a gradual improvement over the previous one. Iteration uncovers common sense solutions, a not so common intelligence that underlines good design.

”Iteration uncovers common sense solutions, a not so common intelligence that underlines good design.” ~ Avinash Pillai

UI Design & Accessibility Considerations

“Accessibility allows us to tap into everyone’s potential”- Debrah Ruh

Part 4 : High Fidelity Designs & Prototypes

Part 1 High Fidelity Mockup

Part 2 High Fidelity Mockups

GIF of the completed Hi-Fidelity prototype

Impact of Design

A beautiful turquoise green comes together with an azure white in a simple combination to create a clean, elegant user experience. The design ensures minimal data inputs from the user while solving all of their problems in a snappy trendy interface.

Way Forward

This was my first documented UX Case study. I will be publishing more of my original work on this publication , soon.

Connect with me

If you are reading this line, you stuck till the end. I appreciate your loitering support ;) You can hit me up at avinashpillaidesigns@gmail.com. Cheers!