Square product cards on collection pages: -5.6% conversion rate
Test run byClean CommitCRO agency
Commentary byLiftArchiveOur analysis, not theirsRedesigning collection page product cards into a cleaner square layout, with one card per row on mobile, cut conversion rate 5.6%.
Clean Commit ran this test for an anonymized Shopify store and published it in its A/B test library.
The loss was statistically significant and came mostly from mobile, so the original cards stayed.
- Conversion rate: -5.6%. Negative and significant, with a 98.2% probability that the original performs better.
- Orders: -6.5%, so fewer shoppers bought at all.
- Revenue per visitor: -2.6%. Average order value rose 3.2%, which softened the drop.
- Mobile drove the loss, with conversion rate down 7.4%. Desktop barely moved at -0.8%.
The change
The variant uses cleaner square cards and shows one per row on mobile.
Simplified mockup drawn by LiftArchive from the shared screenshots.
Control
The original product cards on collection pages, shown two per row on mobile.
Variant
Cleaner square cards with redesigned badges, a hint that color options scroll, and more room for pricing. Mobile showed one card per row instead of two.
Why it likely lost
Our reading of the result, not the practitioner's claim.
- One card per row on mobile halves how many products a shopper sees per screen, so browsing takes more scrolling.
- Fewer products in view makes it harder to compare options side by side, which can stall a purchase.
- Several card changes shipped together, so the mobile layout switch is our best guess at the cause, not a proven one.
Caveats: The redesign bundled five card changes in one variant, so the result can't be pinned on one of them. The test ran 32 days on 67,334 visitors.
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 collection cards larger and cleaner, with one card per row on mobile, then conversion will rise because products are easier to judge.
- Primary metric
- Conversion rate, split by device
- Guardrails
- Orders per visitor
- Revenue per visitor
- Product page click-through from collections
- Who should test it
- Stores with large catalogs that are weighing a card redesign. Test the mobile grid density on its own; this result suggests two per row is a safer default for browsing-heavy shoppers.
Questions
Should mobile collection pages show one or two products per row?
In this test, moving to one per row as part of a redesign cut mobile conversion 7.4%.
Two per row lets shoppers compare more items without scrolling, so test before switching.
Do bigger product images on collection pages help sales?
Not always. Larger cards look cleaner but show fewer products, and that trade-off can cost orders.
Why did order value go up while orders fell?
Average order value rose 3.2%, but fewer people bought.
Revenue per visitor still fell, so the higher basket size didn't make up for it.
Similar tests
@oliverkenyon@oliverkenyon@oliverkenyon@oliverkenyon@oliverkenyon@oliverkenyon