Meerjungfrauen plotten besser

Mermaids sind diese Meeresbewohner, die angeblich besser küssen. Um die soll es hier (zur Enttäuschung von neunzig Prozent der männlichen Leserinnen) nicht gehen. Stattdessen möchte ich euch darauf aufmerksam machen, dass Mermaid im digitalen Kontext eine Software und vor allem eine Auszeichnungssprache bezeichnet.

Letztere hat eine Verwandtschaft zu Markdown. Sie ist einfach gehalten, strukturiert die Inhalte mittels simpler Steuerzeichen, und sie ist dazu da, Diagramme in Textform zu beschreiben. Die Sprache eignet sich für diverse Typen, u. a. Flowcharts, Sequenzen und Gantt-Balken. Sie ebnet dem Austausch dieser Darstellungen zwischen einzelnen Anwendungen den Weg. Aber darüber hinaus ist sie nicht weltbewegend – oder?

Nein, aber es ergibt sich ein spannender Anwendungsfall: Die meisten gängigen Sprachmodelle sind in der Lage, Informationen in dieser Form auszugeben. Im Prompt fragen wir nach einem hierarchischen Wissensgraph mit Mermaid.js-Syntax.

Der Bundesstaat als Flussdiagramm

Für einen Sonntagszeitungs-Artikel spiele ich das für einige Beispiele durch. Ein erster Versuch besteht darin, die wesentlichen Aspekte der Schweizer Bundesregierung in ein Diagramm umzuwandeln. Gemini liefert umgehend das Code-Snippet, das ich probehalber bei mermaid.live/edit eingebe. Das ist die kostenlose Online-Anwendung, die auf Github auch im Quellcode verfügbar ist.

Das Resultat ist eine untadelige Visualisierung, die sich im Browser ansehen und per Link weitergeben lässt. Falls ich es richtig verstanden habe, stecken sämtliche Informationen in der (ellenlangen) URL, sodass die gewissermassen auch als Dateispeicherung fungiert. Bearbeiten lässt sich das Diagramm nicht, aber es lässt sich als PNG-Grafik und im Vektorformat SVG exportieren.

Einen ausgewachsenen Editor findet sich unter mermaid.ai. Diese Anwendung ist nicht kostenlos wie die Basisvariante, sondern benötigt ein Abo: Es gibt zwei Preispläne, Plus für zehn und Premium für zwanzig US-Dollar pro Jahr. Für dieses Geld gibt es die Möglichkeit, die Diagramme in der Cloud zu speichern und zu bearbeiten. Mehrere Leute können via Team-Funktion an den gleichen Projekten arbeiten.

Die KI hilft auch bei der Bearbeitung

Wie die URL andeutet, erstellt die Cloud-Variante von Mermaid Diagramme automatisch per KI. Das wirkt auf den ersten Blick überflüssig, da dank Mermaid.js-Syntax wie beschrieben «normale» Sprachmodelle in der Lage sind, diese Arbeit zu erledigen. Allerdings kann die Mermaid-KI nachträglich einzelne Elemente über einen Prompt modifizieren – was ungeübte User allenfalls nützlich finden.

Die Features sind ansonsten überschaubar: Wir wählen zwischen mehreren Looks (Neo, Handgezeichnet und Classic), wechseln zwischen den zehn zur Auswahl stehenden (und meines Erachtens nicht sonderlich extravaganten) Themes oder modifizieren Elemente manuell, wobei wir Farbe bzw. Farbschema, Form, Konturen und Linien ändern, zwischen manuellem und automatischem Layout umschalten und mit Bildern und Icons operieren. Eine nicht zu unterschätzende Funktion steckt in der Change direction-Schaltfläche mit den beiden Winkeln: Sie ändert die Orientierung. Statt von oben nach unten fliesst das Diagramm von links nach rechts, von rechts nach links oder von unten nach oben.

Richtig schön wirds mit Excalidraw

Nun ist meine Lieblings-App für Flussdiagramme und andere technische Darstellungen jedoch erklärtermassen Excalidraw. Die Frage liegt auf der Hand: Bekomme ich das KI-generierte Diagramm auch in dieses Programm hinein?

Die Antwort ist erfreulicherweise ein Ja. Auf Github findet sich das Konvertierungsprogramm Mermaid-to-excalidraw, das online benutzbar ist. Und voilà, mit einem kleinen Umweg landet das KI-generierte Diagramm in der Lieblings-Anwendung, wo es nach allen Regeln der Kunst aufgehübscht und nachbearbeitet werden kann. Sind solche simple, offene Auszeichnungssprachen nicht grossartig?