Repolish Grubhub
Grubhub is a redesign project that offers tter mobile food ordering and delivering experiences for old customers, existing users, and potential audience, aiming to create functional and visual designs to drive more traffic.

Time

Eight Weeks

Tools

Adobe XD
Adobe Photoshop
Adobe Premiere Pro
Google Form
Google Slides
Miro

My Role

(All Creation)
Product Designer

Deliverables

Research
UX Strategy
‍Accessibility Design
Design X Business
UX/UI + Interaction Design
Visual Design + Branding
Low/High-Fi Prototyping
Inspiration
When
Pandemic - We suffered from Pandemic in the U.S since 2020
Who
People - Everyone follow the stay-at-home orders we need to eat.
Where
Stay-at-home - People use food ordering/delivery app at home.
Why
I am a user - I am long time users for several food delivery apps.
As a long-time food order/delivery app user, I realize, how come and why I don't use Grubhub like before? Why do I use DoorDash more than Grubhub? So, I started to google Grubhub.
Problem Context
As a marketing and business background, I care about sales. First, I click the market share chart to know what users prefer and how dramatically the users' have changed during the past few years. Grubhub is not a non-profit company, and I start to find the reasons from the current app why users prefer to use UberEats and Doordash.
‍
Grubhub's business lose sales that means they lost users because users pay or use Grubhub services
Users who from the Apple/Google Play store complain about the app is hard to use:
‍
1. Too many user steps to add to chart
2. Unclear pickup/delivery navigation and messages
3. App is difficult to use
4. Users are hard to understand the UI
The Goals
A new Grubhub aims to offer a better user experience and user interface to get more users back, grab potential customers, create user engagement, and aims to increase business sales back to the Top One like 2016.
⭐️ Users
⭐️ Clients (Restaurant)
⭐️ Drivers
Research, Strategy, UX
Here are the original Grubhub app user interface looks as below. From left to right  👉🏻 :
A loading page, Basic restaurant list, Clunky menu, and Unclear promotion list.
Look into heuristic evaluation. The cuisines and refine take 2 & 3 steps to the restaurant, and there is no clear pickup and delivery on the main page. Promotion is only shown on the reward page, and it takes 3 steps.
‍
Compared to other top 3 delivery apps - Uber Eats, Doordash, and Postmates in the market, Grubhub's features' are missing Category Search, Pickup in Navigation, add to Favorite restaurant, Group Order.
According to GrubHub white paper's research & reliable reports like McKinsey, Forbes, Financial Times and more, we found out users decide by $ 0 delivery fee, Cuisine, Time, Food category, and most users are Males from Age 25 - 45.
90% of guests research a restaurant online before dining. Most diners in the U.S. decide what to eat within 2 hours of their meal. For 79% of diners, “taste” is the main factor deciding where to eat.
Millennials Users
Male Users
Age 25 - 45
Use the same app more than 2 times per week
Use food category to find their food
15% Millennials users use Pickup per week
In Addition, from the user interviews, I collect three users who are also using Uber Eats, DoorDash, and Grubhub and care about the price, promotion, and user interface. They suggest that users are looking for a new Grubhub app, including color hierarchy, fewer user steps, pickup icon, store time/close, vivid icons, easy-to-understand UI, and clear discount.
‍
Based on user research, I create opportunities for these features for new UI to enhance users' satisfaction.
1. Fewer steps for the peak time orders
2. Showing express Images/discounts/store times and rating.
3. Pickup as a navigation
‍
After I collect the features ideas that there are key moments, move to the following steps to Identify and find improvements.
Design, Prototype, Design x Business, Accessibility
Visual Design
using restaurant/food principle - Michelin Red, I create a dark red as a new Grubhub color and use white and clear color to make the food images stand out and express clean style. Grubhub's original color is bright red and changed to a dark red to keep the branding, and users are easy to recognize the new dark red.
‍
Keep the original Open Sans font and use the brand new color palette to enhance Grubhub's branding. Use 3D icons as new iconography in Food Category and Navigation. 3D is the trend in 2021 - 2022 due to huge numbers of millennials users.
The Pickup icon changes into a specific style, like Christmas season.
Wireframes
Starting from the rough wireframe and create the digital wireframes.

Iterations
Starting from the rough sketch wireframe and create the med fility
Design X Business.
The research makes me understand that users use Grubhub during four peak times to catch more sales. During the research, I went to restaurants and talked to the owners, found out that restaurants owners (clients) manually type in their food on the merchant portal, and they can easily remove and add meals to each category. It is an excellent opportunity for users and clients, similar to popular food at the top of the restaurant list.
‍
Peak time icon (B2C) - circle in gold color
Users click the most peak time orders: Brunch, Coffee, Irish Bars and etc.
Popular (B2B/B2C) - circle in red color
Customers are easy to order popular or signature food from the restaurants.
Accessibility Design.
Everyone stays at home during the pandemic.
‍I care about people who lives alone with disabilities and they can use the Grubhub app to order food, so I add Voice search for them. To meet the needs of all three segments, here are some types as real people's issues:
Poor-sight, Age, and Color-blindness.
Final Design
Here are the new Grubhub major user interface looks as below.
From left to right  👉🏻 :
A loading page, Homepage, Pickup, Restaurant, Rewards, and Orders.
Outcome
I send the final design to the research users. 96% prefer the final design instead of the current Grubhub app. Users like the new user interface, revise features and care about the promotion even if they don't use it.
Impacts
The new Grubhub design can solve the current users’ pain points and meet the users need and satisfactions. I believe the new design also can attract the users, bring the clients in and connect to the drivers. Once Grubhub get popular in the market, the stakeholders will happy about it.  
Takeaway
I enjoyed working on this redesign project since I am a long-time Grubhub user.
User Research between target market research, market research, user interviews, and actual user interviews and how the research statistic led me to the proper designs to solve the user's pain point.
I also learned visual design and user flow and received helpful feedbacks during interviews and surveys. It showed me that mobile apps are essential to pay attention to small details, and they can either make or break the user's experience when not well thought out and fewer steps help users to make an order easily, so do not let users think!

NEUROME

Brain Technology - Find a Better You

UX/UI  Design

DESIGN AWARD WINNING

Leonardo da Vinci

The Greatest Innovations into an Interaction Timeline  

UI & Interaction Design

DESIGN AWARD WINNING

Piet

Dogs in Art Collections - Discover Fluffy Arts

Product Design

DocuPal AI

Software Company at Silicone Valley

Product Designer at LearningPal

LEARNINGPAL

© 2022 Designed by Lucille Huang. All Rights are Reserved.