Cleaner skincare catalog grid: +20% conversion, +40% revenue/visitor
A skincare catalog page with 3 products per row, bigger images, aligned buttons and best sellers first lifted conversion rate from 11.54% to 13.87% (+20%).
Revenue per visitor rose 40%, from $16.44 to $22.98. Conversion Fanatics ran this test for a skincare products company and shared it on its blog in 2017; several layout changes shipped together.
- Conversion rate: 11.54% to 13.87%, a 20% lift.
- Revenue per visitor: $16.44 to $22.98, a 40% lift.
- Visits to checkout rose 19.22% and visits to cart rose 8%.
- All four changes shipped together, so the lift can't be credited to the 3-per-row layout alone.
The change
4 cramped products per row became 3 larger, aligned cards sorted by popularity
Simplified mockup drawn by LiftArchive from the shared screenshots.
Control
A catalog page with 4 products in each row. Prices and calls to action did not line up from one product to the next.
Variant
3 products in each row, with larger product images and prices and buttons aligned. Products were sorted by most popular.
Why it likely won
Our reading of the result, not the practitioner's claim.
- Bigger images give skincare shoppers a clearer look at each product before they click.
- Aligned prices and buttons make the grid easier to scan and compare.
- Sorting by most popular puts proven sellers in front of shoppers first, which may explain part of the revenue gain.
- Fewer products per row can feel less crowded, though that is our reading rather than something the test isolated.
Caveats: Bundled test: column count, image size, alignment and sort order all changed at once. Sample size, duration and confidence level were not shared, and the test is from 2017.
Who ran it
Conversion Fanatics ran this test for a skincare products company and published the results (Conversion Fanatics blog case study). The numbers are theirs; the summary and commentary on this page are ours.
Read the original case study on Conversion Fanatics →
How to run this test on your store
- Hypothesis
- If we show 3 products per row with larger images, aligned prices and buttons, and best sellers first, then more visitors will buy because the catalog is easier to scan and compare.
- Primary metric
- Revenue per visitor
- Guardrails
- Conversion rate
- Product page click-through from the catalog
- Scroll depth on the catalog page
- Who should test it
- Stores whose grids feel crowded or uneven, especially where product looks matter. To learn which change matters, test sort order and grid density separately; stores where shoppers need to compare many items at once may lose out from fewer per row.
Questions
How many products per row should a collection page show?
There is no single answer. Here, moving from 4 to 3 per row along with bigger images won, but it was bundled with other changes, so test it on your own catalog.
Does sorting by best sellers help conversion?
It often helps because shoppers see proven products first.
In this test it was one of four changes, so its exact share of the lift is unknown.
Why do aligned buttons and prices matter?
When prices and buttons sit at the same height, the eye can scan across a row and compare quickly. Uneven grids make shoppers work harder.
