Make a prototype with AI

With Figma AI, you can create prototyping interactions between your designs in a few clicks. This speeds up and simplifies the process of building an interactive prototype. Guide to prototyping in Figma →

How it works

Make prototype lets you create interactions and connections between frames in your selection. Some of the things you can do with the make prototype action are:

• Create simple flows between a selection of top-level frames
• Add interactions to back or next buttons
• Link to individual frames from a navigation menu

This is helpful if you want to quickly build a basic prototype flow from your designs. You can always customize each interaction further or add more interactions to your prototype.

Consistent layer naming can help improve Figma AI output. Learn how to Rename layers with Figma AI →

Make a prototype with AI

1. Select the frames on the canvas you want to create interactions between.
2. Open the Prototype tab in the right sidebar.
3. From the Interactions section, click Make prototype.

Once Figma AI completes adding interactions to your designs, you’ll see a banner at the bottom of the page that let’s you Preview the interactions. This opens the current flow as a prototype in the inline preview.

To accept all interactions, click Keep it.

Make changes to the prototype

You can edit or remove any interactions added by Figma AI, as well as manually add more interactions. Learn how to create and edit prototype interactions →

1. Click on a connection to select a specific interaction
2. The Interaction modal will open on the canvas where you can make any changes as needed.
3. To remove that interaction, you can find the interaction in the right sidebar and click to remove it. Or you can press the Delete key on your keyboard.
4. To remove all connections on the current page, right click on the canvas and select Remove all connections.