Shopify Experts

How Luxy Hair used their hero image to increase revenue per visitor by 17.6%

  1. Their Story

    Luscious locks for the win

    All Mimi wanted was long, thick, shiny hair for her wedding day.

    After hours of research, frustration, disappointment and heartache, Mimi found out the hard way a market didn’t exist out there for thick, luscious hair extensions that were also affordable.

    So she decided to create one herself. Soon after her big day, Luxy Hair was born.

  2. The Challenge

    Finding the perfect image

    Luxy Hair's goal is to inspire women to look and feel beautiful every day; they want to give them a confidence boost.

    It was important to show this powerful transformation directly on their homepage with the hero image. But their goal wasn't just to show a pretty photo. They wanted one that converts, too. 

  3. The Solution

    Testing the waters

    Luxy narrowed down their choices to two images. Both photos exposed their luscious hair extensions beautifully, but they did so in completely different ways.

    In order to discover which image encouraged visitors to click, Luxy ran an A/B test on Visual Website Optimizer.

Keys to Success

First Impressions Matter

Photography plays a key role in the vitality of a website, especially when you consider that it only takes 50 milliseconds for a visitor to decide whether or not they want to leave (or stick around to take a peek).

The hero image is the prominent photo on a homepage, and is the first image visitors see - it creates a strong impression. It shares your products or service to the world, while setting the visual tone for your store.

So it goes without saying that Luxy Hair needed to discover the image that resonated the most with visitors.  

One... or two?

The original image presented a brunette model with beautiful, flowing hair extensions - a simple preview of the final product.

The second image featured a Before and After photo - a blonde model with straight hair before adding the extensions. Then long, full, rolling curls once the extensions were clipped in. 

/

To test which image performed stronger, more than 23,000 visitors were shown either the brunette or the Before and After image. Traffic was split 50/50 across both versions - and also across desktop and mobile devices.

The test ran on Visual Website Optimizer for two weeks. 

And the winner is...

The results were in and... (drumroll please!) 

The Before and After photo increased clicks on the call-to-action (CTA) button by an impressive 7.93%!

But it doesn't stop there. Since more visitors were engaged with the Before and After photo (rather than the brunette model), revenue per visitor actually increased by a whopping 17.61%! 

The most interesting result though, is that this photo only resonated with desktop viewers. Mobile viewers didn't feel the same way.

For mobile visitors, the Before and After image actually decreased clicks on the CTA, resulting in a dramatic 27.69% drop in overall revenue.

(Yup, that big of a difference... images truly are important!).

Scaling for Success

Although the same photos are featured across both devices, they appear different on mobile devices. This is especially true for the Before and After photo. 

/

In the Before and After photo, mobile viewers couldn't see a small portion of her hair. And this tiny, subtle difference most likely affected conversions.

But why?

Well, it's all in our minds. Image psychology research confirms that small changes in a photo can make an enormous difference on how it’s perceived. For example, slight alterations in expression and posture can influence whether a model is seen as attractive, approachable or helpful.

So although the Before and After image worked remarkably well on desktops, it failed to perform on mobile. 

Key Takeaways

Testing Luxy's hero image confirmed that images have a direct impact on their bottom line. The results also highlight the importance A/B testing has on maximizing conversion rate. Anything from headlines, landing pages, copy and CTAs should be tested to ensure your store is running to its fullest potential. 

To maximize conversions, Luxy now features the Before and After photo on their desktop version, while the single brunette model displays for mobile viewers. 

Here are a few other aspects to consider when thinking about images:

1. Choose them wisely – and always test

Test not just on one platform, but also across multiple devices and traffic segments. What works well on one device with one traffic source might not translate to viewers on a smaller mobile screen.

2. Small differences can make a big difference

Tiny differences in images can impact how your product or service is perceived (especially when scaling a photo for mobile). Always think about this when selecting site images.

3. Weigh in on the scale

Ensure your images scale properly across device-types and are presented at an optimal zoom-in level. A strategically sized and zoomed-in hero image may mean the difference between viewers entering your conversion funnel or abandoning site!

Conclusion

A 17.6% increase in revenue per visitor!