Unser Buch Coding mit KI wird gerade übersetzt. Heute musste ich diverse Fragen zur Übersetzung beantworten und habe bei der Gelegenheit ein paar Beispiele aus unserem Buch mit aktuellen Versionen von ChatGPT und Claude noch einmal ausprobiert. Dabei ging es um die Frage, ob KI-Tools technische Diagramme (z.B. UML-Diagramme) zeichnen können. Die Ergebnisse sind niederschmetternd, aber durchaus unterhaltsam :-)

UML-Diagramme

Vor einem halben Jahr habe ich ChatGPT gebeten, zu zwei einfachen Java-Klassen ein UML-Diagram zu zeichnen. Das Ergebnis sah so aus (inklusive der falschen Einrückungen):

+-------------------------+
|         Main            |
+-------------------------+
| + main(args: String[]): void |
| + initializeQuestionPool(): List<Question> |
+-------------------------+

+-------------------------+
|        Question         |
+-------------------------+
| - text: String          |
| - answers: List<Answer> |
| - correctAnswers: List<Answer> |
+-------------------------+
| + Question(text: String, answers: List<Answer>, 
|            correctAnswers: List<Answer>) |
| + askQuestion(): void   |
| - validateAnswer(userInput: String): boolean |
+-------------------------+

Dabei war ChatGPT schon damals in der Lage, PlantUML- oder Mermaid-Code zu liefern. Der Prompt Please generate PlantUML code instead liefert brauchbaren Code, der dann in https://www.planttext.com/ visualisiert werden kann. Das sieht dann so aus:

Heute habe ich das ganze Beispiel noch einmal ausprobiert. Ich habe also den Java-Code für zwei Klassen an ChatGPT übergeben und um ein UML-Diagramm gebeten. Vorbei sind die ASCII-Zeiten. Das Ergebnis sieht jetzt so aus:

Leider kann ich hier keinen Link zum ganzen Chat-Verlauf angeben, weil ChatGPT anscheinend nur reine Text-Chat-Verläufe teilen kann.

Visualisierung eines Docker-Setups

Beispiel zwei ergibt sich aus zwei Prompts:

Prompt: I want to build a REST application using Python and Django. The application will run in a Docker container. Do I need a proxy server in this case to make my application visible to the internet?

Prompt: Can you visualize the setup in a diagram?

In der Vergangenheit (Mitte 2024) lieferte ChatGPT das Diagramm als ASCII-Art.

+---------------------------+
|      Client Browser       |
+-----------+---------------+
            |
            v
+-----------+---------------+
|       Nginx Reverse Proxy |
|  (Handles SSL, Load       |
|   Balancing, etc.)        |
+-----------+---------------+
            |
            v
+-----------+----------------+
| Docker Container Network   |
|                            |
|  +----------+   +---------+|
|  |  Web     |   |  DB     ||
|  | Container|   |Container||
|  +----------+   +---------+|
|   (Django)       (Postgres)|
+----------------------------+

Erst auf die explizite Bitte liefert es auch Mermaid-Code, der dann unter https://mermaid.live/ gezeichnet werden kann.

Heute (Dez. 2024) gibt sich ChatGPT nicht mehr mit ASCII-Art ab sondern leitet den Diagrammwunsch an DALL-E weiter. Das Ergebnis ist eine Katastrophe.

Auch Claude.ai zeichnet selbstbewusst ein Diagramm des Docker-Setups. Dabei wird intern Mermaid verwendet.

Fazit

Die Diagramme haben durchaus einen hohen Unterhaltungswert. Aber offensichtlich wird es noch ein wenig dauern, bis KI-Tools brauchbare technische Diagramme zeichnen können. Der Ansatz von Claude wirkt aber auf jeden Fall vernünftiger. Technische Diagramme mit DALL-E zu erstellen ist doch ein wenig gewagt, um es einmal vorsichtig zu formulieren.

Die besten Ergebnisse erzielen Sie weiterhin, wenn Sie ChatGPT, Claude oder das KI-Tool Ihrer Wahl explizit um Code in PlantUML oder Mermaid bitten. Den Code können Sie dann selbst visualisieren und bei Bedarf auch weiter optimieren.