Preston Crouse
Sr UI/UX Designer

Olive Garden 1.0 to 2.0

Upgrading Olive Gardens aging mobile app to the modern app world.

Image alt tag

The Challenge

Reduce the friction of ordering in the app by increasing the size of touch points, using gesture controls and leveraging onboard device experiences to facilitate faster editing of orders. Improve the Wait List feature for customers who are looking to dine-in and provide better transparency on wait times. Convince stakeholders to reshoot the entire Olive Garden menu selection so we could highlight dishes during the ordering experience.

Feature List

  • A complete view of the Olive Garden menu and detail pages for specific items to allow customization

  • Use on device localization to allow customers to select specific stores in their chosen location.

  • Comprehensive search function for the menu and store locations

  • A complete e-commerce flow including ordering, cart, payment, and confirmation

  • Join the Wait List feature for restaurants that allow customers to select their location, party size, and estimated time for dining in.

  • A new photo shoot of the Olive Garden menu to be used in the app and highlight dishes.

  • Craft a new design system for speedy turnover of designs to stakeholders and quicken development time with reusable components.

  • A modern visual design to bring the Olive Garden app into a new era.

Crafting a New UI Experience for Olive Garden Restaurants

Sprint 1

Welcome, Login, Account Creation, Find Location, Menu, & Menu Item Detail.

This was the meat of the app and the largest sprint. It was during this phase we really wanted to push a new and friendly design. I really wanted to put menu imagery front and center to entice the customer to order.

We implemented a pull down function on dishes on the Menu Item Detail Page so the customer could interact with the actual dish. This helped our team convince the Olive Garden stakeholders to reshoot the entire menu specifically for the app.

We met with stakeholders every couple of days to review and critique the designs. I often had to make drastic design changes in one day then present the next for approval.

Crafting a New UI Experience for Olive Garden Restaurants

Sprint 2

Cart, Checkout, Payment, Confirmation, Quick Reorder, & Payment Settings

During this sprint my team and I really pushed for using on device swipe gestures for editing the cart, which led to some initial contention with stakeholders who wanted a more traditional experience.

We strived to improve the cart from the existing app which heavily relied on text. We wanted clear imagery of the customers selected items and the ability see all of their customizations at glance.

Crafting a New UI Experience for Olive Garden Restaurants

Sprint 3

Join Wait List & Mobile Pay

The final sprint! With also one of the biggest features for stakeholders, Join the Wait List.

This feature allowed customers to see wait times for restaurants prior to travel, choose their party size and reserve a spot on the wait list all from their device.

This was challenging to design for because our team wanted to provide an accurate time to the customer but many restaurants did not have that ability. We ended up leveraging data from the restaurant managers on average placement time for groups as they arrive to service an accurate time for customers in the app.

The Final Prototype

What have you learned from this project?

I made this micro-animation for adding an item to the cart that comes down and covers a portion of the header. After launch we saw some complaints about the animation taking too long and looking back on it I understand the complaint. I think we could have implemented the animation a bit better and made it faster and/or reduced the size of it so it would not be so disrupting.

I really wanted to implement more micro-animations into the design but I learned you need to thoughtful of where you are using them and to limit any disruptions.

100+
Screens
4.8+
App Store Reviews
75+
New menu images