Flowcharts in Visily

Flowcharts in Visily

Use flowcharts to visually map processes, decisions, and workflows. Visily provides common flowchart shapes and connectors that you can add, connect, and customize directly on your board.

Before you start

Make sure you have permission to edit the board and are in design editing mode.

Available flowchart shapes

Open the Flowchart Diagram section of the Diagram Library to find the following shapes:
  1. Start/End: Indicates where a process begins or finishes.
  2. Input/Output: Represents information entering or leaving a process.
  3. Process: Represents an action, task, or step.
  4. Decision: Represents a point where the flow branches based on a condition.
  5. Connector: Links different parts of a flowchart.
  6. Merge: Shows multiple flows combining into one.
  7. Extract: Represents information or items being separated from a process.

Add a flowchart shape

You can add a flowchart shape in the following ways:
  1. From the Diagram Library: Open the Flowchart Diagram section, select a shape, then click the canvas to add it.
  2. From an existing shape:
    1. Click a + icon to add and automatically connect a new shape in that direction.

    2. Click and drag a + icon to create a connector, then choose the shape to add.


    3. Add multiple shapes from the same connection point or direction as needed.

Info
By default, a new shape added with the + icon uses the same shape type as the original.

Customize a flowchart shape

Select a flowchart shape to open its toolbar. The available actions include:
  1. Shape style: Switch to another shape type or choose a different visual style.
  2. Text editing: Change the font style and size, apply bold, italic, underline, or strikethrough formatting, and adjust the text alignment.
  3. Shape formatting: Customize the shape color and border style.
  4. Hyperlink: Add a link to a webpage, document, or other reference.
  5. Autofill text: Use AI to generate or replace the text content based on your instructions.
  6. Export: Export the selected shape as an image or PDF, or send it to Figma.
  7. More actions: Access additional options such as align, arrange layers, copy, duplicate, and delete.

Connect flowchart shapes

Use connectors to link flowchart shapes and show the direction of a process. For instructions on adding and customizing connectors, see Connect diagram elements.
Idea
Tips for creating a clear flowchart
  1. Use consistent shapes for the same types of steps throughout the flow.
  2. Add labels to decision branches to clarify each possible outcome.
  3. Keep connectors moving in a consistent direction where possible.
  4. Use colors sparingly to distinguish statuses, teams, or process stages.
  5. Turn on Grid Mode to help align and snap elements into place.                                                                                                                                       

Need more help?
If this does not solve your issue, contact support and include a screenshot if possible.

    • Related Articles

    • 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 ...

    • Prompt guide for the Visily AI Chat Assistant

      Create great designs, diagrams, and images with Visily AI by writing clear, focused prompts. This guide shows you how. 🔑 Golden Rule: Always State the Output Type Clearly specify what you want to generate: UI Screens: Indicate the platform (mobile, ...

    • Component Templates in Visily

      This article explains what Component Templates are in Visily and how to use them to build designs faster. What Component Templates are Component Templates are ready-made UI building blocks that help you add detail to your design without creating ...

    • Diagram Templates in Visily

      This article explains what Diagram Templates are in Visily and how to use them to create diagrams faster. What Diagram Templates are Diagram Templates are premade templates for common diagram, planning, and brainstorming use cases. In Visily, they ...

    • App Templates in Visily

      This article explains what App Templates are in Visily and how to use them to speed up your design workflow. What App Templates are App Templates are sets of screens arranged in a meaningful flow to represent a complete application type. Examples ...