How to Use Flow Starting Point in Figma for Prototyping
In Figma, use the
Flow Starting Point to set the first frame your prototype shows when you start presenting. To do this, right-click a frame and select Set as Flow Starting Point. This ensures your prototype begins exactly where you want.Syntax
The flow starting point in Figma is set by selecting a frame and choosing the option to make it the start of your prototype flow.
Right-click frame: Opens context menu.Set as Flow Starting Point: Marks this frame as the prototype's first screen.Prototype tab: Shows the flow starting point icon on the frame.
Example
This example shows how to set a flow starting point on a frame named "Home Screen" in your Figma file.
text
1. Select the frame named "Home Screen" in your Figma canvas. 2. Right-click the frame. 3. Click "Set as Flow Starting Point" from the menu. 4. Open the Prototype tab to confirm the blue arrow icon appears on the frame. 5. Click the Present button to start the prototype from "Home Screen."
Output
The prototype starts by showing the "Home Screen" frame first when you present.
Common Pitfalls
Common mistakes when using flow starting points include:
- Not setting any flow starting point, so the prototype starts from the first frame in the layers panel, which may not be desired.
- Setting multiple flow starting points in one file without clear navigation, confusing the prototype flow.
- Forgetting to check the Prototype tab to confirm the flow starting point icon is visible.
Always verify your flow starting point before presenting.
text
/* Wrong: No flow starting point set */ // Prototype starts from first frame alphabetically or by layer order. /* Right: Set flow starting point */ // Right-click desired frame > Set as Flow Starting Point // Confirm blue arrow icon appears.
Quick Reference
| Action | Description |
|---|---|
| Right-click frame | Open context menu on the frame you want as start |
| Set as Flow Starting Point | Marks the frame as the prototype's first screen |
| Check Prototype tab | See the blue arrow icon confirming the start point |
| Present prototype | Starts the prototype from the selected flow starting point |
Key Takeaways
Set the flow starting point by right-clicking a frame and choosing 'Set as Flow Starting Point'.
The flow starting point controls where your prototype begins during presentation.
Always confirm the blue arrow icon appears on the frame in the Prototype tab.
Avoid multiple unclear flow starting points to keep prototype navigation simple.
If no flow starting point is set, the prototype starts from the first frame by default.