Import a Figma prototype

Prepare visual material before building the task.

Purpose

Make named, ordered screens available to visual blocks.

When to use it

When testing an existing prototype or images without a Figma file.

Before you start

• Permission to the Figma file or prepared images
• An editable study

Example

Import the address flow and select its start screen.

Step by step

1. Open Prototype. In the study, open Prototype. Choose to connect Figma or upload images depending on the source. Figma · PNG, JPG or WebP.

1. Import material. For Figma, authorize your account and paste the presentation flow link. For images, select files and monitor upload. Check file access · Check the displayed upload limits.

1. Check screens. Review thumbnails and names. For uploaded images, adjust the order used by the guided flow. Recognizable start screen · Goal screen present.

1. Use in a block. In the builder, add a visual block, select the import and define its screens. Test preview before publishing. Prototype, first click, five seconds or screen interview.

Validate before collecting responses

The side preview lets you inspect a block; for Figma it is static. To validate draft rules and order, use Test full flow, without creating sessions or taking quota slots. Figma, recording, voice and AI follow-up require the published link. Test published opens the real /r/[token] link: it can create responses and consume quota. Separate these tests when analyzing your collection.

How to read the result

• Screens available in the Prototype tab
• Import available to visual blocks

Cautions and limitations

• Use the Figma presentation link for the correct flow.
• Figma limits can block a new import; a compatible existing import may be reused.

Continue with the interactive guide

Bring in Figma screens or images

Related guides

• Connect screens with clickable areas
• Choose task navigation and success criteria
• First click
• Five-second test