This document summarizes how Epson uses EyeQuant software to optimize website designs. Epson uses EyeQuant to identify areas of pages that need improvement, test potential design variations, and analyze winners of A/B tests to learn more. EyeQuant provides heat maps and scores to show where users look on pages and how clearly important information stands out. This helped Epson improve designs like a clearance center page, increasing clicks by over 20%. Epson found pre-testing ideas with EyeQuant saved time versus testing untested designs.
Call Girls In Hsr Layout ☎ 7737669865 🥵 Book Your One night Stand
An Effective Process for Design Optimization and Conversion Boosting: How Epson Uses EyeQuant
1. 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.
2. 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.
3. 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.
4. eyequant
Steps to Success
Identify Optimization Potential Pre-test Design Ideas Learn More from A/B Tests
73 78
57
91
TEST A
21%
TEST B
5%
5. eyequant
Identify Optimization Potential
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:
1
2
3
Statement of Relevance (what is this page about?)
Value Proposition (why should the customer care?)
Call to action (where should they go next?)
6. eyequant
Product benefits hidden
2
1
CTA doesn’t pop
3
Identify Optimization Potential
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.
7. eyequant
1 Key content invisible!
2
3
Identify Optimization Potential
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.
8. eyequant
1
Benefits ignored
2
CTA overpowered by imagery
3
Identify Optimization Potential
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.
9. 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
10. eyequant
Identify Optimization Potential
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
10 23
11. eyequant
Steps to Success
Identify Optimization Potential Pre-test Design Ideas Learn More from A/B Tests
73 78
57
91
TEST A
21%
TEST B
5%
12. eyequant
73 78
Pre-test Design Ideas 57
91
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.
13. eyequant
73 78
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.
2 3
1
3
1
2
Pre-test Design Ideas 57
91
14. eyequant
73 78
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.
1
3
2
75 71
3
2
1
Pre-test Design Ideas 57
91
15. eyequant
73 78
Pre-test Design Ideas 57
91
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
16. eyequant
73 78
Pre-test Design Ideas 57
91
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.
69 69
17. 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.
Pre-test Design Ideas 57
78
73 78
91
18. eyequant
73 78
Pre-test Design Ideas 57
91
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)
19. eyequant
Steps to Success
Identify Optimization Potential Pre-test Design Ideas Learn More from A/B Tests
73 78
57
91
TEST A
21%
TEST B
5%
20. 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%