View
373
Download
1
Category
Preview:
DESCRIPTION
An in-depth look at how to optimize designs and increase conversion rates using EyeQuant's tool for visual KPIs, adapted from a presentation at IRCE 2014. Examples using Epson's eCommerce site.
Citation preview
eyequant
How Epson uses EyeQuant An Effective Process for Design Optimization and Conversion Boosting
This document summarizes a case study presented live at IRCE 2014 by Kurtis Morrison from EyeQuant and Jered Goodyear from Epson.
eyequant
What is EyeQuant? EyeQuant is a software technology company that helps businesses make better design decisions with neuroscience. Our team combines research, big data, and machine learning to build predictive models of human reactions to visual design stimuli on websites.
The EyeQuant web service allows clients to upload screenshots of their designs (live sites and mock ups), and get statistically valid, data-driven feedback instantly. EyeQuant predicts which parts of the design are most/least visually attention-grabbing, where visitors are most likely to look when they arrive on the page, and whether they will perceive the design as being clean & well organized, or chaotic and busy.
eyequant
Why Epson Uses EyeQuant
Epson is one of the world’s largest manufacturers of consumer and industrial printers, projectors, and imaging-related equipment, with revenues exceeding $10 billion. On the Epson website, customers can buy printers, ink, paper, projectors, and other products. Epson’s eCommerce team is continuously running A/B and Multivariate tests, and were looking for an insights tool that could help them run smarter design tests. They turned to EyeQuant for help.
Epson now uses EyeQuant to analyze and improve designs across their entire eCommerce website, including category pages, product pages, and B2B lead generation landing pages, with the goal of increasing conversion rates.
eyequant
Identify Optimization Potential Learn More from A/B TestsPre-test Design Ideas
Steps to Success
57
73 78
91
TEST A
21%TEST B
5%
eyequant
Epson understands that user attention is a budget, so the first step they take
when analyzing a design is clearly prioritizing which elements on a page are
truly “must see” in order to get a conversion. The team uses a simple rule: the
three most important elements should be visible within the first 3 seconds of
landing on the page. Generally, Epson marks up the following pieces of
information on the page:
Identify Optimization Potential
2
1
3
Statement of Relevance (what is this page about?)
Value Proposition (why should the customer care?)
Call to action (where should they go next?)
eyequant
2Product benefits hidden
1
3CTA doesn’t pop
A quick test
Using the EyeQuant Perception Map, Epson is able to quickly
see if the most important content in the design catches
visitors’ eyes right away. On this product page, Epson learned
that the product benefits and call to action were being
overpowered by the imagery on the page, and not being
seen right away.
Identify Optimization Potential
eyequant
1 Key content invisible!2
3
This perception map of the Projectors category page showed
that the imagery used in the banner was distracting users
from the more relevant and important content on the page.
Identify Optimization Potential
eyequant
1
3CTA overpowered by imagery
2
Benefits ignored
On this lead generation page for High-Performance Dye-Sub
Printers, users are shown to ignore the benefits presented in
a “wall of text”, preferring the high-contrast visual content on
the right. The main CTA button is overpowered by a 2
competing calls to action, including a very salient (but likely
only relevant for a small group of visitors) offer to check out
the printers at a conference in Orlando.
Identify Optimization Potential
eyequant
Drilling Down
Epson uses the EyeQuant Attention Map to dig deeper and
learn which elements on a design are attracting most and
least visual attention. For example, when analyzing the design
for Home Entertainment Projectors (category page), they
discovered that the image and tabs were particularly salient,
although neither were critical to the main goals for the page.
1
2
3
Identify Optimization Potential
eyequant
10 23
Visual Clarity Map & Score Using EyeQuant’s Clarity Score feature, Epson is able to to identify pages that are busy/chaotic, by comparing their own scores with those of competitors and with the Alexa 10,000. The Clarity Map shows which areas of the page are the most cluttered.
Clearance Center Page Store Specials Page
Identify Optimization Potential
eyequant
Identify Optimization Potential Learn More from A/B TestsPre-test Design Ideas
Steps to Success
57
73 78
91
TEST A
21%TEST B
5%
eyequant
Testing design ideas
Once the team has decided on a page with the right mix of importance and optimization potential, Epson mocks-up potential variants and uses EyeQuant to get important feedback before they ever write a line of code. In fact, they might test dozens of variations in the design before choosing the winning design(s) that they want to invest in. This allows them to experiment freely, quickly, and without involving any IT.
Following are several “quick tests” Epson ran on mock-ups of their Clearance Center category page, which is meant to showcase end-of-life or refurbished products available at steep discounts.
Pre-test Design Ideas57
73 78
91
eyequant
How big should the banner be?
The smaller banner does a better job of conveying key benefits right away, as well as a call to action. With the large banner, users are overwhelmed with the headline.
32
1
3
2
1
Pre-test Design Ideas57
73 78
91
eyequant
Which should come first - “Featured Deals” or “Browse Deals by Category”?
Epson’s team preferred to place the “featured deals” above the “browse by category” section, but first used EyeQuant to check how that might affect the way the design is perceived. Thankfully, it actually improved the design’s clarity score, and still directed attention to the right places.
75 71
32
1
32
1
Pre-test Design Ideas57
73 78
91
eyequant
What should our CTAs look like?
To design clean-looking calls to action, Epson compared potential alternatives according to their clarity score and map results. EyeQuant showed that a button-based CTA was perceived by users as being slightly cleaner than a text-based link.
75 73
Pre-test Design Ideas57
73 78
91
eyequant
69 69
Visual merchandising: How many items should be displayed at once?
The team assumed there would be a trade-off between providing users with options and
keeping the design clean and focused, but found that as long as products were displayed in a
grid with minimal text, it didn’t have a serious affect on the attention map or clarity score.
Pre-test Design Ideas57
73 78
91
eyequant
Final design shipped for A/B testing
The team ultimately decided on a design
that a) directed user attention to exactly
the right content, and b) did so in a way
that was visually clean, clear, and well
organized - achieving a clarity score of 78.
This is well above average for category
pages, and is a 68-point improvement on
the existing version of the page. The new
design was shipped for A/B testing.
78
Pre-test Design Ideas57
73 78
91
eyequant
A/B Test Results
The EyeQuant optimized design significantly outperformed the original, and delivered:
• Over 20% more clicks through to the product pages for featured items. • Over 20% more clicks through to category pages. • Over 10% more clicks on the “buy now” buttons.
Original design New design (Winner)
Pre-test Design Ideas57
73 78
91
eyequant
Identify Optimization Potential Learn More from A/B TestsPre-test Design Ideas
Steps to Success
57
73 78
91
TEST A
21%TEST B
5%
eyequant
Always be learning Epson has also used EyeQuant to analyze the winners of past A/B tests to gain more insight into why they performed better. In the A/B test results shown, the winning variant placed far more attention on trust seals. This provided valuable insight into the design strategy for future work on similar pages.
Learn More From A/B Tests
Original design Winning variation
TEST A
21%TEST B
5%
eyequant
Contact Kurtis Morrison VP, Client Services
kurtis@eyequant.com
+49 306 0989 9795
Recommended