Visual Usability Checker - Validate your design decisions instantly with AI insights
Get instant AI recommendations to improve your design. Detect cognitive load, see where users focus, catch issues early, and compare variations - so you can confidently make and defend design decisions with data-backed insights.
Replies
Attention Insight
Hi, Product Hunt! 👋 I’m Darius, the co-founder of Attention Insight.
We built a new Figma plugin specifically for UX and product designers.
We spoke with hundreds of UX designers and product teams and found a clear need for a data-driven way to validate design decisions.
Because today, design decisions still look like this:
🤔 “Make the CTA bigger.”
🤷 “This layout feels better.”
🔁 “Let’s try one more version…”
And suddenly you’re moving elements around instead of actually knowing what works.
We wanted a way to validate design decisions earlier, before user testing, before development, and without leaving Figma.
So we built Visual Usability Checker — an AI-powered Figma plugin trained on millions of eye-tracking data points to help you validate design decisions earlier with instant recommendations, cognitive load insights, and predicted attention.
With it, you can:
➡️ Get AI recommendations on how to improve your design instantly
➡️ Detect high cognitive load areas that may confuse users
➡️ See where users are likely to look in the first seconds
➡️ Spot weak visual hierarchy and usability issues early
➡️ Compare multiple design variations side by side
All without leaving your workflow.
Instead of guessing, you get clear, data-driven feedback you can act on immediately.
How it works:
Run the plugin → Log in or Sign up → Choose your testing workflow → Select a Figma frame → Get attention maps, scores, and insights in seconds.
You can iterate immediately and see how changes affect user attention.
Our goal is not to replace user research.
It’s to help designers catch problems earlier, reduce guesswork, and make decisions with more confidence.
We’re especially curious:
- What part of design validation still feels too subjective in your workflow?
- Where do you spend the most time debating instead of deciding?
- Who wants to get a discount?
Would love your feedback 🙌
How does this work technically? Do you analyze frames/images, identify which elements are shown in them, and then pull statistics from a database? For example, we all know that in advertising people look at faces - if you determine that the image contains a human face, a dog, and a tree, then it’s easy to understand that a person will look at the face first, then the dog, and then the tree. How did you implement this?
Attention Insight
@natalia_iankovych we used data from previous eyetracking research. Check: https://attentioninsight.com/technology/
Does the checker evaluate icon legibility as part of the usability analysis? Specifically thinking about cases where icons are small (16–20px) or use low-contrast colour-on-colour — wondering if the AI flags those the same way it would flag text contrast issues, or if iconography is treated separately from typography in the scoring.
Attention Insight
@sunnyallan Hi yes, you can test icon visibility in your web design by comparing different icon sizes and colours.
The AI can help identify whether icons are likely to be noticed and whether low contrast may reduce visibility. However, icons are treated more as visual elements, not exactly the same as text contrast checks.
For small icons, such as 16–20px, or colour-on-colour icons, we recommend testing a few design variants and comparing the heatmap, focus map, and contrast map results.
Attention Insight
Playground file : https://www.figma.com/community/file/1575839690110028010/visual-usability-checker-playground-file
Attention Insight
To celebrate this launch, we’re running a two-week promo campaign for new users:
Get 40% off all subscription plans for 12 months
Use promo code: TILLJUNE40
mailX by mailwarm
How do you show where users focus, is it like predicted heatmaps based on layout or actual user testing data?