[Help Center] Diagram To Design

Visily provides a variety of AI tools designed to speed up your design process, including the Diagram to Design AI. This innovative tool makes it easy to transform your flowcharts and sitemaps into wireframes for both mobile apps and websites.

How to access Diagram to Design AI

Getting started with our Diagram to Design AI is simple. Here are the ways you can access it:

  1. Through AI Chat Assistant: Open “Ask AI” button to open the AI Chat box. Click on “AI Features” button, and then select “Generate design from diagram.”
  2. Through diagram section: Navigate to the section containing the diagrams you’d like to use. On the context toolbar above this section, click the “Ask AI” icon to open the AI Chat box. From there, select “Generate design from diagram.”

How to generate design using diagram

Follow these steps to transform your diagrams into designs. Here’s how to use our Diagram to Design AI:

  1. Choose “Generate design from diagram” from any of the access points mentioned above to initiate a new conversation with your AI Assistant.
  2. The AI Assistant will prompt you to select a section with the diagrams you’d like to use.
  3. After you’ve selected the section, you’ll need to provide a brief prompt describing your app or website.
  4. The AI will then generate a list of screens based on your prompt. You can modify this list as needed—add new screens, edit existing ones, remove those you don’t need, or reorder them.
  5. When you’re satisfied with the screens, click “Continue.” The AI Assistant will generate the design for you.
  6. Once generated, select “Add to board” to bring the design into your canvas.

If you’d like to make changes to your design, we recommend you to take advantage of our Modify Design AI tool. You can learn more about it here.

Note: Each time you use the Generate design using diagram feature, it will cost 30 credits.