Swimlane or plain flowchart?

Use swimlanes when several departments or systems hand work to each other, so ownership is visible; use a plain flowchart for a single role's steps. The syntax is the same apart from the subgraph blocks.

The diagram is getting too wide

Change TB to LR so the main path runs horizontally, or move details into a second diagram. Export at 3x so the text stays sharp when scaled down.

Can I hand this to an AI to extend?

Yes. Send the code together with your request, for example "add a quality check in the warehouse lane", and paste the whole reply back into the editor.

Order Fulfilment Swimlane Diagram Template

E-commerce order handling across four lanes (customer, support, warehouse, logistics): order and payment, review, stock check and restocking, picking, shipping, delivery and after-sales. Free PNG, SVG, Word and PowerPoint export.

Previewed in the “Cinnabar” theme; you can switch themes in the editor

Open in the editorFree · No sign-up · No watermark

Edit the text, pick a theme, export Word / PowerPoint / PDF

When to use it

Operations manuals, warehouse SOPs and requirement documents for order systems. One lane per role, a main path from order to delivery, a restocking branch when stock is short, and an after-sales branch after delivery.

Making it yours

Add steps such as reconciliation or invoicing as a new subgraph and connect its nodes to the main path.
Edges can be chained: A --> B --> C is the same as three separate lines and easier to edit.
Make the exception branch dashed to set it apart: H -. Problem .-> I.
The default theme is Cinnabar, good for slides; switch to Light for a white document.

Mermaid code

flowchart TB
    subgraph Customer
        A[Place order and pay]
        H[Confirm delivery]
    end
    subgraph Support
        B[Review order]
        I[Handle after-sales]
    end
    subgraph Warehouse
        C{In stock?}
        D[Pick and pack]
        E[Ask purchasing to restock]
    end
    subgraph Logistics
        F[Ship]
        G[Deliver and get signature]
    end
    A --> B --> C
    C -- Yes --> D
    C -- No --> E --> D
    D --> F --> G --> H
    H -- Problem --> I

Ask an AI for one with this structure

Send the prompt below to ChatGPT or Claude, then paste the whole reply into the editor; the code inside is detected automatically.

Draw an order fulfilment swimlane diagram in Mermaid flowchart syntax with subgraph lanes for Customer, Support, Warehouse and Logistics. The customer places an order and pays; support reviews it; the warehouse checks stock (asks purchasing to restock if short) and picks and packs; logistics ships and delivers; the customer confirms delivery, and any problem goes to support for after-sales. Output only the mermaid code block.

FAQ

Swimlane or plain flowchart?: Use swimlanes when several departments or systems hand work to each other, so ownership is visible; use a plain flowchart for a single role's steps. The syntax is the same apart from the subgraph blocks.
The diagram is getting too wide: Change TB to LR so the main path runs horizontally, or move details into a second diagram. Export at 3x so the text stays sharp when scaled down.
Can I hand this to an AI to extend?: Yes. Send the code together with your request, for example "add a quality check in the warehouse lane", and paste the whole reply back into the editor.

More in this category

All templates

Updated 2026-09-05