McDelivery PH App Redesign: A Look and Use
It's been a few months since the redesign, but those take-outs don't order themselves.
Take-outs: the lifesaver of the "I can't be bothered to cook" crowd in times of need, especially in a pandemic, or the ongoing January flu season. Just having to go to an app to place an order without having to take the mind out of work is a pricey convenience that is taken for granted. Place an order, wait around 30 minutes give or take, start eating, discard the disposable utensils and packaging; a guilty pleasure that's not seen as guilty - we like it that way.
In the spirit of fast food take-outs, I'm going to talk about McDonald's Philippines' McDelivery app which had a redesign last October 2021 and discuss ordering, what's changed, and what I think could be improved upon it. I'll also touch on a personal wish and its potential importance for a standalone ordering app.
The Old App
It's time to visit the archives of my old phone's screenshots folder, where the old version meets the new version.
Color
The old app used white and gray, with yellow as the predominant color for buttons, and red as an accent.
Top Bar
The top bar holds a hamburger menu for the additional features that aren't in the navigation bar, namely tracking an order and the settings page. On the center is the Deliver To address dropdown, where the user can simply change or add an address in this area instead of having to do so in the checkout page. On the right of that is the My Bag containing the orders.
Navigation Bar
The navigation bar of the previous version is colored red with no apparent shadow to lift the bar separately from the content page. Active selections are highlighted as yellow and inactive ones are colored white. The four tabs on the navigation bar are: Home, Full Menu, Coupons, and Send to Many.
Home Screen
The home screen features a predominant carousel for showcasing deals, featured items, as well as announcements. The shape is a simple rectangle that spans the width of the screen.
At the bottom of the carousel displays six buttons: Full Menu, Quick-Add Bestsellers, Featured Products, Favorite Meals, McDelivery Hotlines, and Track My Order. There are no more sections after these buttons on the page.
Menu
The menu screen features a horizontal scrolling tab which list different categories of the menu, ranging from burgers to desserts. The selected tab is shown with a highlighted yellow bar. The items are arranged with three items per row. Displayed under each item is its name and price on a center-aligned format.
Order Tracker
The order tracker shows the order number being tracked and a status diagram showing four states: Order Submitted, Order Processed, Order Being Prepared, and Delivery on its Way. There is no other page displaying the actual order information.
The New App
Color
The first thing that will be noticed on the newer app is that the red accents are barely in the app. It's there, yes, but only in small accents on the highlighted icons in the navigation bar. Everywhere else is the standard white and the iconic McDonald's yellow.
Top Bar
The top bar shows the left-aligned, delivery address dropdown. The My Bag icon is placed on the right; sized slightly bigger than in the old app. The hamburger menu has been dropped.
Navigation Bar
The navigation bar is colored white with a slight back shadow to raise it from the main interaction page. The active selection shows a colored icon with a red text label. Inactive selections are colored dark gray. The five tabs on the bar are: Home, Menu, Orders, Coupons, and More.
Home Screen
The home screen features a slightly smaller rounded rectangle carousel that showcases features, deals, and featured meals. Below it is a personalized greeting that changes depending on the time of day. It then shows meals that also change that fit that said time - McMuffins and Longganisa in the morning, Big Mac and Chicken for the afternoon and so on. The menu categories come next that will redirect to the selected food category which also functions the same as the Menu tab on the navigation bar. Then comes the McDelivery-exclusive items. Below that is the My Favorites section, populated if the heart button is pressed on a certain item. Finally comes the featured meals, billed as "discover your new favorites".
Menu
The menu features ten categories: Featured, Group Meals, Breakfast, Chicken, Burgers, Rice Bowls, Desserts & Drinks, McCafé, Fries & Extras, and Happy Meal. Under each category, items are arranged in a grid with two in each row. The item is shown with a large image, under it its name and bold-style price in left-align.
Upon going to the specific item is its name and a radio button for the size variant. The order type can be changed to a solo (a la carte) meal via a button. The drink type and size comes next, with a section reserved for appropriate add-ons that compliment the item.
Checkout
Quality of life improvements also reach the checkout page, now showing the recipient details (name and contact number) along with the address for an additional verification in case of a possible address mix-up. The payment methods are still the same: Credit/Debit Cards, GCash, PayMaya, or Cash on Delivery. The order summary is still present. Now, there are two prominent buttons under the summary: Apply a Coupon and Apply Senior Citizen/PWD Discount. I don't recall those two being that prominent in the previous versions of the app. Once the order has been placed, an email receipt is given, which is neat.
Order Tracker
This page has been substantially upgraded compared to the previous version. The status progress is still present and remains mostly unchanged, save for an extra: Order Delivered. Under it is the estimated time of arrival for the order with a ten-minute range along with details of the order number, the selected branch, and the delivery address selected. Next is the listed items ordered along with the price for each and the total paid, with the payment type just below it.
There is another page in the order tracker that appears once the delivery status changes to "Order Processed", a WebView, at least for the Android version, will become accessible. It also shows the order's ETA, order number, as well as the price. Populating the majority of the space is a map to track the delivery's progress. Below them is the information of the delivery person along with options to either call or text. Topping it off is the delivery address information. The delivery tracking service is powered by a third-party company: LogiNext.
Adjusting to the then-new
I still remember that the experience was slightly jarring, which is usually what happens when something that I've reliably used from time to time since 2020 has seen an overhaul. But the first impressions were a bit rough. I couldn't log-in to the app at all when I received the update, it would accept the log-in credentials, but it would just sit there loading and not complete the process. In some tries, it would accept the credentials but error out. Eventually it seems that those back-end problems were resolved and I've successfully accessed the app. It was somewhat slow, which was immediately noticeable with how the previous version was speedy in comparison. I chalked it up to whatever they used to develop the new version and the more resource-intensive components that were used to give the app a better look.
Now came to the ordering, it was a bit confusing to see that the solo and meal types were no longer separate. I had to go to a meal item - say a Mushroom Pepper Steak - and then click on the "Change to Solo" button. Personally, I find this as the better approach as to not clutter the meal categories with what is essentially duplicate items, but it still took me time to get used to.
Then came the hitch in the ride: the delivery. For some reason, at that time, the automatic address lookup and the drag-down map seemed to be disconnected. Basically, I specifically entered my address as this specific street in this area, both by typing it in and the draggable pin on the map, but then pinned a street with the same name in a different area. It was in the same city, at least. It took a customer service representative who called me to sort the issue out, and I still got the order in the end, albeit delayed by more than 45 minutes, so that's a happily ever after situation as I see it.
Ever since that ordeal, I specifically put in the special instructions message of the specific area I'm in, just to be sure, even though I know that it's determined by the map anyway upon accepting the order. But I haven't had the same problem after that, and the destination pin on the map tracker accurately pins my location, so I'll say that that problem has been resolved.
What could be improved
It's been a few months and my experience with it is very positive save for the mentioned hitches during the first week of its release. With the initial phases over, it's time to talk on what I think can be improved with the app.
Optimization
Sometimes the app would slow down, as in while navigating and pressing buttons. For what is just an ordering app that doesn't do anything extra, it does feel that the app isn't optimized at times. Even their website feels the same in terms of the apparent slowness. The new app seemed like a rewrite at the back of my head, even if I could not verify it, because my order history since 2020 in the previous version just disappeared - the page was empty. But because this is an optimization problem, it's really up to the developers on how they can improve the fluidity of the app, and website for that matter, without affecting much of the UI or the underlying code too much to be a hassle for them and for us consumers.
Order Tracker Map
I would wish for the map page of the order tracker to be better integrated to the app. As it currently stands, it's just a WebView of the McDelivery website and looks to be detached from the rest. The map has to be navigated with two fingers instead of one, which is usually the case if it's in a web wrapper. Now, since this part of the delivery tracker is handled by LogiNext, it may be the case of lack of seamless integration due to implementation headaches with a third-party. But I feel that McDonald's Philippines should choose to invest in this better integration. Is this better integration really necessary when the current implementation does the same thing? No, not really. But if the seamless experience of ordering is paid much close attention during the app refresh, then the delivery tracker should be as well. After all, seeing if my order would arrive and where the driver is is critical because it involves food that is already paid for. I've made a mockup on what I think could be this better integration design could be below.
A wishlist
More on the Coupon page
The coupons page is your run of the mill discount vouchers hub. One can enter a coupon code, though I'm not sure on where one will get such a code; Lazada's food category is likely, though I haven't checked to be completely sure. The white space below it is for cards of available coupons. On each card, the coupon title is shown in bold with its description below in left-align. A yellow Use Now button is below the description and is right-align.
I just noticed that most of the time, the available coupons is just empty. As for the coupon codes, it's not apparent on where you could get such codes. The separate international McDonald's app's discount offers and codes do not seem to be compatible with the McDelivery PH app, I tried it before and just recently to be sure. Since McDonald's Philippines advertise both apps in their social media pages, it would be nice if both could somehow interface with one another, even it it's a strech. Having the codes work on the app, as the discount offers includes deliveries and take-outs, would likely increase installs for both apps which I'm sure would be swell for the analytics team.
A potential from the coupons
As one of the major players of the local Quick Service Restaurant industry, McDonald's Philippines is required to maintain or improve its standing by investing as much as possible in revenue-important areas, one of which is deliveries. Revenue expectedly dipped during 2020 when the pandemic started, but they nevertheless adapted and soldiered on which meant they were already on track to recovery by May 2021. It's also stated that 60% of total sales now comes from take outs and deliveries. As the Golden Arches continue to leverage deliveries as one of the important avenues for recovery to growth, I would like to query this: "Why not add the coupons in?"
Now coupons, depending on the deal, could be a probable loss in part of the company to attract more customers - though usually it's the most cost-effective way to attract and win back customers. As I noted earlier, the McDelivery PH app doesn't seem to offer coupons that often, if at all. There's the occasional "Free Delivery for Orders Above ₱300" ones, but other than that the Coupon page is just a white, blank expanse the majority of the time.
Offering a weekly coupon could entice existing customers to gravitate to the exclusive deals that can only be found on the McDelivery PH app instead of third-party apps. For an apples-to-oranges-but-also-kind-of-apples comparison, the multipurpose food and supermarket/mart delivery app Foodpanda took 70% market share as reported last April 2021, no doubt due to the daily deals they offered that spans different restaurants and marketplaces. Go to Foodpanda right now and one will be inundated with 20% off and 50% off with terms on a lot of restaurants. Now I'm not saying that McDonald's should follow this aggressive discount strategy, but offering a few coupons that change weekly can induce anticipation on a different deal - say a free burger, a free fries upsize, or a discount on rice bowls - theoretically increasing customer retention.
Another alternative is the integration of the coupon codes of the McDonald's app that I've touched on earlier. That app offers daily deals, discounts, and even exclusive items. That essentially ensures that people would keep using it should they want to go to a McDonald's. With their strategy focusing on take-outs and deliveries, I find that combining both would give customers more reason to use the McDelivery app over the third party providers.
Putting the love in Love ko 'to
The McDelivery PH app's redesign, and probably overhaul, is a solid standalone delivery app. Though it had its hitches at the start, it's soldiered on to be a mostly reliable companion when on the pinch food is needed - say a meeting or a presentation defense. Sometimes it would be slow on one update, then fast on another, then slow again, but that's usually solved from what I gathered - good job to the developers on their maintenance efforts - though I still think more optimization is needed as the back and forth slowness does come back. The design is a great improvement over the old one, with better quality of life features that make ordering and tracking a better experience without the need to guess on the driver's location. Possible improvements that I could see that's unrelated to optimization is a better integration of the map tracker to the app itself instead of a web wrapper, and a better coupon system that entices repeat customers.
Though there is one main advantage in using the McDelivery over the third-party delivery services that has nothing to due with exclusive menu items: ₱49 delivery fee vs. ₱59 for the third-party. Happy ordering, everyone.