Cleaner product cards with a color selector: +1.5% CR, inconclusive

Flat / inconclusiveCollection page

Cleaner, more consistent product cards with a color selector on the collection page lifted conversion rate 1.5% and revenue per visitor 9.3%.

Clean Commit ran this test for an anonymized Shopify store and published it in its A/B test library.

We count it as inconclusive: the variant had a 58.7% probability of beating the original, and mobile conversion fell.

+1.5% CR, inconclusive
  • Conversion rate: +1.5%, with a 58.7% probability of beating the original. No clear difference.
  • Revenue per visitor: +9.3%, mostly from higher average order value (+9.0%), but within normal variation.
  • Desktop looked strong: conversion rate +14.3% and revenue per visitor +44.6%.
  • Mobile conversion rate: -2.6%. Negative, so the new cards may not suit small screens.
  • Add-to-cart rate rose 4.7% and click-through rate 2.2%.

The change

Control (A)
header
nav
breadcrumb
filters
Original cardREPLACED
Original cardREPLACED
Variant (B)
header
nav
breadcrumb
filters
Cleaner card, color selectorNEW
Consistent card layoutNEW

Collection cards become cleaner and more consistent, with a color selector on each.

Simplified mockup drawn by LiftArchive from the shared screenshots.

Control

The store's original product cards on the collection page.

Variant

Product cards were reworked to be easier to scan, made consistent across the grid, and given a color selector.

Why it likely came out this way

Our reading of the result, not the practitioner's claim.

  • On desktop, a cleaner grid and visible color options may have made it easier to compare products and click through.
  • On mobile, a color selector adds small tap targets to cards that are already tight, which can slow browsing.
  • Higher order value could reflect shoppers finding the color they wanted, but the evidence is too weak to say.

Caveats: Not significant (58.7% probability to beat the original), and desktop and mobile moved in opposite directions. Sample size and duration were not shared.

Who ran it

Clean Commit ran this test for a Shopify store (anonymized) and published the results (Clean Commit A/B test library). The numbers are theirs; the summary and commentary on this page are ours.

Read the original case study on Clean Commit →

How to run this test on your store

Hypothesis
If we make product cards cleaner and add a color selector, then more shoppers will click through and buy because the grid is easier to scan and options are visible early.
Primary metric
Conversion rate
Guardrails
  • Mobile conversion rate
  • Click-through rate from collection pages
  • Revenue per visitor
Who should test it
Stores that sell products in several colors and have busy or uneven collection grids. Consider testing desktop and mobile card designs separately, since mobile went the other way here.

Questions

Should product cards show color options?

It can help shoppers see choices without opening each product.

In this test it looked good on desktop but went slightly negative on mobile, so check both.

Why test desktop and mobile results separately?

They can move in opposite directions, as here.

A small overall lift can hide a big gain on one device and a loss on the other.

What makes a product card easier to scan?

Consistent image sizes, a clear title and price in the same place on every card, and less clutter.

Similar tests