Jul 29, 2021

Building California Pizza Kitchen’s New Digital Ecosystem

By Dustin Newbold and Marcus Thompson

Engineering the Technological Infrastructure for an Iconic Restaurant 

As Covid 19 took a harrowing hold on the global economy, California Pizza Kitchen, like many establishments, found themselves confronted with what looked like it could be the death of dine-in. Profits were sliced, and sliced again, placing this beloved brand at the brink of bankruptcy. Down on dough, the time was ripe to get cooking on a new digital ecosystem that would return this pizzeria to prominence. 

But how? (See the work in our case study)

YML’s Initial Audit and Plan Of Action

The Approach

When CPK initially approached us, the pizza was tasty — ingredients fresh — but their user experience on the other hand, didn’t quite match the quality that they’re known for. In our audit, we identified a number of pain points that were added to the scope of work, which ultimately boiled down to three things: separating their existing account management services to tie them back into the marketing website, creating a custom order flow that added ease and velocity to the checkout process and a design refresh of the brand (more on that in another story). 

The Scope of Work

Before we were able to start building something new, it was important for us to identify CPK’s current data structure. Product, store and customer data, as well as store info, gift cards and marketing content — all necessary ingredients to the recipe — were being stored across separate services. Not only were these services a bit out of date, but they offered zero customization, which put CPK behind the knife in this remote, customer-centric world. 

The Proposition

YML’s engineering team proposed building a two-pronged, completely custom marketing experience. First, we’d identify and integrate a modern content management system. Second, we’d build a data structure to support the new site roll-out, as well as create a seamless user experience that painlessly handled everything from placing orders for curbside pickup, to payment and processing.

With a plan in place, it was time to get to work.

Customizing a Default UI 

Getting to Know Olo

Ever heard of Olo? Whether yes or no, you’ve probably used it. It stands for “Online Ordering” and it’s a digital platform that allows users to order food from online menus and prepay from their desktop or mobile device. CPK was already using their white label service, which meant they had very limited control over the UI. It was then our job to become experts in Olo so that we could effectively utilize their APIs without leaning on their default interface. 

Improving Order Flow Functionality

This created the opportunity for us to implement more functionality into the customer order flow in a myriad of ways such as allowing for a user to complete their checkout via the website the same as an in-house delivery and still have a third-party dispatcher (for instance, UberEats or DoorDash) deliver the order. This new flow was optimized for speed — and ultimately brought the fastest checkout from 20 clicks to just 5.

Creating an Agnostic System

The beauty of it all is that our custom UI is still using Olo, but if CPK ever wants to change vendors for account management, they have the capability and the direction to do so. Everything is custom, so if they were to change vendors, we can do that while still allowing them to utilize the best in class experience. That’s the power of thoughtful and effective engineering.

See the work in our case study

Baking 3 Services into 1  

Combining Paytronix, Olo, and CPK’s Database

CPK had their own marketing site that they controlled internally, but online ordering and their CRM were both hosted independently by Olo and Paytronix respectively. Our chief engineering challenge was to devise a method of taking three separate services and baking them into a single, cohesive UX. This would create a unified experience for the user — allowing CPK to drive more conversions from anywhere on the site. 

Additionally, decoupling the website would serve the brand long term. By converting what was a historically coupled set of UI/APIs and separating them out, the CPK platform was no longer beholden to the web alone and could connect with a variety of new endpoints down the road. For instance, if CPK wanted to pursue a voice integration — “Alexa, order me a large chicken bbq pizza from CPK” — then the Alexa app would utilize the same APIs we already have developed.

We didn't only build CPK to solve their current hurdles, but to help fuel their future.

Utilizing Olo’s APIs

Driving those conversions is possible because the content is driven by the CMS, so the call to action on the carousel kicks off the ordering process using Olo’s API services. Put plainly, this means that users can jump from the marketing site carousel straight to the cart and begin customizing an order with speed. This degree of streamlining was only made available through our engineering team’s clever conglomeration of services.

Adding Accessibility by Merging Datasets

Corporate Owned Restaurants and Franchises

California Pizza Kitchen, being the national corporation that they are, handled over 150 of their restaurants through the Olo service — but there were also a number of franchise restaurants peppered throughout the country that lived in an entirely separate database of their own. Since users were unable to begin an order until they selected a restaurant, it became an obstacle to show users locations that were stored in the CPK database, as well as restaurants that were integrated with Olo. 

Marrying the Datasets

YML intuited another engineering opportunity to marry these two datasets. The benefit of bunching them together is two-fold: users can quickly find a CPK location, and they can begin an order regardless of which dataset (franchise or company-owned) the restaurant needs to be pulled from. Hunger loves speed, so give them what they need.

A Lift on Location Services

Extending Functionality

Having all restaurant information stored in the same location was a huge plus in terms of accessibility, but optimizing the experience of getting customers from A to B is another story. To continue to craft as friction-free of a flow as possible, we subtly and succinctly extended functionality by combining dine-in and online hours. We also added an extension which allows users to add images to locations (for example, Google Maps) so that the storefront or inside of the restaurant could be seen prior to dining in. 

Leveraging Location Algorithm

In addition to browser-based APIs that the user can opt into and location-gathering based off of IP address, we wrote an algorithm to guide the user based on latitude and longitude. This allowed us to get users where they needed to be — with a pizza in front of them, and pronto. 

A Fresh and Functional Digital Experience

When California Pizza Kitchen approached us looking for a way to weather the pandemic pandemonium, we worked diligently to provide solutions for admittedly complex problems that were posing a threat to their ability to survive.  

Our re-thinking of the application and information architecture resulted in more engagement, a 100% increase in loyalty sign-ups, more customization and a significant lift (users completing the checkout process) from single digit to double digit conversation, overall by 2.5X, which is on the higher end of the industry average.

Stay tuned for our next story about how we used design to shine the idyllic warmth of the California dream throughout their theme — bringing the beach to the boardwalk — and everything between.   

About the Authors:

  • Marcus Thompson is a results-driven writer and content designer at YML who strives to make practical impact in culture through the lens of business and tech. His clients range from Polestar (Volvo) to Samsung.

  • Dustin Newbold is a Lead Software Engineer with 20 years of experience in web development and architecture with a primary focus on frontend engineering and security.