figma · braza shows you
how to make a clickable prototype in figma
braza points at the little blue node and shows you the drag-to-connect gesture that text tutorials can never quite explain.
a clickable prototype lets people tap through your screens like a real app. the whole thing hinges on one gesture - dragging a connector from a button to the next frame - which is almost impossible to follow in writing. here's the flow.
or do it yourself
- 1switch from the 'design' tab to the 'prototype' tab in the top-right panel.
- 2click the element you want to be tappable - a button, a card, an arrow.
- 3hover its edge until a blue '+' node appears, then drag from that node to the frame you want to open.
- 4in the interaction popup, set the trigger to 'on click' and the action to 'navigate to'.
- 5press the play (▶) button top-right to preview and click through it.
let braza do this with you
braza is a tiny on-screen guide that points at the right buttons and talks you through it, on windows and mac.
downloadcommon questions
how do i link two frames in figma?
in the prototype tab, hover the source element until a blue node appears and drag it onto the target frame - that creates the on-click link.
where is the play button to test my prototype?
top-right of the toolbar - the ▶ icon opens presentation view so you can click through your screens.