Go to Amazon.com, search for a book and look at their add to cart button, ready to buy area. Is the background of the box white or blue?
Amazon is doing a significant test to their add to cart button and the area surrounding it, what I call the “ready to buy” area. This is the first major test of this area I have seen in years. In 2008, I chronicled in an old blog post, my addictive nature by sharing my collection of Amazon Add to Cart button and accompanying area screenshots I have been collected since the late 90s. Let’s look at the evolution of this critical first stage of the checkout process to see what you can learn from it before we look at the current test.
PLEASE NOTE: Just because Amazon does it, doesn’t mean you should. They make decisions based on their business needs, not yours.
Here’s an early version of Amazon’s ready-to-buy area:
Their iconic Add-to-Cart button was one of the first to use an irregular shape; a circle with a cart icon on the left, blued to a rectangular button with the “Add to Shopping Cart” message. This may be changing soon. Please be patient until I show you the test they are doing this week. Notice how many point-of-action assurances there are (“you can always remove it later” on the button, and the lock icon with “Shopping with us is safe. Guaranteed.” right below).
These were the early days of e-commerce, when customers feared that the Earth might implode if they hit the wrong button. Back then, few people felt comfortable putting their credits cards online and Amazon, for the most part, sold books.
The objective: Make people comfortable clicking on the Add-to-Cart button.
“Buy now with 1-Click”
Notice how the wording at the top goes from “Buy from Amazon.com” to the more productive “Ready to Buy?”…
While the Add-to-Cart button stayed the same, with this incarnation, Amazon launched its “1-Click” feature and added it to the “Ready to Buy” area. This design expanded the renamed “Ready to Buy” area to 262 pixels tall.
The objective: Make sure everyone sees the bordered, stand-alone “Ready to Buy” area with the Add-to-Cart and 1-click buttons.
Note how the secondary action (“Add to Wish List”) is roughly the same color as the Add-to-Cart button. That will change.
Removing “you can always remove it later” + Button Shrink
I managed to snag this one while Amazon was running a split test…
Amazon decided to test removing “you can always remove it later” from on the Add-to-Cart button. They replaced it with a similar message (“you can always cancel later”), just below the “Ready to Buy?” header. What’s important here is that the buttons were now condensed, so this cluster of calls to action took up less space.
I think the little notches by the word “or” is a nice touch, don’t you?
The funny thing that happened when Amazon made these changes was that many of our clients at the time decided they should also remove point-of-action assurance from their Add-to-Cart buttons. We told them it would hurt their conversion if they changed it — and, sure enough, against our advice, the clients changed it and conversion dropped. Yet Amazon kept the new buttons. So the question remains…
Why would they switch to buttons that don’t convert as well?
Because conversion isn’t the only metric that matters. If you look closely, you’ll notice they made the “Ready to Buy” area take up about half the space of the previous version. Why? Because they quietly launched a marketplace to resell used goods, deciding it would boost profits if they didn’t have to stock and ship everything themselves — a fundamental shift in their business model.
The objective: Increase profits by showing used books higher up on the page.
(Don’t copy what other people do if you aren’t fully aware of the business issues involved.)
Amazon: The Next Generation
Here we can see that Amazon has gone through a major redesign, and their iconic Add-to-Cart button gets a face-lift:
Notice that it’s the same shape, same colors, but now has a 3D effect. The “Ready to Buy” verbiage is no longer there, and the secondary “Buy with 1-Click” button now requires users to log in if they’re to see it. Also, the used book marketplace gets much more screen real estate. They’re also heavily promoting the A9 Search Engine.
Did you see that they changed the color of the “Add to Wish List” buttons so that only the Add-to-Cart button is the main focus of the page? They’ve even added another secondary action (“Add to Wedding Registry”).
Here’s what it looked like in 2008
They’re no longer promoting the A9 search engine, the marketplace isn’t taking up as much room, and they’ve added a few more secondary actions (“Add to Shopping List,” “Add to Baby Registry,” and “Tell a Friend”).
As you can see, they’ve added a pull-down menu to adjust quantity, so you don’t have to wait until checkout to change it. So, if you guessed option #3 at the beginning, congratulations, you’re my kind of e-commerce geek.
The objective: Increase Average Order Value by keeping customers engaged in the buying process. This should also lower shopping cart abandonment by reducing the number of steps in the checkout process. It has not changed that much since 2008.
Here is what it looks like to most people on Amazon today:
This is a radical redesign. Notice how they are testing for impact not for variations. Let’s look at what they may be changing:
1. The design is much cleaner, simplified with a lot more white space. It is definitely better organized.
2. Only 2 call to action buttons. One for add to cart one for 1-Click. They removed all the add to cart buttons that appeared next to the used books moving that to a radio select button. I wonder if this will impact how many people choose to buy used.
3. Wow! The shape of the iconic button has changed for the first time ever. No longer is it irregular shaped, but a simple rectangle.
4. They have added the urgency of when to order by to get shipping by right next to the button. I really like this and they make it really easy for you to choose with shipping you want right in the ready to buy area.
5. There are other subtle things but they didn’t test a hundred variations of each one, just one cleaned up version versus the old control. They may come back and make some modifications but this is the smarter way to test and conserve creative and traffic resources.
Big Money. Small Change.
Amazon has spent many years testing this area, but they’ve tested countless other variables as well. They’ve tested the size and viewing functionality of product images, putting images on the left vs. the right side, the location of product reviews — you name it, they’ve tested it. Still, they continue to optimize this area (formerly known as “Ready to Buy”), making adjustments based on business cycle and market circumstance.
Amazon Wasn’t Built in a Day
Think your website is beyond repair? Tell it to Jeff Bezos. Once upon a time, his website looked like this:
Soon enough, after significant trial, error, and observation, he turned it into this:
Yes, it was still ugly, but what Bezos realized early on is that, to be a successful online merchant, you need focus on delivering a great customer experience where the function comes before the beauty, that your customer has to be at the center of your universe, that you must use the data to constantly improve every aspect of your business and your culture must give teams the agility they need, with permission to take risks so that you can reap great rewards.
So do you have the test version or do you see the blue background version?