Attention Insight
Click to visit website
About
Attention Insight is an AI-powered tool that predicts visual attention on designs (websites, marketing materials, mobile apps, packaging, etc.). It uses data from 5.5+ million fixations from eye-tracking studies to generate heatmaps, focus maps, and clarity scores. These analytics help predict design performance before launch, improving conversion rates and UX. The tool offers various analysis types (desktop, mobile, marketing materials, posters, packaging, shelves) and integrates with popular design tools like Figma, Adobe XD, Photoshop, and Sketch.
Platform
Task
Features
• attention heatmaps
• clarity score
• contrast map
• focus map
• percentage of attention
• attention report
• focus score
• percentage of attention benchmarks
FAQs
When should I use Attention Insight?
Attention Insight is a pre-launch analytics tool that enables marketers and design teams to improve design performance. Our AI-powered algorithm assesses design element visibility with 90%-96% accurate heatmaps compared to real eye-tracking studies but without data collection. There are many use cases for using Attention Insight. Here are some examples: * Optimize conversion rate * A/B testing marketing materials * Audit existing designs * Validate design ideas * Prove design decisions to clients * Benchmark against competition
What makes Attention Insight different from other heatmaps?
All heatmaps are visual representations of data that showcase how visitors interact with visual materials. There are different types of heatmaps which represent different data. Thus, it is important to understand what data you are visualizing. Here are the examples: Mouse-tracking heatmaps (hover, click and scroll maps) records, quantifies and represents data of the mouse or trackpad movement. To make accurate findings, you should record your users and have enough of a sample size (around 2000-3000 according to [CXL](https://cxl.com/conversion-optimization/mouse-tracking-and-heat-maps/)). Eye-tracking heatmaps gather and visualize data about the most and least attention capturing sections and elements of a web page. To make accurate findings, you should possess eye-tracking software and devices, recruit enough users (at least 39 to generate heatmaps according to [NN/g](https://www.nngroup.com/articles/eyetracking-setup/)) and record their behavior. Attention Insight heatmaps powered by AI just like eye-tracking heatmaps show which areas of the visual materials have been viewed the most and the least. You can find out if key pieces of information are in the area that is visible to most users. It is different from a mouse-tracking heatmaps since it indicates where visitors look versus where they click or hover the mouse. Also, no data collection is required since an AI algorithm uses previously recorded data from real eye-tracking studies with 30 800 images in total and generates attention heatmaps in seconds. Thus, it is a much more affordable and faster option with 90-94% accuracy compared to real eye-tracking studies.
Where can I find Case Studies?
You can find it in our Blog under the category "[Case Studies](https://www.attentioninsight.com/category/case-studies/)".
How do I interpret Percentage of Attention?
Percentage of Attention provides a quantified data (a percentage) of certain areas in your design with key elements inside them. By defining your areas of interest, you quantify data of the heatmap and get an exact percentage of attention a particular object receives. For example, if you choose the full screen, you will get 100% of attention. Now go and find out what Percentage of Attention that CTA of yours gets!
How do I define Percentage of Attention?
Some areas of interest (buttons, key titles and images) are defined automatically by our algorithm. However, we cannot stress it enough that users should be defining those areas by themselves. At the end of the day, you know your design objectives better than AI, so Attention Insight can only assist you here. You can define an area of interest simply by clicking the mouse on the image and dragging it until you draw a rectangle over your area of interest.
How do I interpret Clarity Score?
Clarity score shows how clear the design is for a new user, whether it is overloaded with elements and conflicting colours or it is clean and clear. An algorithm takes into account the amount of information in your designs – amount of text, text size and text contrast, colorfulness, images number and size. Low score, for example, indicates that your design is cluttered and important elements are not easily visible. The score ranges from 1 to 100. Ultimately,Clarity score is divided into four categories: * Severe Difficulty (0-30) * Moderate Difficulty (30-60) * Optimal Clarity (60-95) * Too Simple (95-100)
How do I interpret Alexa Sites Rank?
Alexa Sites Rank diagram compares your design clarity with your industry standard. It shows where your design ranks regarding clarity compared with TOP 170 Alexa sites in a certain category (Landing, E-Commerce or News & Media). It takes 170 best ranked Alexa sites in the same category as your design and groups them by clarity score in 10 groups. You can see what percentage of those sites have a clarity score of 100-90%, what percentage falls into 90-80% clarity score group and so on. Most importantly, you see to which group your design belongs. Whether it has better clarity score than most best ranked Alexa sites or it trails somewhere on the tail-end of those 170 sites.
Should I capture a URL or upload an image?
Once you capture a URL, our platform takes a screenshot and analyzes the webpage above the fold. Before you submit a URL, you can select between two design types – “Desktop” and “Mobile”. If you upload an image file directly, additional design type – “Marketing Material” is available, which includes banners, posters etc. Other than that, both a captured URL and uploaded image are analyzed the same way. Important: Attention Insight analyzes design as users would see it for the first time, so cookie notifications or pop-ups might be included when you upload URL. If you want to test it without these elements, simply snap the screenshot and upload the image directly. Another option is to use Google Chrome Extension, where you have full control over what you want to test.
Why does Attention Insight analyze a website above the fold when you load a URL?
Attention Insight analyzes designs in screen-size segments, the way your visitors view it. Your users do not see the entire length of the web page at once. Thus, if you upload a URL, Attention Insight snaps an image above the fold. This is also how the Attention Insight algorithm is trained with eye-tracking studies where testers were presented with an image. In the context of websites, an image is the screen or landing page above the fold. If you want to analyze specific screen-size elements of a web page, simply snap the screenshot and upload the image directly. Another option is to use Google Chrome Extension, where you have full control over what you want to test.
Can I analyze mobile designs?
Yes, before you submit a URL or upload a design, you can select between two design types – “Desktop” and “Mobile”. You can also use the Google Chrome Extension for analyzing mobile designs.
Can I analyze more than one image or URL at a time?
You can analyze up to 20 images or URLs at a time.
Does Attention Insight have the Browser Extension?
Yes, Attention Insight has Google Chrome Extension, and it can be downloaded here: <https://www.attentioninsight.com/attention-insight-chrome-extension/>. With Google Chrome Extension, you can analyze a live webpage and have full control over what you want to test. It enables you to remove cookie notifications and pop-ups before scanning the screen. You can also generate AI heatmaps of any part of the web page – above and below the fold.
Does Attention Insight provide design recommendations?
Since each marketing material has different objectives, Attention Insight does not provide automatic design recommendations just yet. Attention Insight features help you determine whether your personal design objectives are being met: **Heatmaps** help you to determine whether users view and notice certain elements. **Percentage of Attention** provides you with quantitative data – an exact percentage of attention a particular object receives. **Clarity Score** shows how clear the design is for a new user, whether it is overloaded with elements and conflicting colors or is clean and clear. **Comparison** feature enables you to perform an A/B test of two or more designs. If you take these results into consideration while combining it with your design objectives, it will help you identify areas of improvement. You can also find case studies and tips for designers in our blog or request a design report from our community of professional designers.
Can I get separate heatmaps for different demographic groups?
The Attention Insight algorithm was built from the user data consisting of 58% women and 42% of men. The age distribution varies from 7 years old to 60+ years old. However, most participants fall into the 21-30 age bracket. Since our algorithm analyzes the first 4-5 seconds of participants’ attention in eye-tracking studies, it is really important to emphasize that there is only minor correlation between demographics and visual attention predictions. It means that when visitors first land on a page, their attention distribution in the first seconds is not significantly different. However, we do not recommend using Attention Insight for pages or creatives written in languages that read in a right-to-left or downward pattern (e.g. Hebrew or Mandarin).
How can I manage seats on my team?
To assign a seat, click on your name at the top right corner of the screen in the Attention Insight Web App and go to your Subscription Page. You will be able to add and remove the email addresses of your colleagues.
Pricing Plans
Pro
€ EUR119.00 / monthly• 200 credits
• 2 user seats
• No watermark
• Available API
• Video testing
• Team & sharing
• Projects & Analyses reports
Hero
€ EUR299.00 / monthly• Unlimited credits
• Design feedback
• 30 min video analysis
• API available
• 2 user seats
• Live onboarding and support
• Pro features included
Pro
€ EUR95.00 / annually• 200 credits
• 2 user seats
• No watermark
• Available API
• Video testing
• Team & sharing
• Projects & Analyses reports
Hero
€ EUR250.00 / annually• Unlimited credits
• Design feedback
• 30 min video analysis
• 2 user seats
• Live onboarding and support
• Pro features included
Pro
$ USD129.00 / monthly• 200 credits
• 2 user seats
• No watermark
• Available API
• Video testing
• Team & sharing
• Projects & Analyses reports
Hero
$ USD324.00 / monthly• Unlimited credits
• Design feedback
• 30 min video analysis
• 2 user seats
• Live onboarding and support
• Pro features included
Pro
$ USD98.00 / annually• 200 credits
• 2 user seats
• No watermark
• Available API
• Video testing
• Team & sharing
• Projects & Analyses reports
Hero
$ USD271.00 / annually• Unlimited credits
• Design feedback
• 30 min video analysis
• 2 user seats
• Live onboarding and support
• Pro features included
Average Rating: 0.0
Average Rating: 0.0
5 Stars:
0 Ratings
4 Stars:
0 Ratings
3 Stars:
0 Ratings
2 Stars:
0 Ratings
1 Star:
0 Ratings
User Ratings
No ratings available.
Sign In to Rate this Tool
Alternatives
Architecture Helper
Analyze buildings, generate designs, and explore architectural styles with Architecture Helper's AI-powered tools. Unlimited access for $5/month.
View Details
Crit Design
AI-powered screen capture and analysis tool for designers and marketers. Provides insights for SEO, UX, and competitor analysis.
View Details
VisualHub
VisualHub offers AI-driven analysis tools to improve website design and user experience.
View DetailsFeatured Tools
NoFilterGPT
Anonymous, uncensored AI chat with AES encryption and no logs. Offers free and pro plans.
View Details
Wayin AI
Wayin AI summarizes videos, supports multiple languages, and allows interactive Q&A via chatbot and screenshot queries.
View Details
Pokecut
Pokecut is a free AI-powered photo editor with tools for background removal, changing, and enhancement. Pro plans offer extra features and credits.
View Details
GitGab
Connect your Github repos to ChatGPT & Claude for code assistance, bug finding, and documentation. Free trial available.
View Details
TryNectar AI
Create and interact with a customizable AI girlfriend. Features include AI chat, roleplay, and image generation. NSFW content available.
View Details
Smart Cookie Trivia
A trivia website with questions in multiple categories. Play now and expand your knowledge!
View Details
Arbor
Arbor is an automated carbon accounting platform that helps businesses measure, analyze, and reduce their product's carbon footprint quickly and accurately.
View Details
PhotoLog
PhotoLog offers secure, client-side encrypted media storage with mini-site creation, easy sharing, and various storage plans.
View Details
Apptest.ai
AI-powered mobile app testing platform with a test automation cloud (Ptero) and a no-code test scenario authoring tool (Stego).
View Details
Saner.AI
AI-powered productivity assistant for ADHD and knowledge workers, centralizing notes, tasks, and AI tools to enhance focus and efficiency.
View Details