How to use Flows to organize your prototype

How to use Flows to organize your prototype

A flow in Visily prototype mode is a set of connected screens that represents a specific user journey in your prototype. Use flows to organize prototype paths in your board, such as onboarding, sign-up, checkout, or other user journeys.

Before you start

  1. Make sure your board has the screens you want to include in the prototype flow.
  2. To create or manage flows, switch your board to Prototype mode.

How to create a flow

  1. Open the board that contains your prototype. Switch to Prototype mode.
  2. Select the screen you want to use as the starting point of the flow.
  3. Click Create flow above the selected screen. The selected screen will become the starting screen of that flow.

How to manage flows

Once a flow is created, you can manage it from:
  1. The Flows section in the Prototype panel, where you can view all flows in the board.


  2. The More actions menu in the flow name tab.

Available actions include:
  1. Rename a flow
  2. Change the starting screen
  3. Delete a flow
  4. Present a flow
  5. Copy the presentation link

How to review a flow

To review a flow, use one of these options:
  1. Click the Flow name tab or the Play button next to the flow listed in the Prototype panel to open the presentation view in a new tab.


  2. In the Flow tab, click More actions icon and select Quick preview to open the preview dialog inside the board.

Note

  1. A board can have multiple flows. Each flow should have a clear starting screen.
  2. Use clear flow names so your team can understand what each prototype path is for.
  3. Flows help organize prototype journeys, but interactions still need to be set up between screens or elements.
Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.

    • Related Articles

    • How to use Quick Preview to review your prototype

      Use Quick Preview to test your prototype directly on the canvas as you design. It’s useful for quick checks and fast edits, with live sync reflecting your changes immediately. Before you start Switch your board to Prototype mode. Make sure your ...

    • How to access Prototype mode

      Visily’s Prototype mode lets you create interactive app flows by connecting screens or elements. You can simulate real user journeys, making your designs feel like a real app, even before development starts. Before you start Make sure your board ...

    • How to present your prototype

      Presentation mode lets you experience your design in full screen, just like a real app. It’s perfect for walking through complete flows, sharing with teammates, or showcasing your ideas. Before you start Switch your board to Prototype mode. Make sure ...

    • How to create a prototype with AI

      Use Create prototype with AI to quickly build an interactive flow from selected screens. Visily automatically connects the screens with interaction links, helping you visualize the user journey faster. Before you start Make sure your board has at ...

    • How to set up prototype scrolling

      Set up prototype scrolling to make screens or containers behave more like real app or website experiences during preview and presentation. Before you start Switch your board to Prototype mode before setting up scrolling. Make sure the content inside ...