0
0
FigmaHow-ToBeginner · 3 min read

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

ActionDescription
Right-click frameOpen context menu on the frame you want as start
Set as Flow Starting PointMarks the frame as the prototype's first screen
Check Prototype tabSee the blue arrow icon confirming the start point
Present prototypeStarts 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.