Flow diagrams can help greatly to explain some flow, it works much better the just text. To generate visual flows from text (markdown), Knut Sveidqvist created Mermaid-js. It’s awesome, go check out the docs.
Mermaid will turn this (markdown):
Into this basic flow:
Use Mermaid-js in Github Pages
To use it in Github Pages (or Jekyll), you’ll need to do some extra config.
Download the latest release
Go to mermaid-js release page and download the latest release.
I downloaded Mermaid-js 8.9.2 release, and just took the
dist\mermaid.min.js.map and copied them to
assets\mermaid-8.9.2 (new) folder in my Jekyll project.
Code your graphs
To see the result, you’ll need to add some flow code to your page, like