Categories
- Account
- What does one credit count as?
- What is a credit?
- Why can’t I remove a user from my company’s account?
- How do I remove a user from my company’s account?
- I have more questions. How can I reach you?
- Can I delete my account?
- What does one design test count as?
- Do credits reset every month?
- How do I keep track of my remaining credits?
- How can I manage seats on my team?
- Features
- What is the visibility benchmark?
- What is Video Testing – A Short Guide
- What are AI recommendations?
- What is the Focus score and how to interpret it?
- What is a Contrast map?
- What is a Focus map, and how to interpret it?
- What is the best Clarity score?
- How are the heatmaps generated by AI?
- What is an AI-generated attention heatmap?
- What is the difference between Areas of Interest and Percentage of Attention?
- How do I interpret Clarity Score?
- How do I define Areas of Interest?
- How do I interpret Percentage of Attention?
- What makes Attention Insight different from other heatmaps?
- Functionality
- Why can’t I draw Areas of Interest below the fold?
- Can I get separate heatmaps for different demographic groups?
- Does Attention Insight provide design recommendations?
- Can I analyze more than one image or URL at a time?
- Can I analyze mobile designs?
- Why does Attention Insight analyze a website above the fold when you load a URL?
- Getting Started
- Plugins
- Attention Insight and Zapier integration – Adding shareable links to the heatmap analysis results in Google Sheets
- Generate Attention Heatmaps on all image files in Google Drive folder
- How to install Photoshop plugin?
- How to generate heatmap using Photoshop plugin?
- How to install Sketch plugin?
- How to generate heatmap using Sketch plugin?
- How to install Figma plugin?
- How to generate a heatmap with Figma plugin?
- How to generate heatmap with Adobe XD plugin?
- How to install Adobe XD plugin?
- Use cases
Return to knowledge base main page
Landing page redesign
The Skin Deep is a brand that created THE AND interactive documentary, THE AND relationship card games, and Honest X card games. Their sales were booming during a 6-month hot streak following their Emmy award-winning documentary. However, they realized that this marketing tactic based on the success of their documentary would soon dry up.
Also, recognizing the suboptimal state of the current unoptimized Shopify Plus site and its potential customer leakage, The Skin Deep team hesitated to allocate additional funds toward marketing. It was necessary to improve the customer experience to continue growing by converting new unaware visitors from ads. So they turned to conversion rate optimization.
One of the things that were uncovered during the CRO audit was that website visitors who hadn’t seen the ads weren’t converting. No content on the homepage would explain The Skin Deep brand or how their card games are different from the competitors’ products. It’s hard for the colder audience to convert if they can’t understand what the product is about.
Here’s how it looked:
Most of the attention (~24%) goes to the product packaging, which shows only the product name and the title of the edition. That isn’t very descriptive, and if you don’t know anything about the product, this product image doesn’t convey any interesting info about the product. It could be changed to an image giving a sneak peek into the actual use of the product.
A comparable amount of attention (23.2%) is allocated to the heading informing about the ongoing sale with a 15% discount. The subheading at the bottom is announcing about two new editions. Both of these are targeted to returning customers or at least well-informed leads. To improve conversions for colder audiences, the heading should be changed to declare a unique selling proposition that is relevant to them.
Targeting returning customers is further reinforced by the fact that above the average amount of attention (5.7%) is paid to the logo so that visitors who watched the documentary could easily recognize the familiar brand. Such a highlight on the logo might not be necessary when targeting a colder audience.
Regarding the Shop Now button, it is placed on a different side than the heading and subheading, which breaks the attention flow, and it’s harder to notice it. As we can see, it receives only 1.3%, which is well below the 4% average for the CTA buttons on landing pages.
The CTA button could be brought closer to the heading to improve the attention flow and make it less fragmented.
Additionally, the design looks a bit dated, and there is a lot of unused whitespace on the sides that could be utilized.
Having all this in mind, a few iterations later, they came up with a redesign:
With an asymmetrical design and increased white space around it, the heading on the left screen side became the main focal point, now receiving 29% of the attention. The text, instead of informing about the sale, now subtly tells how buying the product would benefit them.
It proposes that this connection card game is not only the best in the world but can also be a great alternative to flowers as a gift. It’s implied that the game is more valuable than flowers since it is more effective at deepening the connection between partners. A first-time visitor now understands the value proposition of the product.
The second most prominent object is the image of the product in actual use, with 27.8% of the attention drifting to it. People now don’t just see the packaging of the product, but they get a sneak peek at what it would feel like to use it. They get to read one question from the card game from this POV perspective like they were the ones playing the game. It conveys that it’s an engaging question that will spark an interesting conversation, really deepening the connection.
The CTA button now gets more attention as it’s part of a natural attention flow where the visitor’s attention naturally drifts from the heading to the CTA button right below it. It’s more alluring to click it even though it’s a ghost button possessing less visual weight from a graphic design standpoint.
In the end, these changes resulted in a 93% increase in conversions on desktop and tablet homepages.
Source: Blue Stout