Are you an agency specialized in UX, digital marketing, or growth? Join our Partner Program

Learn / Case Studies / Mizzen+Main

Back to case studies

How Mizzen+Main Increased Add-to-Carts by 39% in Three Weeks

Mizzen+Main is an American menswear company headquartered in Dallas, Texas. Amanda uses Hotjar’s Heatmaps and Recordings to make small and fast site changes that produce big results.

RetailEcommerceHow to improve conversionHow to improve customer experienceProduct manager

Last updated

19 Sep 2024

Reading time

5 min

Features used

Heatmaps
Recordings

Share

Mizzen+Main 🤝 Hotjar: a summary 

📌 The requirement: Mizzen+Main wanted to find ways to improve the user experience for shoppers.

💡The solution: Their team used a combination of Hotjar Heatmaps and Recordings to understand what prevented users from buying. These tools helped Mizzen+Main increase conversions by:

🏆The results:

  • 39% increase in add-to-cart clicks

  • 60% decrease in rage clicks

  • 4% decrease in cart abandonment

  • 82% increase in product click-through rates

Areas of frustration were preventing users from turning to customers

Amanda Vilay Oliveri, the Product Manager at clothing company Mizzen+Main, spends an hour each week reviewing Recordings and Heatmaps to make sure the site runs smoothly.

One day, something concerning caught Amanda’s eye while she reviewed the data from Mizzen+Main’s dashboard.

“There is a section at the bottom [of the dashboard] that says rage clicks and u-turns. I saw that there was a number for rage clicks and I was like, “oh, that seems high…how can I decrease this?”

Rage clicks are when users repeatedly click on an element and usually signal frustration. One of Amanda’s main goals is to make the customer journey as easy as possible. And having rage clicks set off alarm bells.

Rage clicks shouldn't be happening. So, if I could decrease them in any way, it would obviously help our users.

But before Amanda could address the rage clicks, she needed to know what was causing them in the first place. Luckily, clicking on rage clicks within Hotjar’s dashboard brings up specific Recordings where they occur. So, Amanda spent the next hour watching Recordings to pinpoint the exact cause of frustration.

And the location that was spurring the rage clicks surprised her.

“We noticed that customers were having a lot of trouble with the way that our clothing swatches were laid out. We had it where it was just one line, and then there were two arrows on each side of the swatch. So if somebody wanted to look at all of our swatches, they would have to click the right button maybe, like, four or five times, because it would just scroll four swatches at a time.”

#A user rage clicking on the clothing swatch arrows.
A user rage clicking on the clothing swatch arrows.

Amanda realized that Mizzen+Main’s color swatch presentation had to change if she wanted to provide a great user experience. So, she hypothesized two changes:

  1. Show more swatches on the scroll so users don’t need to click as many times

  2. Eliminate the need to click altogether by showing all swatches at once

Amanda had a feeling she knew which change would bring the best results, but she still wanted to do a bit of research. So, she turned to her competitors to see what they were doing.

“Most competitors had their swatches expanded. And if somebody's used to shopping one way, we want them to have the same experience when they come to our site.”

Amanda felt confident that showing all swatches (instead of making users click to view them) was the best option. She brought the idea to her team, but other team members were reluctant to make changes.

Getting buy-in from stakeholders can be challenging as changes may be seen as expensive and unnecessary. Plus, prioritizing certain changes means other tasks get put on the backburner. But Amanda was confident that this change was necessary. And she knew that she needed to bring proof to the table if she wanted to get buy-in for her idea.

Luckily, she was able to easily share recordings of users' rage clicking with other team members. And seeing users’ frustration in real-time was all the proof her team members needed to agree that the change was necessary. 

So, Mizzen+Main’s developer updated the swatches to a widget that displayed them all at once.

In only three weeks, Amanda and her team saw the following impressive results:

  • 39% increase in add-to-cart clicks: With the enhanced visibility and accessibility of swatch options, users were more engaged and inclined to explore products, leading to a significant boost in add-to-cart clicks.

  • 60% decrease in rage clicks: The intuitive design substantially reduced rage clicks, indicating a smoother and more user-friendly browsing experience.

  • 4% decrease in cart abandonment: Less users were abandoning their carts and instead, were going through with their purchases. 

What Amanda didn’t realize is that the new swatch formatting would open the doors to even more ideas.

Understanding user preferences increased conversions even further

While Amanda was reviewing the move maps (a type of heatmap that tracks users’ mouse movements) for the new color swatches, she noticed something interesting: returning users tend to focus on seasonal colors. Whereas new users gravitate towards the core colors.

Another lightbulb went off.

At the time, Mizzen+Main had a product recommendation section on each product page (called “Similar in Style”).

“We were kind of just setting our product recommendations section to highlight new or best sellers. It wasn't very personalized. It was very general.”

Amanda knows how powerful a personalized shopping experience is and wondered if there was potential to customize the product recommendation section.

Afterall, new and returning customers interacted differently with the color swatches, and Amanda hypothesized that new users may prefer to see recommended products in core colors. While returning customers might rather see recommended products in seasonal colors.

Even better, Amanda had authority (and technical know-how) to make this change on her own. So, she adjusted the “Similar in Style” widget to display product recommendations based on whether users were new or returning. 

The entire change took Amanda a few minutes to implement and the results were just as impressive as the last change she suggested.

Updating the product recommendation strategies based on findings increased our click-thru-rate by 82%.

Sign up for a free Hotjar account to try Heatmaps and Recordings for yourself, and get invaluable insights into your website or product.

Why Mizzen+Main turns to Hotjar

Amanda continues to use Hotjar to see where users get stuck and what she can do to provide a better experience for customers and prospects.

“If we ever see a dip in conversions, add to carts, or click through rates, I'll go into Hotjar and add filters so I can see if there's an issue on the site."

As for what Amanda loves most about Hotjar?

Hotjar has a very friendly user experience. I'm able to find issues or examine customer behavior super easily. And when a new person joined my team, she was able to understand Hotjar right away. I didn't need to train her. It was amazing for her to learn and get acquainted very quickly.

This ease of use makes it simple for everyone to extract quick and valuable insight from Hotjar, even if they’re unfamiliar with behavioral analytics tools. And as Amanda points out, new team members at Mizzen+Main are able to jump right in and use Hotjar without any training.

Mizzen+Main increased add-to-carts by 39%

Mizzen+Main found and eliminated areas of frustration on their site thanks to tools like Recordings and Hotjar.

Ready to get more from your data? Sign up for a free Hotjar account and get started today!