Return to knowledge base main page

How to generate a heatmap with Figma plugin?

STEP #1 Log in

  • „Frame“ > „Plugins“ > „Attention Insight“ > „Analyze Design“
  • The log in table will pop-up.
  • Enter your account details.



STEP #2 Generate a heatmap

  • Frame > Plugins > Attention Insight > Analyze Design



And that’s it! You’ll get a heatmap in less than 1 minute!


STEP #3 Use additional features

Under the results, you will see some additional features:

  1. Add heatmap to frame. This one is simple. By clicking it, you will add your generated heatmap straight to your design in the Figma work field.
  2. Get more insights. This one is more interesting. By clicking it, you will be redirected to our app. Here you will be able to analyze your design even more thoroughly: Examine the percentage of attention of different elements, check how your results are performing by industry benchmarks, or compare which one of your designs performs better!
  3. Re-analyze selected. This one is here for safety.  If in any mysterious case, you experienced some trouble, press re-analyze selected. It will rerun the analysis without using any of your credits. 


And now you know it all! We hope you will find it helpful and enjoy it as well as we do!