tutorials

How to create a PlantUML architecture diagram with ChatGPT

PlantUML supports architecture diagrams suited for cloud architecture. It also includes cloud icons.

To guide ChatGPT (or any LLM) to create a PlantUML architecture diagram, you can start with the code or an explanation.

STEP 1a: Write your instructions for the architecture and copy it.

STEP 1b: OR, copy your code via files-to-prompt:

uvx files-to-prompt --cxml README.md ... | xclip -selection clipboard

STEP 2: Copy the icons list for your cloud environment:

These were generated via bash icons.sh.

STEP 3: Copy this prompt to ChatGPT (or any LLM):

Create a PlantUML component diagram for the technical architecture based on the code/instructions below.

[Your code or instructions from STEP 1]

For EVERY cloud component use the icon macro ONLY from this list:

[Your .puml from STEP 2]

Here's an example with Azure icons. Use the icon macros from the list above.

<puml>
@startuml
' Replace AzurePuml with AWSPuml, GCPPuml, ...
!define AzurePuml https://...
!includeurl AzurePuml/...
...

actor User as u

' Define nodes with just the macro name without path/prefix/namespace
AzureBlobStorage(e_blob, "Static Assets", "Static website hosting")
AzureCDN(e_cdn, "Azure CDN", "Global content distribution")
...

' Add links
u --> e_cdn : HTTP(S) requests
e_cdn --> e_blob : Retrieve static files
...
@enduml
</puml>

STEP 4: Paste the PlantUML code into PlantUML online editor.

Here is an example with AWS:

Here is an example with Azure: