Persistent Cart
The Context 💭
CxLoyalty is a company that creates white label loyalty products that was acquired by JPMC. The cart would clear out every time a user signed out or got timed out. If a user had a product in the cart they would have to search for it all over again when they signed back in. Persistent cart allowed for customer's carts to keep added products even if they left the site. This was a trailblazing feature as no one else in the travel space was doing this due to a variety of complications. I collaborated directly with product, tech, research and led my own UX team to deliver a seamless and delightful persistent cart experience.
The Problem 🤔
When shopping our site, customers lose everything in their cart when a sessions ends.
-
Across the landscape of online shopping 75% of people leave items in their cart
-
Customer sessions, such as on Chase, often time out on them thereby emptying their cart
-
After losing their items, the customer has to execute the search again and find the specific flight, hotel, car, etc. they liked again
-
Customers can’t currently save or favorite products
Requirements & Goals 🎯
I worked with product and tech to establish our requirements and goals.
Requirements
-
Allow items to be saved in cart
-
Items should automatically be saved
-
Users should be informed if price or availability changes upon returning to the site
Goal #1
-
Increase customer engagement and retention for returning users
-
Reinforce shopping for 15% of abandoned users
-
Set foundation for future features (wish-list, price update alerts and cart abandonment recovery emails)
-
Goal #2
-
Increment total revenue via abandoned cart workflows
-
Reduce average booking time for returning users
-
Increase conversion rate for customers
-
What are others doing? 👀
While carts being saved is common in e-commerce, it is not found on sites for booking travel due to the following:
-
Volatile prices
-
Prices are tied to supply and demand which leads to them changing frequently
-
-
Availability changing
-
Flights can get canceled or rescheduled and all travel products could sell out
-
-
Tied to a date
-
When you add a travel product to a cart it is associated with a day and time
-
Identifying the ideal user experience 😁
After exploring what is out there today and reviewing our requirements and goals, I crafted some key pieces to create a delightful user experience.
Provide accurate & relevant information
-
Provide up to date information in a helpful context to empower users to feel confident when making their booking.
-
Ensure the right amount of information is available on the ideal pages.
Be timely & non-intrusive
-
Display helpful alerts in a timely manner in a way that does not disrupt their journey on our site today.
Guides users
-
Enable users to make informed decisions to checkout with their products.
-
Ensure that there are no dead-ends in this experience.
Must be scalable
- The experience should not degrade in quality if there are many items in the users cart that change.
Iterate, iterate, and then iterate 🔄
After having a clear idea of what success looks like for both product and UX, I explored different approaches to solving the issue through iteration involving all stakeholders. These are a few of the concepts we had to work through before arriving to the design we tested.
Alerts
-
When should we alert users about items in their cart?
-
What style and level of alert should we use?
-
How intrusive should we be?
Amount of information
-
How much information should we place on the homepage vs. cart?
-
Does the solution scale if there are many items in the customer’s cart?
Inform of price changes
-
How do we show users that their price changed in the cart?
.png)
Inform of availability
-
How do we show users if there is limited availability?
-
What if something is no longer available?
User Research 👤
Once we completed our designs, we did a round of user research to validate our assumptions and inform our final designs. I worked closely with a UX researcher to complete this study. 6 Chase Travel agents and 5 customers were interviewed. Here are some of the findings that informed our designs:
Trip cart alert
Users wanted more details on what item changed and how it changed. We updated the alert in the trip cart to say the full name of the product and the exact change that happened.
Payment summary
Users wanted to know exactly how much their total changed when there are multiple items in the cart. A few users also assumed that because something was in their cart, it meant that it was reserved for them (which is not the case). We updated the payment summary to include the changes to the total and added a disclaimer to show that items are not reserved.
Low availability
The way we were showing low availability was overlooked during our study. We switched out the text for a badge that is more salient.
No longer available
Users wanted more info on removed items from cart and the alert felt like a dead end to them. Both agents and customers mentioned that a way to start a new search would be very helpful. We added in the details and a link to kick off a new search with auto-populated fields.
Tech roadbump ⚠️
After we tested and delivered our designs, we learned from the tech team that it would take 5+ seconds for the alert to appear on the homepage with the details the users wanted. This could easily cause a user to miss the alert and it would cause the page to shift when the alert finally loaded. We had to pivot and consider a new way to draw attention to the cart where users can find more information.
The Final Design ✨
Our final design we delivered included many new features to our trip cart. and checkout process.
Homepage alert
We introduced a homepage alert that has no detailed information so it can appear immediately upon landing on the site.
Detailed information in cart
The cart now has a variety of new features:
-
Detailed alert at the top of the page with price and availability changes
-
Each product in the cart shows how it changed
-
The payment summary shows the change to your trip total
Item no longer available
NoWhen an item is no longer available, we show an alert with a link to launch a new search with auto-populated fields.
Clear cart
Now that your cart can accumulate items, we added in the feature to clear your entire cart.