How to create a prototype with AI

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 least 2 screens you want to connect.

How to create a prototype with AI

  1. Open the board that contains the screens you want to prototype.
  2. Switch to Prototype mode from the top bar.


  3. Select at least 2 screens you want to connect.
  4. Click Create prototype with AI. This button will appear above the selected screens or in the Prototype panel on the right.


  5. Wait for Visily AI to create the prototype connections.
  6. Review the generated flow using one of these options:
    1. Click the Play button in the Flow tab to open the presentation view in a new tab.


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

Edit the generated prototype

After the prototype is generated, you can fine-tune the connections to better match your intended user journey. You can update the interaction links, adjust the flow, or manually add more prototype interactions if needed.
For more details about interaction types and how to set them up, see the Prototype guide.

Note

  1. Running Create prototype with AI on selected screens will replace any existing prototype connections for those screens. A confirmation message will appear before Visily AI replaces existing connections.
  2. When you generate apps or flows with Visily AI Assistance, the generated screens may already include prototype connections.
  3. Create Prototype with AI can generate prototype connections for up to 20 selected screens at a time.
  4. Create prototype with AI uses AI credits and costs 10 credits/request.
Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.

    • Related Articles

    • 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 guide AI generation with presets

      This article explains how to guide AI generation with presets in Visily. Presets help you steer the AI toward the type of output, style, and visual direction you want. Use presets to guide AI generation You can use the following presets and guidance ...

    • How to use AI Plan mode

      This article explains how to use AI Plan Mode in Visily. Plan Mode helps you create a structured design plan before generating the actual design. Access and use AI Plan mode In the Visily AI chat box, choose Plan Mode. Enter a prompt describing what ...

    • How to set design instructions for AI

      This article explains how to set design instructions for AI in Visily. Design Instructions help you guide the AI with consistent preferences, so generated results stay more aligned with your project’s style, context, and requirements. Set up Design ...

    • What you can do with the Visily AI Chat Assistant

      This article gives an overview of how you can use the Visily AI Chat Assistant to support your design process. What you can do with the Visily AI Chat Assistant The Visily AI Chat Assistant helps you generate and refine designs throughout your design ...