Academy menu

Figma plugin

Here are two methods to integrate a Figma prototype into your test setup:

  1. Using a direct Figma link.
  2. Using the Figma Preely plug-in.

We recommend using the direct link if you want to sync your entire prototype. Use the plug-in if you prefer to select specific parts of your prototype.

Step 1

Install the Preely plugin directly in Figma or via this link: Download Preely plugin for Figma

Step 2

Log in to Preely via the plugin.

Step 3

Link Figma to your Preely test.

Step 4

Create or select test in Preely.

Step 5

Select the flows or frames you want to use for your test and click Export to export them to Preely.

Figma Desktop app

Preely plug-in is integrated into the Figma Desktop setup.
You need to download the Figma Desktop app here

The Preely plugin for Figma supports

  • Interactions: On click, on drag (translated to swipe), while hovering, mouse enter, mouse down, mouse up
  • Interaction transitions: Open overlay, close overlay, navigate to, back, smart animate (depends on the layers being animated)
  • Animations: Instant, dissolve, move in, move out, push, slide in, slide out – all with simple animation easing

The plugin does not yet support

  • Interactions: On drag, while pressing, key/gamepad, mouse leave, After Delay, complex combinations of interactions
  • Interaction transitions: Scroll to, swap overlay, open link
  • Animation: Animation selective easing and duration
  • Component state: Button hovering effects, scrollable areas using frames

  • Nested overlays

Note:

  • Hover in an overlay can be added in Preely after import
  • We are continuously working on improving the plugin and supporting more interactions