Open the File You Want to Prototype – Go to figma.com, log in, and open the design file where you want to build the prototype.

Switch to Prototype Mode – On the right side panel, click the “Prototype” tab (next to “Design”). This unlocks interaction tools.

Create Screens (Frames) – Make sure each screen or state of your design is in its own Frame. These will act as individual screens in your prototype.

Link Elements to Other Screens – Click an interactive element (like a button), then drag the blue node (circle) to the frame you want to navigate to.

Set Interaction Details – After connecting, choose how the interaction behaves:

• Trigger – On Click, Hover, While Pressing, etc.

• Action – Navigate to, Open Overlay, Swap, Scroll to, etc.

Choose Animation Type – Pick a transition animation:

• Instant, Dissolve, Smart Animate, Push, Slide In/Out

• Adjust Duration and Easing for smoother effects

Preview the Prototype – Click the “Play” (▶️) button in the top-right corner to launch your interactive prototype in a new window.

Done – Share your prototype via Share button, or copy the link to send it to clients, team members, or testers.