Designing a mobile-first quick service restaurant experience for Indian customers
Senior UI Designer and User Research
Adobe XD, Sketch, Adobe Photoshop, Adobe Illustrator
Eight week sprint
2 months
1 UX Designer
1 UI Designer
UI Design
Design Presentation
Client Pitch
User Research
Prototyping
Interaction Design
Animation
Burger King is a well known, international fast food brand serving an assorted menu of burgers to an adoring customer base. Their core users are youngsters between the ages of 18-32 who resonate with the brand’s ‘quirky and imperfect’ brand language and marketing.
Despite the brand’s widespread popularity, Burger King’s presence in the online space in India was practically nonexistent. Customers relied largely on aggregator apps like Swiggy and Zomato to place orders online.
To overcome the digital divide, Burger King engaged us to design a responsive app and website that can facilitate direct customer interaction and increase footfalls at retail outlets through in-app offers and rewards.
Burger King aspires to become a brand destination and increase recall through an experience-driven app that engages users with a more inclusive, delightful food ordering service.
“MOBILE FIRST, DIGITAL EVERYTHING”
We decided to create competing app for web and mobile where to make an order should be as simple as few clicks. And it should be easy to understand and informative about the options and choices the users have.
Our approach for breaking down a large project into manageable chunks. Use this process to define the steps needed to tackle the project, and remember to hold to all of out ideas and sketches throughout the process.
Quick Service Restaurants (QSR) market in India is projected to grow at a CAGR of over 18% during 2021 - 2025 due to increasing urbanization, rapid expansion in food delivery services, expanding young & working population, growing number of dual-income families and rising disposable income in the country.
QSR market is broadly categorized into Food & Beverages segments with Food category holding the majority share in the market. Nevertheless, the Beverage segment is expected to grow at a faster rate in the coming years on account of innovative offerings being launched in this product category.
Source - https://timesofindia.indiatimes.com/india/Eating-out-Delhi-spends-at-fast-food-joints-Mumbai-prefers-restaurants/articleshow/54503804.cms
In the beginning of study, we conducted interviews with several participants including mangement team, Burger King store employee and also who uses food app regularly. After talking with people about their real experience and expectation of food delivery apps, we have developed a user journey/experience map to capture the crucial pain points and challenge users may encounter and cause frustration. Here are our few questionnaires during the interview.
A user persona is a representation of the goals and behavior of a hypothesized group of users. In most cases, personas are synthesized from data collected from interviews with users.
Experience Mapping method helped our clients understand the experience a customer has with their product or service and with this method we have identified and optimized the customer touchpoints for a better experience.
We defined the IA as the art and science of organizing and labeling to support usability and find-ability.
A wireframe is a low-fidelity, simplified outline of your product.
We explored various design trends in food domain to understand and create an intuitive user interface designs for the application. It helped in understanding usage of Images, Colours, Iconography and Copy for the interface making it clear and concise.
We have followed the Burger King brand styles and guidelines like Images, Colours, Iconography, Typography etc. and designed the app for IOS, Android and Web.
Creating a prototype is one of the steps that precede the launch of the final product.
We built the Design style guide from scratch for the new App and Web. We defined all the reusable components and design guidelines.
We defined design guidelines for the Dev team and in house Design team so they can adhere to the guidelines and develop the design without making any mistakes.
We developed personalized trays of food product screens that graphically display ingredients, enlist customization options, and navigate different food offerings quickly. These screens were designed to emulate the straightforwardness and transparency that the BK brand conveys on its social media pages.
Users are able to switch between dine-out and delivery mode easily ?with the tap of a button.
We introduced a ‘Party Mode’ feature in the app which helps users book a party slot at the restaurant directly from the app. Moreover, this mode gives users the option of choosing or customizing theme parties and getting a live simulation of how it would look.
In order to track user purchases on the app and increase repeat sales, we introduced the concept of BK coins- a virtual currency, which could be earned with every order done on the app, or through playing in-app games. The BK coins allow users access to a multi-level Loyalty Program that offers exclusive added benefits and savings.
We introduced an element of gamification as a means to differentiate from other delivery apps. The ‘Offers’ page displays exclusive offers on the menu as well as deals from 3rd party services, redeemable through BK crowns. To increase restaurant visits, a scan feature was added in the app through which users could scan QR codes or paper crowns to earn crowns or unlock special offers.
To improve user engagement of the app, users are encouraged to “build” their own custom Whopper using a variety of ingredients from scratch.
The Store Locator enables users to rate or read reviews of a particular outlet and view the current offers live at the store.
The BK Wall serves as a one-stop destination for everything there is to know about Burger King - its history, reach, details of product offerings, and impact on the food industry. This section is meant to show how they’re more than just a fast-food joint and increase brand recall.
We introduced new features that were strategically aimed at increasing the “stickiness” of the app - to create an app experience that people love over other food ordering and delivery platforms.
The intuitive customization options and the Build Your Own Whopper feature have gained traction among the users which has led to higher engagement and conversions on the platform. Burger King has witnessed a substantial increase in the order sizes since the app launch.
The Restaurant Mode feature has allowed users to place orders at restaurant joints directly using the app and substantially reduced the waiting times for order placement.
Giving users the freedom to write reviews on Burger King’s restaurants in their own app has boosted users’ trust in the brand, and the ratings themselves are a matter of pride for the employees, enabling them to maintain hygiene and service.
The daily rewards and offers in the app have increased overall app engagement and given rise to a number of returning customers which validated our initial need for gamifying the app experience.
This project taught me a lot about the food industry, how QSR chains operate, and how to manage a large number of customers while providing exceptional customer service.
Through this project, I learned how planning and organisational skills work. We delivered 200+ screens despite the project only lasting two months. This wouldn't have been possible without planning.
Product is live on