Figma plugin

We know it's a pain to switch between different applications and solutions continuously. To accommodate for this we're introducing our Figma plugin. This plugin is for those that are looking to test their Figma designs. With just a few clicks we will tell you if your CTA, headline, logo, or product actually draws attention.

You can find the expoze.io plugin on our Figma Plugin Page

First, there are a couple of things to consider when using our Figma plugin.

An expoze.io account is required to create heatmaps
Each layer analyzed will deduct one credit
Certain functionality is only available in our web application
Don't forget to stick to our recommendations and considerations when analyzing materials
This is a Figma plugin, which means it's only available within Figma

Installing the Figma plugin

Time to set up your plugin for the first time! Go to Figma, and go to Community or edit a design and open it from there by right-clicking and selecting Plugins, then Browse plugins in Community.

Type in 'expoze.io' to find the plugin in Community.

Then, click Install.

Logging in

Go to your design, click right on the item you want to analyze, go to plugins, and select expoze.io.

Go to your design,

A window pops up, asking you to log in.

Email + password: in order to run predictions you need to be logged in. Simply fill in your details and click "Login"
If you signed up with Google, you can also log using the "Sign in with Google button"
Sign up: don't have an account yet? Click the signup button to head over to our pricing page and select the desired plan to get started or start your trial!
Password reset: forgotten your password? This will send you to our password reset page so you can get things set up in a minute.
Contact support: sends you over to our knowledge base, where you can find answers to all expoze.io related questions!

Once you're logged

Once you are logged in, the page will change. Dependent on whether or not you have already created workspaces in our web application.

If you haven't created any workspaces yet, the screen on the left will pop up. We will automatically create a workspace for you called "Figma plugin" in which we will upload your designs. If you have already created a workspace, you will be able to select in which workspace you want to upload the designs. After selecting the desired workspace the "Create heatmap!" button will show up.

In addition, we're also offering some direct links on both screens:

My account: allows you to quickly head over to your account settings page in the web application.
Support: send you over to our knowledge base, where you can find answers to all expoze.io related questions!
My plan: allows you to quickly head over to your plan overview page in the web application.
Log out: logs you out of the plugin.

Creating a heatmap

Once logged into expoze.io, you can start creating heatmaps! Select the frame you want to analyze, and choose your preferred workspace. Then you can go ahead and click on 'Create heatmap!' and wait a few seconds. Your heatmap overlay will appear automatically.

To download your result, select the newly created "expoze.io heatmap" layer and use the Figma export function on the right.

After creating a heatmap

Once the heatmap is generated it will show as an overlay on your page, but you also have the option to download it via the export functionality in Figma. In addition to downloading, we've also uploaded the screenshot as well as the result to your web application so you can start using the more advanced features, like AOIs, from there.

If you want to test multiple viewports of the same page, simply scroll down on your page and click the "Upload another" button. Each newly generated heatmap will appear in the overlay as well. To get rid of the overlay, simply select the overlay and delete it.

Be sure to check out our knowledge base article on how to interpret heatmaps to start actioning on the found results!