Does reorganizing the add to cart area lift product page sales?

Our product page spread the price, quantity and add to cart button across a tall purchase area. We tested a tighter layout with these grouped together. Over 15 days, conversion moved 0.3% higher, short of our confidence bar.

Not significant Responsive 15 days Not called

SURFACE

Product page

DEVICE

Responsive

VERTICAL

Ecommerce (B2C)

PRIMARY METRIC

Conversion rate

VARIATIONS

1

The hypothesis

By simplifying and organizing the add to cart area, we will make the next step clearer, resulting in more purchases.

The purchase area stacked the product effects, the price, the quantity selector and the button on top of each other, taking up a lot of vertical space. Grouping the price, quantity and button puts the full buying decision in 1 place.

What we changed

Price moved above quantity, with add to cart beside the selector

Var A cut the vertical space used by the product effects, moved the price above the quantity selector, and placed the add to cart button next to the quantity selector. It also changed the button color to the logo color.

VAR A: ADD TO CART ORGANIZATION

Product effects take less vertical space
Price moved above the quantity selector
Add to cart placed next to the quantity selector
Button color changed to the logo color

The result

Conversion moved 0.3% higher, short of our confidence bar

CONVERSION RATE

+0.3%

REVENUE PER VISITOR

+1.6%

Over 15 days, the reorganized purchase area converted 0.3% better than the original, and revenue per visitor was 1.6% higher. Neither gap came close to our confidence bar. The results did not move the way we hoped, so we paused the test and moved on to the next round.

What we would do next

Look beyond the purchase area for the next product page test

Regrouping the purchase area made no real difference to how shoppers bought, so the layout of that area was not what held them back. Our next round moved supporting content higher on the page, closer to the product bullets.