01 - Cart experience in funnel
A new feature design to improve checkout process for HelloFresh with the purpose of enhancing price transparency and recall for prospective customers which showed a 3% conversion rate uplift.
Details of the project
Company
Leading meal-kit company - HelloFresh
Project dates
Q2-3 2023, rolled out in 2024.
Role
Squad’s Product Designer
I designed a new cart feature to enhance price transparency and help users remember their selections throughout our conversions flow. Previously, users had to navigate back to the start of the checkout, leading to confusion and drop-offs. Our research showed that users often forgot their choices and costs as they moved through our funnel, which includes selecting a meal plan, registering, entering an address, and checking out. By integrating insights from usability testing and best practices, this feature aimed to improve the user experience and boost net conversions.
The challenge
Addressing user needs:
As our conversions funnel had different steps users didn’t remember what happened when they moved forward & they would not see the price again till payment step sometimes.
Business requirements:
Boosting net conversions & average order value (would allowing users to change their plan make them go for the smallest one?).
Technical constraints:
As this feature allowed users to change their plan at every step of the funnel, there was a lot of effort to implement.
Process
Research-Driven Insights:
Conducted thorough research, leveraging internal UXR resources, best practices, and competitor analysis.
Insights from User Behavior:
Identified user patterns through previous UX research conducted, analizing hotjar recordings : returning to adjust meal preferences or plan size in previous steps
Iterative process
Conducted several feedback sessions with designers and stakeholders, helping create an alignment with different teams on order summary topics.
Some of the versions I brought up for critique. 
Notes on files of the feedback captured and best practices.Solution
To align with typical e-commerce site patterns, I kept the cart in the navigation bar, and went with with a side-opening feature. I conducted a unmoderated usability + preference test for both desktop and mobile with 16 participants. Based on that test ratings, users found the feature easy to use, rating it an average of 4.5 out of 5. Though generally straightforward, minor confusion arose over save and continue button placement and instruction clarity.
“So yeah, this is, this looks easy. It looks easy for me to change my options as well.”“you can quickly ... change your summary or change your plan size, without having go to go straight back to the select plan option.”“This is exactly what I expected, there’s nothing that’s confusing.”
Version from Usability test. Users expected for it to be auto saved.Considering the technical constraints, I prepared 2 versions, one that was editable where users could edit their plan size and preferences, and one that wasn’t so we could test the impact of the feature more easily.
Results
The Non-editable cart showed a 3% conversion rate uplift post-A/B test rollout. The editable version showed success in subsequent test, though with slightly smaller gains which as of March of 2024 it has been rolled outreplacing the non-editable version, test showed that there was actually anincrease on average order value.
This project revealed the importance of a rigorous QA process to minimize production errors, such as inaccuracies in the order summary.
Learnings and next steps: Cart visibility remains a challenge, with plans underway to enhance it. The goal for the future is to offer a transparent pricing experience and streamline editing to potentially eliminate the need for a cart altogether.
