top of page
Aldiheader.png

Making Substitutions Fun and Effortless

Project Type

Redesign

Role

UI/UX Designer

Duration

4 Weeks

Team

User Researchers, Developers, Team- Lead, Project Manager 

Outcomes

  • Improved the visibility of the substitution feature.

  • Ideated a new way for users to choose their preferences with the goal of user engagement and satisfaction

  • Created the mobile version of the feature to create a ubiquitous product.

Project overview

The first project that I worked on during my time at Toptal was the online grocery store website for ALDI SÜD. I worked on the feature called Substitution which refers to if a product is sold out, we will offer customers a suitable substitute and update the charges accordingly.

The goal was to identify pain points and areas of confusion that users may be experiencing when attempting to request substitutions or opt out of products and create a solution for it. As a UI/UX designer on the design team, I had the chance to work on these features, below are a few of my contributions.

Problem insight

  • The current feature of substitution on checkout flow is not clear and customers are concerned about replacements and substitutions.

  • Users were unable to request substitutions for products or opt out of them entirely which is impacting user experience and leading to customer churn.

Research and insights

Aldiresearch.png

We collected data from surveys and comments to understand  the problems with the feature itself However to understand deeply about interaction and pain points with the feature I did usability testing by creating a task list and asking the candidates to perform the same task like
—Add items to the cart.

— Features available at checkout.​

—Substitute items if the product is unavailable.​

We also did internal interviews with customer success to uncover recurring pain points.

The objective of the testing was to understand how informed decisions users can make during the checkout process.

Core problems/Pain points we identified

  • Identifying the substitution feature is not easy.

  • Lack of Visibility: Option, as it's not highlighted enough or seems irrelevant.

  • Having No Control: No choice of opting out of the substitute option entirely.

  • Cause of Frustration: Since the substitute is preselected and users are not aware of it, receiving a different item later will cause frustration.

  • Choice: No choice of choosing the substitute product for themselves.

By synthesizing user feedback after testing on the checkout process, analyzing data from user research helped us to build a primary use case to tackle.

Competitive Analysis

I studied different online grocery websites and applications offering similar features also why some of them don't have the feature altogether, I observed their system behavior, navigation flows, and UI.

image.png

Ideation and process

I started exploring various data visualisations for the different metrics and scalable layout. Validated these with the in-house support team.

Major Challenges

1. Minimizing the effort in unselecting each substitution product to reduce the bouncing rate and frustration.

2. The major challenge was to align business requirements and user needs, my insight uncovered that most people do not like the substitution of their chosen product.

Solution


1. To solve this I researched how to provide a single click (CTA) to select and deselect according to our technical constraints.

2. I studied why this feature is important for business prospects and improved visibility for users to opt in and out of substitution to build trust.

Rough Sketch

Wireframe.png

Design execution

Content Navigation & Visibility

I have enhanced the visibility of the feature by positioning it on top while ensuring the primary feature remains well-attended.

-.png
+.png

User Empowerment

Added the option to choose a substitute item, providing users with greater control to meet their specific needs.

Discoverability

A search box has been added to enable users to easily choose a substitute item. This feature also provides relevant suggestions to enhance the user experience.

L - Substitute Modal.jpg

Learnings

  • This project provided insights into balancing business requirements with user satisfaction.

  • I learned to never underestimate how much time it takes to work on a task and to start prototyping/testing the design as early as possible.

  • It demonstrated how to design features that remain usable and engaging, even when they are not inherently exciting.

  • I gained a deeper understanding of the importance of discoverability in optimizing the user experience.

bottom of page