Shangri-la
Shangri-la
© 2022
The COVID-19 pandemic underscored the need for businesses to go digital. Due to Shangri-la's outdated website, I created a user-friendly mobile food ordering app.
Role - Sole UX Designer · Freelanced creating a dedicated food ordering app for a local restaurant
Contributions - Conducted user and market research focused on discovering ways to design user flows to improve item discovery and efficiency of food ordering · Created high-fidelity prototypes · Conducted usability testing · Rebranding
Tools - Figma · Excel · Jamboard · Google Forms · Miro
© 2023
The COVID-19 pandemic underscored the need for businesses to go digital. Due to Shangri-la's outdated website, I created a user-friendly mobile food ordering app.
Contributions - Conducted user and market research focused on discovering ways to design user flows to improve item discovery and efficiency of food ordering · Created high-fidelity prototypes · Conducted usability testing
· Rebranding
Role - Sole UX Designer · Freelanced creating a dedicated food ordering app for a local restaurant
Tools - Figma · Excel · Jamboard · Google Forms · Miro
Shangri
Shangri
-
-
la
la
Shangri
Shangri
-
-
la
la
The Problem
The Problem
During the pandemic, customers at a local Asian-fusion restaurant struggled with ordering food and finding food info. Given that most of their traffic was through mobile devices and a need for replicating human interaction into the process, I designed a mobile app for them to reduce the volume of phone call orders, while improving the overall food ordering experience.
During the pandemic, customers at a local Asian-fusion restaurant struggled with ordering food and finding food info. Given that most of their traffic was through mobile devices and a need for replicating human interaction into the process, I designed a mobile app for them to reduce the volume of phone call orders, while improving the overall food ordering experience.
Business Goals
Business Goals
Shangri-la wanted to ensure that customers could effortlessly order, discover newly released dishes, and remain competitive in the market.
Shangri-la wanted to ensure that customers could effortlessly order, discover newly released dishes, and remain competitive in the market.
Current Experience
Current Experience
Final Design
Final Design
Discover
Discover
Competitive Audit
Competitive Audit
I conducted research on similar local restaurants to Shangri-la and looked at their digital food ordering experience. I then assessed them based on their First Impressions, Interaction, Visual Design, and Content.
I conducted research on similar local restaurants to Shangri-la and looked at their digital food ordering experience. I then assessed them based on their First Impressions, Interaction, Visual Design, and Content.
Areas of Opportunity For Shangri-la: Consistent Brand Identity, User-Friendly Navigation, Seamless Ordering Experience, Comprehensive Information & Visuals
Areas of Opportunity For Shangri-la: Consistent Brand Identity, User-Friendly Navigation, Seamless Ordering Experience, Comprehensive Information & Visuals
Stakeholder Interviews & Surveys
Stakeholder Interviews & Surveys
Interviewed 20 customers, Employees, and Owners. Main goal was to understand the major pain points in the food ordering experience from both sides and align with business goals.
Interviewed 20 customers, Employees, and Owners. Main goal was to understand the major pain points in the food ordering experience from both sides and align with business goals.
User Journey Mapping
User Journey Mapping
Once I gathered the necessary quantitative and qualitative data I needed, making a journey map on customers was necessary to understand their food ordering experience. I took a look at people who order in groups, people who like to try new food, and people who order the same thing repeatedly.
Once I gathered the necessary quantitative and qualitative data I needed, making a journey map on customers was necessary to understand their food ordering experience. I took a look at people who order in groups, people who like to try new food, and people who order the same thing repeatedly.
Research Findings
Research Findings
Personalized Ordering Experience
Personalized Ordering Experience
Customers want a fun and evolving experience that remembers their recent & favorite orders enhancing efficiency and familiarity.
Customers want a fun and evolving experience that remembers their recent & favorite orders enhancing efficiency and familiarity.
All Traffic Through Phone Calls
All Traffic Through Phone Calls
All orders are placed over the phone, which puts pressure on the employees and creates a frustrating experience for customers during busy hours.
All orders are placed over the phone, which puts pressure on the employees and creates a frustrating experience for customers during busy hours.
Ineffective Food Discovery Experience
Ineffective Food Discovery Experience
The menu is overwhelming and inefficient, lacking search/filter options, visual examples, and easy access to new items.
The menu is overwhelming and inefficient, lacking search/filter options, visual examples, and easy access to new items.
Order Progress is Misleading
Order Progress is Misleading
When placing an order only an approximate time window is given. This means many customers come early or their order is past the time making this experience frustrating.
When placing an order only an approximate time window is given. This means many customers come early or their order is past the time making this experience frustrating.
Ideation
Ideation
Sketches
Sketches
Sketching enabled rapid iteration of essential components for the food ordering app. For each main part, I generated 4-5 versions and selected parts I liked to come up with a preferred design.
Sketching enabled rapid iteration of essential components for the food ordering app. For each main part, I generated 4-5 versions and selected parts I liked to come up with a preferred design.
Sitemapping
Sitemapping
Since I was the only person working on this, I wanted to make sure that a developer would have everything they would need to build this app easily. One of the first parts was creating a sitemap
Since I was the only person working on this, I wanted to make sure that a developer would have everything they would need to build this app easily. One of the first parts was creating a sitemap
Food Ordering User Flow
Defining a user flow was key to build the structure behind the available choices and who someone will discover food items and order using the app.
Defining a user flow was key to build the structure behind the available choices and who someone will discover food items and order using the app.
Low-fidelity Designs and Usability Testing
Low-fidelity Designs and Usability Testing
From research, we received important feedback:
Users wanted a way to call the restaurant from any page.
Businesses & users wanted easy discovery of deals & updates on the home page.
Move recommended items to homepage to increase focus on food item selected.
Emphasis on recording order history and progress for fast and easy access/use.
The use of images for food and food groups is crucial for recognition.
From research, we received important feedback:
Users wanted a way to call the restaurant from any page.
Businesses & users wanted easy discovery of deals & updates on the home page.
Move recommended items to homepage to increase focus on food item selected.
Emphasis on recording order history and progress for fast and easy access/use.
The use of images for food and food groups is crucial for recognition.
Style Guide and Components
Style Guide and Components
Final Design
Final Design
Personalized Ordering
Personalized Ordering
Personalized Ordering (Home Page)
Personalized Ordering (Home Page)
The home page features numerous ways to order that adapt to customers' needs.
The home page features numerous ways to order that adapt to customers' needs.
Announcements and new items remain at the top, allowing the restaurant to share important updates with customers.
Recent food items show items that customers have been looking at and might be interested in.
Favorite food items that customers enjoy are easily accessible for quick selection.
Recommendations, or "Chef's Specials," offer staff-recommended items, mimicking a personal interaction with the customer.
Announcements and new items remain at the top, allowing the restaurant to share important updates with customers.
Recent food items show items that customers have been looking at and might be interested in.
Favorite food items that customers enjoy are easily accessible for quick selection.
Recommendations, or "Chef's Specials," offer staff-recommended items, mimicking a personal interaction with the customer.
Orders Page
Orders Page
Orders page allows for tracking of current orders and progress as well as a customers' order history to ensure a seamless process for people who order the same items.
Orders page allows for tracking of current orders and progress as well as a customers' order history to ensure a seamless process for people who order the same items.
Personalized Ordering (Menu Page)
Personalized Ordering (Menu Page)
The menu has been redesigned for efficient, seamless food discovery, inspired by customer-staff interactions. Selected item pages feature detailed descriptions, visuals, & an option to favorite items.
The menu has been redesigned for efficient, seamless food discovery, inspired by customer-staff interactions. Selected item pages feature detailed descriptions, visuals, & an option to favorite items.
Enhanced Search and Filter Capabilities
Enhanced Search and Filter Capabilities
Customers can now either browse through food groups, search or filter food items to fit customer's needs. The first filter option draws inspiration from how a customer would interact with an employee at the restaurant featuring best sellers, trending and staff picks.
Customers can now either browse through food groups, search or filter food items to fit customer's needs. The first filter option draws inspiration from how a customer would interact with an employee at the restaurant featuring best sellers, trending and staff picks.
Personalized Ordering (Checking Out)
Personalized Ordering (Checking Out)
A user has access at almost every point to easily navigate back, edit food items and instructions for delivery or pickup. There is also an additional feature to order ahead limiting the amount of orders during busy hours to 10 vs 20 on non busy hours in intervals of 30 min.
A user has access at almost every point to easily navigate back, edit food items and instructions for delivery or pickup. There is also an additional feature to order ahead limiting the amount of orders during busy hours to 10 vs 20 on non busy hours in intervals of 30 min.
Results
Results
User testing was conducted using the prototypes that were created. With the designs being made based on data collected from customer interviews we received positive feedback.
90% could find new menu items, which was a drastic increase from before. 85% of users found the app to be an easier ordering experience. 95% of customers thought the menu was easier to navigate. A 60% decrease in time spent discovering additional items was recorded. Order placement time reduced dramatically (mainly from not having to wait and feeling like their questions on food items were answered.
Shangri-la expressed their happiness with the overall design and felt that the information cards at the top of the home page were a great addition to helping users find out new info, they expressed excitement about how much this would help them alleviate their issues with numerous calls and extensive wait times.
Some feedback I gave for them was to consider the number of food items to be a factor when limiting the amount of orders when ordering ahead is selected. I also mentioned adding some incentives to boost the use of the app including deals and discounts exclusive to using the app.
User testing was conducted using the prototypes that were created. With the designs being made based on data collected from customer interviews we received positive feedback.
90% could find new menu items, which was a drastic increase from before. 85% of users found the app to be an easier ordering experience. 95% of customers thought the menu was easier to navigate. A 60% decrease in time spent discovering additional items was recorded. Order placement time reduced dramatically (mainly from not having to wait and feeling like their questions on food items were answered.
Shangri-la expressed their happiness with the overall design and felt that the information cards at the top of the home page were a great addition to helping users find out new info, they expressed excitement about how much this would help them alleviate their issues with numerous calls and extensive wait times.
Some feedback I gave for them was to consider the number of food items to be a factor when limiting the amount of orders when ordering ahead is selected. I also mentioned adding some incentives to boost the use of the app including deals and discounts exclusive to using the app.