Related Products Carousel

[Image]

This experience sits at a moment where shoppers are deciding whether to stay focused on one product or widen their view to compare alternatives. People are trying to understand if there are better, similar, or more fitting options without restarting their search. For the business, this moment supports deeper engagement and product discovery that can lead to more confident purchase decisions.

We tested Athleta’s product detail page with a visible related products carousel shown below the main product information. Participants were asked to imagine shopping for the item and indicate where they would go to see similar products, then share their impressions and likelihood to explore those recommendations. The test used Success, Desirability, and Usefulness to surface where people hesitate, what feels appealing, and whether the experience supports easy browsing and comparison.

This type of testing surfaces breakdowns that don’t always show up in conversion data, especially moments where interest exists but action stalls. It helps teams see whether product discovery tools are truly supporting momentum or quietly slowing it down. For designers and product leaders, these signals clarify where clarity, confidence, and flow either reinforce each other—or start to drift apart—at a critical decision point in the shopping journey.

---

Define Goals for Your Related Products Carousel

An eCommerce related products carousel should balance user needs like inspiration, ease, and relevance with business goals such as increased basket size and continued exploration. Users want helpful suggestions that feel aligned with what they’re already viewing, not distractions. Businesses want to surface complementary products at the right moment without breaking shopping flow. When this works, discovery feels natural instead of forced.

**Audience:**

This concept was tested with women online shoppers in the United States who interacted with Athleta’s related products carousel while browsing apparel. Participants were asked to review suggested items and share whether the recommendations felt helpful, appealing, or easy to act on.

User Needs
At this point, users are open to ideas but still anchored to their original intent. The experience should respect that balance.

• Suggested items should feel genuinely helpful to the current shopping goal (valuable).

• The carousel should catch attention without pulling focus away from the main product (engaging).

• Browsing through suggestions should be simple and intuitive (usable).

• Users should be able to scan options quickly without extra effort (efficient).

• The products shown should feel appealing and aligned with personal style or use case (desirable).

Together, these needs ensure related products feel like inspiration—not interruption—during the shopping journey.
Business Goals

Business Goals
From the business perspective, related product carousels are about expanding value at the right moment.

• Increase Average Order Value – Encourage shoppers to add complementary or additional items.

• Support Product Discovery – Expose customers to more of the catalog in a low-friction way.

• Maintain Shopping Momentum – Keep users engaged without forcing navigation away from the current page.

• Reinforce Brand Curation – Show thoughtful recommendations that reflect brand understanding and style.

• Learn What Drives Add-On Interest – Capture interaction signals to refine recommendation logic.

When these goals are aligned, related product carousels become a quiet growth lever—helping shoppers discover more while feeling understood, not upsold.

---

Choose Metrics to Test Your Related Product Carousel

We tested Athleta’s Related Products Carousel as a browsing and comparison experience within the product detail page. A focused design stack of UX metrics was selected by mapping core shopper needs to observable signals in behavior and perception. The metrics used were Success, Desirability, and Usefulness.

Findable → Success
 In this moment, shoppers are trying to locate where similar products live and decide if that’s the right next step. Success captures whether people can identify the correct place to click when asked to find related items. It surfaces clarity at the exact moment of action, where hesitation or misinterpretation can quietly break browsing momentum.

Valuable → Desirability
 Shoppers are evaluating whether the related products feel relevant and worth their attention. Desirability reflects how appealing and well-matched those recommendations feel from a first impression. It captures emotional pull and perceived relevance, which determines whether users even consider engaging further.

Usable → Usefulness
 At a broader level, people want the page to support easy comparison without added effort. Usefulness captures whether the experience feels supportive of their goals and fits naturally into how they browse. It reflects whether the carousel feels like a helpful extension of the page rather than an extra feature competing for attention.

---

Establish Hunches to Direct Your Testing

Before testing, the team needed to understand where browsing momentum might hold—or quietly break down—on a product detail page. These hunches helped surface uncertainty around clarity, relevance, and confidence before any data was collected. Each one shaped a focused question designed to reveal how shoppers interpret and act on related product options.

Example: Athleta Related Products Carousel

<table xmlns="http://www.w3.org/1999/xhtml" style="min-width: 75px;"><colgroup><col style="min-width: 25px;"><col style="min-width: 25px;"><col style="min-width: 25px;"></colgroup><tbody><tr><th colspan="1" rowspan="1"><p>Hunches</p></th><th colspan="1" rowspan="1"><p>Questions</p></th><th colspan="1" rowspan="1"><p>UX Metric</p></th></tr><tr><td colspan="1" rowspan="1"><p>Shoppers may notice the related products carousel but hesitate to interact if it doesn’t clearly signal that it’s the best place to find alternatives.</p></td><td colspan="1" rowspan="1"><p>Where would you click to see products similar to this item?</p></td><td colspan="1" rowspan="1"><p>Success</p></td></tr><tr><td colspan="1" rowspan="1"><p>The recommended products may feel relevant and appealing, even if users don’t immediately plan to explore them.</p></td><td colspan="1" rowspan="1"><p>What impressions does this page give you?</p></td><td colspan="1" rowspan="1"><p>Desirability</p></td></tr><tr><td colspan="1" rowspan="1"><p>Seeing multiple similar items at once may increase interest in comparison rather than commitment to a single product.</p></td><td colspan="1" rowspan="1"><p>How likely are you to explore the ‘You May Also Like’ section on this page?</p></td><td colspan="1" rowspan="1"><p>Desirability</p></td></tr><tr><td colspan="1" rowspan="1"><p>Even if specific interactions are unclear, the overall page may still feel easy to use.</p></td><td colspan="1" rowspan="1"><p>How much do you agree with the following statement: ‘The website is easy to use.’</p></td><td colspan="1" rowspan="1"><p>Usefulness</p></td></tr><tr><td colspan="1" rowspan="1"><p>Shoppers may feel that the page supports their needs without requiring extra effort or explanation.</p></td><td colspan="1" rowspan="1"><p>How much do you agree with the following statement: ‘The website’s features meet my needs.’</p></td><td colspan="1" rowspan="1"><p>Usefulness</p></td></tr></tbody></table>

Together, these hunches aim to evaluate whether the experience balances interest, clarity, and momentum—helping shoppers compare confidently without stalling at the moment of choice.

---

Turn Hunches into Test Questions

Hunches become useful when they’re translated into questions people can answer without overthinking. Pairing each UX metric with a clear question type makes it easier to see where browsing momentum holds and where it slows.

• **Success (First-click test)**

  Question type: First-click task
Example:
 “Click where you would go to see products similar to this item.”
  This question captures whether shoppers can immediately identify the right next step when they want alternatives. The first click shows clarity—or hesitation—at the moment action is required.

• **Desirability (Impressions + likelihood)**

  Question type: Multiple-choice impressions and Likert scale

  Example:
 “What impressions does this page give you? Select all that apply.”
 “How likely are you to explore the ‘You May Also Like’ section on this page?”
Very unlikely → Very likely

  Together, these questions capture how appealing and relevant the related products feel. One surfaces emotional reaction, while the other measures intent—whether interest is strong enough to consider exploring further.

• **Usefulness (Agreement scale)**
Question type: Likert scale

  Example:
 “How much do you agree with the following statements?”

“The website is easy to use.”

“The website’s features meet my needs.”
Strongly disagree → Strongly agree

These questions reflect whether the page supports shoppers in a practical, low-effort way. They help distinguish between isolated interaction friction and broader confidence in the experience.

---

Calculate UX Metric Scores from User Feedback

We tested Athleta’s Related Products Carousel within the product detail page to understand how shoppers notice, interpret, and act on recommended items. Participants were asked to imagine shopping for the product and decide where to find similar options, then reflect on how the page felt to use. The design stack combined behavioral signals (Success) with attitudinal signals (Desirability, Usefulness) to capture both action and perception.

• Very Good = 90% and above

• Good = 70%–89%

• Average = 50%–69%

• Poor = 30%–49%

• Very Poor = below 30%

**Success (37% — Poor):**

When asked to click where they would find similar products, many participants hesitated or chose inconsistent areas of the page. This indicates uncertainty at the moment of action, even though related products were visible. The signal suggests that knowing options exist is not the same as knowing how to use them.

**Desirability (88% — Good):**
 Participants responded positively to the overall look and feel of the page and the presence of related items. The recommendations felt relevant and appealing, which helped reinforce interest rather than distraction. This score reflects strong emotional alignment, even without guaranteed follow-through.

**Usefulness (84% — Good):**

Most shoppers agreed that the page was easy to use and that its features supported their needs. Navigation and layout felt familiar and low-effort overall. This suggests that friction is localized to specific decisions rather than spread across the entire experience.

[Image]

Taken together, the scores point to a browsing experience that people like and trust, but don’t always act on with confidence. The core imbalance sits between perception and execution: strong interest and ease, paired with hesitation at the exact moment a decision is required. Based on the evidence, this is a supportive comparison experience that loses some momentum right when shoppers decide whether to explore further.

Click here to check out the raw survey data and UX metric scores for Athleta’s related products carousel.

---

Draw Signals from Your Design Stack

1. Focus on poorly scoring metrics

[Image]

Athleta’s related products carousel earned an overall score of 70% (Good), driven by strong Desirability (88%) and Usefulness (84%), but held back significantly by Success (37%). While users found the suggested products appealing and relevant, many struggled to meaningfully act on them—whether that meant clicking through, understanding why items were recommended, or confidently choosing a next step. The key signal: the carousel inspires interest but fails to reliably convert that interest into action.

2. Use design intuition to identify patterns across metrics

[Image]

The metric pattern reveals a familiar tension in recommendation design. Visually, the carousel performs well—products feel on-brand, attractive, and aligned with user intent. However, the low Success score suggests friction at the interaction level: users may not immediately notice the carousel, may be unsure how it relates to their current product, or may find navigation controls subtle or effortful. This points to a gap between perceived value and behavioral clarity—users like what they see but don’t always know what to do next.

3. Determine if user needs are being met

[Image]

• Valuable: Exceeded — recommendations feel relevant and supportive of the shopping goal.

• Desirable: Exceeded — products are visually appealing and aligned with brand style.

• Efficient: Met — scanning items is relatively quick once noticed.

• Usable: Partially met — interaction patterns (scrolling, arrows, affordances) create hesitation.

• Engaging: Partially met — interest is sparked, but momentum often stalls before action.

Overall, the carousel meets emotional and evaluative needs, but underperforms when it comes to guiding users toward confident next steps.

4. Compare outcomes to your business goals

• Increase Average Order Value: Partially achieved — strong product appeal, but limited follow-through.

• Support Product Discovery: Achieved — users see additional relevant items without leaving the page.

• Maintain Shopping Momentum: Partially achieved — interruptions occur when interaction isn’t obvious.

• Reinforce Brand Curation: Achieved — recommendations feel intentional and well-matched.

• Learn What Drives Add-On Interest: Supported — engagement signals are present, but conversion signals are weaker.

5. Surface signals & establish a direction

Signals derived from the data:

• Visual relevance and brand alignment are strengths that build trust and interest.

• Low success reveals friction in how recommendations are presented or interacted with.

• Users need clearer cues to understand why items are shown and how to engage with them.

**Direction based on business context:**

To turn inspiration into action, next steps should focus on:

[Image]

• Strengthening affordances (clear arrows, pagination indicators, or drag cues).

• Adding contextual framing (“Pairs well with,” “Complete the look,” or “Similar styles”).

• Improving visibility and placement so the carousel feels like a natural continuation—not an afterthought.

• Testing click targets and interaction patterns to reduce missed opportunities.

The signal is clear: Athleta’s related products carousel succeeds at inspiration—but clearer guidance and interaction design are needed to convert interest into momentum.