Project overview

In this case study, I addressed major usability issues in the Domino's Canada app by improving transparency and updating the user experience. I revamped the app to show product prices and calorie information during item selection, tackling user frustrations identified through primary and secondary research.


Additionally, I updated the app's visual design in away to align with contemporary UX/UI standards while keeping guidelines of Dominos brand in mind, resulting in a more intuitive and engaging interface.These improvements aim to increase user satisfaction, reduce cart abandonment.

Role

Role

UX design

Duration

Duration

3 weeks

Problem

Issue: Users are unable to see the prices of products while selecting items on the Domino's Canada app, only viewing them on the checkout screen. Additionally, the app does not display calorie information for added products, and the app’s visuals appear outdated.

Impact: The lack of transparency can frustrate users and lead to abandoned orders due to unexpected costs at checkout. The absence of calorie information may deter health-conscious customers, and outdated visuals can negatively impact user experience and brand perception.

Issue: Users are unable to see the prices of products while selecting items on the Domino's Canada app, only viewing them on the checkout screen. Additionally, the app does not display calorie information for added products, and the app’s visuals appear outdated.


Impact: The lack of transparency can frustrate users and lead to abandoned orders due to unexpected costs at checkout. The absence of calorie information may deter health-conscious customers, and outdated visuals can negatively impact user experience and brand perception.

Redesign Prototype

Redesign Prototype

Research

Secondary research

First, I checked the app store reviews to gather information about the problems customers are experiencing with the app. User feedback analysis is a powerful UX research tool. It’s also cheap and informative.

Reviews from App store

Reviews from App store

Insights from
Reviews

  • Many users reported that the app is not intuitive and confusing.

  • The app has an outdated look and feel.

  • Users experienced buggy and laggy performance, which is more of a development issue .

  • A common complaint was the absence of prices on the menu, which is a fundamental feature for any application.

Competitive analysis

Secondly, I conducted a competitive analysis of both direct and indirect competitors to understand how other companies are designing their apps. That includes Pizza Hut, Pizza Pizza, Little Caesars, Papa Johns and Uber Eats.

Insights from
competitive analysis

  • Domino's and one other app have outdated visuals and a cluttered interface.

  • All the apps, except Domino's and one other, show the changing price of items before checkout.

  • Only two apps provide allergen information for food items.

  • Domino's and two other apps lack consistency in displaying nutritional information, with only a few items having detailed nutritional info.

  • Domino's and one other app have outdated visuals and a cluttered interface.

  • All the apps, except Domino's and one other, show the changing price of items before checkout.

  • Only two apps provide allergen information for food items.

  • Domino's and two other apps lack consistency in displaying nutritional information, with only a few items having detailed nutritional info.

  • Domino's and one other app have outdated visuals and a cluttered interface.

  • All the apps, except Domino's and one other, show the changing price of items before checkout.

  • Only two apps provide allergen information for food items.

  • Domino's and two other apps lack consistency in displaying nutritional information, with only a few items having detailed nutritional info.

Problems with the existing App

These are some issues I noticed in the Domino’s app from my perspective as a user. I acknowledge that I don't know the app's exact statistics or the reasons behind certain design decisions.

  • Checkout page

    Findings

    1.1

    The user is taken directly to their cart, which is not standard as the user's cart will always be empty when first entering the application. Furthermore, The app doesn't follow standard practices and goes against what users expect in a food ordering process. breaking the Usability Heuristics of Consistency and Standards.

    Additionally, users might mistakenly think the Menu section will appear after clicking the large red 'Checkout' button.

    1.2

    Button label and icon of checkout button are Inconsistent.

    Solutions

    1.1

    After Selecting method of food order. app should take user directly to menu.

    1.2

    Button and icon should be of similar size. Moreover, there is no need of button and content of price needed when the cart is empty. (Your cart is empty. select menu or coupons to get started) would be sufficed.

  • Feast pizza’s page

    Toppings page

    Findings

    1.3

    1.4

    There's no price shown on the menu items and toppings page. The only way to see the price is by going to the checkout screen.

    Most of the food ordering app would show price upfront. However, Dominos choose to not show prices of the product not sure what is the reason behind this design decision.

    Solutions

    1.3

    Prices should be shown on each item menu.

    1.4

    Prices should be shown while selecting each or extra toppings.

  • Toppings page

    Order setting modole

    Findings

    1.5

    The "Add to Order" button appears both at the top and bottom right of the screen.

    1.6

    Outdated radio button with small touch point.

    Solutions

    1.5

    Remove the button at the top to reduce confusion. As both leads to checkout page so its is redundant to add two buttons for same function.

    1.6

    We can just make it standard size without using skeuomorphic style.

  • Checkout page

    Findings

    1.5

    There is too much information cramped on one screen, causing cognitive load.

    1.6

    Eyes drawn to upselling and promotions.

    Solutions

    1.5

    We can simplify the design and can give breathing room to all the information.

    1.6

    Upselling and promotions are essential for the business, but they should be toned down so that the important order information catches the user's attention first.

User research

Domino's targets customers are those who prioritize convenience and value quick and hassle-free food delivery. This includes busy families, students, and professionals looking for a convenient meal option.

For my research I approached qualitative methods. I conducted 5 think aloud exercise to determine the usability issues with the app.

  • Checkout page

    Findings

    1.1

    The user is taken directly to their cart, which is not standard as the user's cart will always be empty when first entering the application. Furthermore, The app doesn't follow standard practices and goes against what users expect in a food ordering process. breaking the Usability Heuristics of Consistency and Standards.

    Additionally, users might mistakenly think the Menu section will appear after clicking the large red 'Checkout' button.

    1.2

    Button label and icon of checkout button are Inconsistent.

    Solutions

    1.1

    After Selecting method of food order. app should take user directly to menu.

    1.2

    Button and icon should be of similar size. Moreover, there is no need of button and content of price needed when the cart is empty. (Your cart is empty. select menu or coupons to get started) would be sufficed.

  • Feast pizza’s page

    Toppings page

    Findings

    1.3

    1.4

    There's no price shown on the menu items and toppings page. The only way to see the price is by going to the checkout screen.

    Most of the food ordering app would show price upfront. However, Dominos choose to not show prices of the product not sure what is the reason behind this design decision.

    Solutions

    1.3

    Prices should be shown on each item menu.

    1.4

    Prices should be shown while selecting each or extra toppings.

  • Toppings page

    Order setting modole

    Findings

    1.5

    The "Add to Order" button appears both at the top and bottom right of the screen.

    1.6

    Outdated radio button with small touch point.

    Solutions

    1.5

    Remove the button at the top to reduce confusion. As both leads to checkout page so its is redundant to add two buttons for same function.

    1.6

    We can just make it standard size without using skeuomorphic style.

  • Checkout page

    Findings

    1.5

    There is too much information cramped on one screen, causing cognitive load.

    1.6

    Eyes drawn to upselling and promotions.

    Solutions

    1.5

    We can simplify the design and can give breathing room to all the information.

    1.6

    Upselling and promotions are essential for the business, but they should be toned down so that the important order information catches the user's attention first.

  • Checkout page
    Findings

    1.1

    The user is taken directly to their cart, which is not standard as the user's cart will always be empty when first entering the application. Furthermore, The app doesn't follow standard practices and goes against what users expect in a food ordering process. breaking the Usability Heuristics of Consistency and Standards.

    Additionally, users might mistakenly think the Menu section will appear after clicking the large red 'Checkout' button.

    1.2

    Button label and icon of checkout button are Inconsistent.

    Solutions

    1.1

    After Selecting method of food order. app should take user directly to menu.

    1.2

    Button and icon should be of similar size. Moreover, there is no need of button and content of price needed when the cart is empty. (Your cart is empty. select menu or coupons to get started) would be sufficed.

  • Feast pizza’s page
    Toppings page
    Findings

    1.3

    1.4

    There's no price shown on the menu items and toppings page. The only way to see the price is by going to the checkout screen.

    Most of the food ordering app would show price upfront. However, Dominos choose to not show prices of the product not sure what is the reason behind this design decision.

    Solutions

    1.3

    Prices should be shown on each item menu.

    1.4

    Prices should be shown while selecting each or extra toppings.

  • Toppings page
    Order setting modole
    Findings

    1.5

    The "Add to Order" button appears both at the top and bottom right of the screen.

    1.6

    Outdated radio button with small touch point.

    Solutions

    1.5

    Remove the button at the top to reduce confusion. As both leads to checkout page so its is redundant to add two buttons for same function.

    1.6

    We can just make it standard size without using skeuomorphic style.

  • Checkout page

    Findings

    1.5

    There is too much information cramped on one screen, causing cognitive load.

    1.6

    Eyes drawn to upselling and promotions.

    Solutions

    1.5

    We can simplify the design and can give breathing room to all the information.

    1.6

    Upselling and promotions are essential for the business, but they should be toned down so that the important order information catches the user's attention first.

Comments from the user research

Comments from the user research

Insights from
research

Insights from research

  • Lack of visuals/information overload.

  • Lack of Transparency.

People need visuals of the products to help them visualize the food before ordering since they can't judge taste and smell through the app. Pictures are the next best way to determine the quality of the food.

Some screens have too much information and are text-heavy, with font sizes ranging from 10 pt to 14 pt. This can create legibility issues, overwhelm users, and make it difficult for them to notice essential content.

Design

The most important problems and how I solved them

  • Lack of clear pricing information during the selection process.

  • Absence of comprehensive nutritional information for menu items.

  • Cluttered and outdated user interface.

  • Confusing navigation and interaction patterns.

  • Inconsistent button labels and icons.

  • Overwhelming amount of text and information on some screens.

  • Insufficient visuals of food products to aid user decision-making.

Design Exploration

Although I went through a few iterations before finalizing the design, my goal was to align the UI with the current app's branding while enhancing usability while maintaining the current design pattern. I conducted testing on these two prototypes with 5 participants.

Three out of five participants chose B over A.

A

  • Reduced space for order description..

  • Inconsistent interaction patterns.

  • Combined price and action into one button.

  • Additional information provided upfront.

B

  • Less crowded layout with more space for order descriptions.

  • Consistent interaction pattern.

  • Separate action button from price description.

  • Additional information placed at the bottom of the page.

  • Adding Price

    In the current design their is no point of reference on the prize of products only calories count of per slice which is vague as no one have time to calculate the whole caloric count for their order. On contrary I have calorie count per slice on this page.

    While the calorie count per slice is displayed on the menu page, the topping page, which users access after selecting their desired pizza, shows the total calorie count for the whole product, including sides.

    Current feast
    pizza page
    Re-design
  • Pizza description & customization

    I created a card which would give live visual of toppings on the pizza, Crust selected and description of toppings calories of entire order.

    In the current design, we have two different interaction patterns, which is unnecessary. Therefore, I standardized the interaction patterns for both quantity and toppings.

    Lastly, the main problem user had that they cant see price of order before checkout. Therefore, I introduced sticky button along with price indicator on the bottom of the screen to resolve the problem.

    Current Toppings
    Page
    Re-design
  • Optimizing checkout screen

    The current checkout screen has a cluttered interface with many focal points.

    First, I reorganized the screen’s hierarchy to focus users’ attention on their order items and provide sufficient spacing between different elements.

    While upselling and promotions were prominent in the original design for business reasons, I retained these elements but moved them to a secondary position in the hierarchy.

    Finally, I added a sticky checkout button at the bottom of the screen to ensure consistency with other screens, making it easier for users to check out without having to scroll down all the way to the bottom of the page.

    Checkout screen
    Re-design

  • Current feast

    pizza page

    Re-design

    Adding Price

    In the current design their is no point of reference on the prize of products only calories count of per slice which is vague as no one have time to calculate the whole caloric count for their order. On contrary I have calorie count per slice on this page.


    While the calorie count per slice is displayed on the menu page, the topping page, which users access after selecting their desired pizza, shows the total calorie count for the whole product, including sides.

  • Current Toppings

    Page

    Re-design

    Pizza description & customization

    I created a card which would give live visual of toppings on the pizza, Crust selected and description of toppings calories of entire order.

    In the current design, we have two different interaction patterns, which is unnecessary. Therefore, I standardized the interaction patterns for both quantity and toppings.

    Lastly, the main problem user had that they cant see price of order before checkout. Therefore, I introduced sticky button along with price indicator on the bottom of the screen to resolve the problem.

  • Checkout screen

    Re-design

    Optimizing checkout screen

    The current checkout screen has a cluttered interface with many focal points.

    First, I reorganized the screen’s hierarchy to focus users’ attention on their order items and provide sufficient spacing between different elements.

    While upselling and promotions were prominent in the original design for business reasons, I retained these elements but moved them to a secondary position in the hierarchy.

    Finally, I added a sticky checkout button at the bottom of the screen to ensure consistency with other screens, making it easier for users to check out without having to scroll down all the way to the bottom of the page.

  • Current feast pizza page

    Re-design

    Adding Price

    In the current design their is no point of reference on the prize of products only calories count of per slice which is vague as no one have time to calculate the whole caloric count for their order. On contrary I have calorie count per slice on this page.

    While the calorie count per slice is displayed on the menu page, the topping page, which users access after selecting their desired pizza, shows the total calorie count for the whole product, including sides.

  • Current Toppings Page

    Re-design

    Pizza description & customization

    I created a card which would give live visual of toppings on the pizza, Crust selected and description of toppings calories of entire order.

    In the current design, we have two different interaction patterns, which is unnecessary. Therefore, I standardized the interaction patterns for both quantity and toppings.

    Lastly, the main problem user had that they cant see price of order before checkout. Therefore, I introduced sticky button along with price indicator on the bottom of the screen to resolve the problem.

  • Checkout screen

    Re-design

    Optimizing checkout screen

    The current checkout screen has a cluttered interface with many focal points.

    First, I reorganized the screen’s hierarchy to focus users’ attention on their order items and provide sufficient spacing between different elements.

    While upselling and promotions were prominent in the original design for business reasons, I retained these elements but moved them to a secondary position in the hierarchy.

    Finally, I added a sticky checkout button at the bottom of the screen to ensure consistency with other screens, making it easier for users to check out without having to scroll down all the way to the bottom of the page.

Conclusion

Through this project, I learned the importance of user-centered design in creating an intuitive and efficient app experience. Addressing the key issues of unclear pricing, inconsistent information, and outdated visuals highlighted how critical transparency and consistency are for user satisfaction and retention.

Key Takeaways

  • User-Centered Design: Prioritizing user needs and expectations is essential for enhancing usability and satisfaction.

  • Consistency: Maintaining consistent interaction patterns and information display improves user experience and trust in the app.

  • Visual Appeal: Updating the app's design to a modern, clean interface can positively impact user perception and engagement.

  • Business Impact: Implementing these improvements can drive higher order completion rates, increased customer loyalty, and a stronger market position against competitors.

  • User-Centered Design: Prioritizing user needs and expectations is essential for enhancing usability and satisfaction.

  • Consistency: Maintaining consistent interaction patterns and information display improves user experience and trust in the app.

  • Visual Appeal: Updating the app's design to a modern, clean interface can positively impact user perception and engagement.

  • Business Impact: Implementing these improvements can drive higher order completion rates, increased customer loyalty, and a stronger market position against competitors.

  • User-Centered Design: Prioritizing user needs and expectations is essential for enhancing usability and satisfaction.

  • Consistency: Maintaining consistent interaction patterns and information display improves user experience and trust in the app.

  • Visual Appeal: Updating the app's design to a modern, clean interface can positively impact user perception and engagement.

  • Business Impact: Implementing these improvements can drive higher order completion rates, increased customer loyalty, and a stronger market position against competitors.

Overall, this project underline the need for continuous user feedback and competitive analysis to keep the app aligned with user expectations and industry standards.

Top

Top

Top

More Projects

Hive: A housing app

View case study

View case study

View case study

Stylist: A barber app

View case study

View case study

View case study

Let's connect

Thanks for making it to the bottom of this page! If you're interested in knowing more about me, you can reach out at

neerajchopra22@gmail.com

Neeraj Chopra. UX Designer

Let's connect

Thanks for making it to the bottom of this page! If you're interested in knowing more about me, you can reach out at

neerajchopra22@gmail.com

Neeraj Chopra. UX Designer

Let's connect

Thanks for making it to the bottom of this page! If you're interested in knowing more about me, you can reach out at

neerajchopra22@gmail.com

Neeraj Chopra. UX Designer