User request flow (DITAA)

Updated
View as text
Open in Confluence
Open in ChatGPT Open in Claude

Ditaa turns aligned ASCII into filled shapes. The source stays readable in a terminal, which is why it suits diagrams that also live in a README.

#What this example shows

  • Colour markers inside boxes.

  • Rounded corners, drawn with slashes.

  • A dashed line, marked with equals signs.

#A worked example

Open it, edit it, or copy the source below.

User request flow (DITAA)

The source, which you can paste into a new diagram and edit:

    +--------------+       +--------------+
    |cBLU          |       |cGRE          |
    |   Browser    +------>+   CDN edge   |
    |              |       |              |
    +--------------+       +------+-------+
                                  |
                                  v
                         +--------+--------+
                         |cYEL             |
                         |   Application   |
                         |      tier       |
                         +--------+--------+
                                  |
                    +-------------+-------------+
                    |                           |
                    v                           v
            /----------------\        +-----------------+
            |cPNK            |        |{s}              |
            |  Cache (Redis) |        |  Postgres       |
            \----------------/        +-----------------+

#Making it your own

  • Alignment is the syntax. One misplaced pipe breaks the box.

  • Colour codes are three-letter markers: cRED, cBLU, cGRE, cYEL, cPNK.

  • {s} adds a drop shadow; /---\ gives rounded corners.

Specialists. Borrow one when you need it.