Increasing Santafoo's Conversions by 20%: Reducing Drop-Offs with Design Tweaks

About Santafoo

Santafoo is an innovative grocery delivery app based in Marseille, France, founded in September 2021. The app focuses on providing fresh, local, and sustainably sourced products, emphasizing a commitment to the environment, local producers, and social responsibility.

The majority of the products offered by Santafoo are sourced from within 200 kilometers of Marseille, supporting local agriculture and reducing the carbon footprint associated with food transportation. The company is dedicated to transparency, ensuring customers can trace the origins of their purchases, whether from local farmers, small producers, or sustainable sources.

As of mid-2023, Santafoo has expanded its product range to include over 1,000 items, categorized into fresh produce, dry goods, hygiene products, and more, with a special focus on minimizing food waste. The company’s success in Marseille has led to plans for expansion to other regions, with Aix-en-Provence being the next target.

Context

Problem Description

Santafoo was experiencing a significant challenge with its app. Despite the initial success in attracting users, the app faced a high dropoff rate, meaning that many users were not returning after their first interaction. Additionally, the conversion rate—turning active users into paying customers—was notably low. The client approached us to uncover the underlying reasons for these issues and to identify areas for improvement that could enhance user engagement and boost conversions. My role as a UI/UX designer was to analyze the user experience and design solutions that would address these challenges effectively.

User Persona

The app was primarily designed for a persona that values convenience and quality in their grocery shopping experience. Typically, these users are urban residents of Marseille and Aix-en-Provence who lead busy lives and appreciate quick, reliable access to fresh, local products. The user base is diverse, ranging from young professionals and families to older adults who prefer the ease of having groceries delivered directly to their doorstep. Despite the variety in demographics, all users share a common desire for a seamless shopping experience that aligns with their eco-conscious and health-conscious lifestyles.

Problem Identification

Gathering Insights in Google Sheets

After analyzing the user behavior through Smartlook session recordings, I documented the drop-off reasons in an Excel sheet. The sheet contains detailed observations from the videos, listing specific issues and remarks for each session where problems leading to user drop-offs were identified.

This structured approach helped in pinpointing key problem areas and understanding user pain points, allowing us to prioritize issues and implement targeted design solutions to enhance the app's user experience. The insights derived from this analysis provided a clear direction for making improvements that directly addressed user frustrations and drop-off triggers.

Next, I showcased a sample analysis of the monthly data, where I broke down user interactions and drop-off points. The analysis involved simplifying the raw data to identify the main pain points causing user frustration. By mapping these issues to specific user behaviors observed in the Smartlook recordings, I was able to prioritize problems based on their frequency and impact on conversions.

From this simplified data, I highlighted the necessary design changes needed to address each pain point. The step-by-step approach ensured that each design implementation directly targeted a specific issue, making the app more user-friendly and helping to improve overall conversion rates. This method not only streamlined the problem-solving process but also made it easier to communicate the rationale behind each design decision.

Pain Points Identified

Minimum Order Value Not Reached (12.21%)
Out-of-Stock Confusion (New Issue Identified)
Missing Product Details
Technical Issues (Buffering Payment Page: 1.41%)
Low-Frequency Issues (0.47% - 0.94%)

Prioritizing The Data

Priority 1: Minimum Order Value Not Reached

Issue: Many users (26 out of 213) did not complete a purchase because their cart did not meet the minimum order value. This barrier may have discouraged customers from proceeding with the checkout.
Hypothesis: Users may not have been aware of the minimum order requirement upfront or found it too high, causing them to abandon their carts.
Priority: High. This issue directly affects a significant portion of users, and reducing or clearly communicating the minimum order requirement could help increase conversion rates by minimizing abandoned carts.

Priority 2: Out-of-Stock Confusion

Issue: When multiple items were added to the cart, the app showed a generic "out of stock" tag without specifying which items were unavailable. This caused confusion and led to cart abandonment.
Hypothesis: Users may have felt frustrated when they couldn't identify which items were out of stock, resulting in an incomplete or failed checkout process.
Priority: High. This issue directly impacts users at a critical stage in the purchase process. Addressing it could reduce dropoff rates by providing better clarity and user experience during checkout.

Priority 3: Missing Product Details

Issue: Some products lacked important information, such as shelf life and delivery conditions (hot or cold), leaving customers feeling uninformed and hesitant to purchase.
Hypothesis: The lack of essential product details could reduce trust in the app, making users less likely to complete purchases, especially for perishable goods.
Priority: Medium. While this issue is less immediately impactful than checkout-related problems, improving product information can significantly boost user confidence and conversions.

Priority 4: Technical Issues (Buffering Payment Page)

Issue: A few users experienced buffering on the payment page, which may have caused them to abandon the transaction.
Hypothesis: Technical glitches at the payment stage can severely impact the user experience, leading to frustration and missed sales opportunities.
Priority: Medium. Although it affected fewer users, resolving technical issues is critical to maintaining a smooth checkout experience and preventing future dropoffs.

Design The Solutions

1. Solution to Minimum Order Value Not Reached

Solution Implemented: To solve this, a design enhancement was introduced that shows the current cart amount along with the remaining amount needed to meet the minimum order requirement. A slider was added to visually indicate progress, and a notification appears when the minimum order is achieved, keeping customers informed and reducing confusion. Once the minimum order is reached, the remaining amount needed for free delivery order is shown and the process repeats till the free delivery amount exceeds.

2. Solution to Out-of-Stock Confusion

Solution Implemented: To address this, a design solution was implemented that displayed a clear notification at the top, specifying the name of the out-of-stock item(s). Additionally, the unavailable products were marked within the cart itself, as shown in the image, providing users with detailed information and minimizing confusion during checkout.

3. Solution to Missing Product Details

Solution Implemented: The design was enhanced to include the shelf life and delivery conditions (hot or cold) directly in the product description. This addition ensures that customers are well informed about the product’s condition and storage requirements, which helps in making confident purchasing decisions.

4. Technical Issues (Buffering Payment Page)

Since this issue did not require any design changes, the information was promptly communicated to the development team. They have been made aware of the technical problems, and the issue is being addressed by them to ensure a smoother payment experience.

Impact

The primary metric tracked was the increase in sales from the app, with a strong focus on the north star metric: conversion rate. This metric was chosen because it directly measures the effectiveness of design changes in driving successful purchases.

After implementing the first design solution to address the "Minimum Order Value Not Reached" issue, there was a 20% increase in conversion. This improvement was achieved by adding clear indicators for the current cart value and the remaining amount needed to reach the minimum order, along with notifications when the threshold was met. This helped reduce confusion and encouraged users to complete their purchases.

The other design changes are still in progress, and further improvements are expected as these solutions roll out. The ongoing implementations aim to resolve additional pain points, which should contribute to continuous growth in conversion rates and overall user satisfaction.

Retrospection

The project began with analyzing user behavior through session recordings using Smartlook, which revealed key issues that led to user drop-offs. The most critical problem was the "Minimum Order Value Not Reached," where many users abandoned their carts due to unmet minimum requirements. A targeted design solution was implemented to address this, resulting in a significant 20% increase in sales, demonstrating the effectiveness of the changes.

Other pain points, such as out-of-stock confusion and missing product details, were also identified, with design enhancements underway to tackle these issues. By focusing on specific user frustrations and implementing direct solutions, the project has set the stage for continuous improvement in conversion rates and overall user experience.

The initial impact shows promise, with more results expected as additional design implementations roll out.