Flowcharts from an AI reply, exported to Word

Step 1: ask for flowchart code

Send this to ChatGPT or Claude (fill in the topic):

Draw a flowchart in Mermaid for: an online order from checkout to delivery. Requirements: reply with one complete mermaid code block only, the first line must be flowchart TD, keep node labels short.

The more concrete the steps and decisions, the closer the reply. Branches such as “cancel automatically if unpaid after 30 minutes” or “show out of stock when inventory is short” only appear if you mention them.

Step 2: copy the whole reply, paste it

Click “Copy” under the reply, open the editor and paste. No need to cut out the code block: the status line reports “flowchart code extracted from the reply”. A typical result looks like this; click “Open in the editor”:

flowchart TD
    A([Order placed]) --> B{In stock?}
    B -- No --> C[Show out of stock] --> Z([End])
    B -- Yes --> D[Reserve stock, create order]
    D --> E{Paid within 30 min?}
    E -- No --> F[Cancel and release stock] --> Z
    E -- Yes --> G[Merchant ships]
    G --> H[Delivery]
    H --> I{Delivery confirmed?}
    I -- Yes --> J([Complete])
    I -- No reply in 7 days --> J

Step 3: make it yours

• Text: double-click a node in the preview, type, press Enter.
• Insert a step: add a line in the code, for example a review before shipping: D --> D2[Fraud check] --> E, and delete the old D --> E.
• Decisions: {Condition?} is a diamond; branch text goes on the arrow: E -- No --> F.
• Start / end: the stadium shape ([text]) is the convention; a database is [(text)].
• Wide layout: “Layout” above the preview → direction “Left→right”, which fits a slide.
• Parentheses in a label: wrap it in double quotes, A["Confirm delivery (7 days)"], or the parser reports an unclosed bracket.

Group by role: swimlanes

When several roles or departments take part, wrap each role's steps in a subgraph and you have a swimlane diagram. When generating, add “group the steps by role with subgraph: employee, line manager, HR” to the prompt. Writing it by hand is short too:

flowchart TB
    subgraph Employee
        direction LR
        A[Fill in leave form] --> B[Submit]
    end
    subgraph Line manager
        direction LR
        C{3 days or fewer?} --> D[Approve]
    end
    subgraph Department head
        E[Approve]
    end
    subgraph HR
        F[Record and notify]
    end
    B --> C
    C -- No --> E
    D --> F
    E --> F

The swimlane category of the template library has four ready-made ones: leave approval, purchase approval, expense reimbursement and order fulfilment.

Step 4: export to Word

▾ next to “Download PNG” → “Export Word (docx)”. The file holds a 3x image and the original Mermaid code at the end; to change it later, copy the code back. To drop the diagram into an existing document, “Copy PNG to clipboard” and paste is faster; for slides choose “Export PowerPoint (pptx)”.

If it errors

The most common mistakes in AI-written flowcharts: -> instead of -->, end used as a node name, a subgraph without end. The error bar names the problem and the line; click “AI fix” or follow Common errors and how to fix them.

Related

• Edit, lay out and fix
• Export to Word, PowerPoint and PDF
• Want to drag nodes around: Free canvas