Allgemeine Einführung
ZenUML ist eine plattformübergreifende Diagramm-as-Code-Lösung, die sich auf die Erstellung von Sequenzdiagrammen und Flussdiagrammen konzentriert. Es vermeidet Verzögerungen bei serverseitigen Interaktionen, indem es Diagramme in Echtzeit im Browser rendert, so dass der Denkprozess des Benutzers nicht durch ineffiziente Drag-and-Drop-Operationen oder langsame Ladeanimationen unterbrochen wird.ZenUML's Diagramme sind nicht nur statische Bilder, sondern der Benutzer kann mit den Diagrammen interagieren, z.B. durch Hervorheben der Nachricht auf dem Diagramm im Bearbeitungsmodus wird automatisch der entsprechende Code ausgewählt.ZenUML legt Wert auf Datenschutz und Sicherheit, da niemals Daten zum Rendern an den Server gesendet werden. Daten werden zum Rendern niemals an den Server gesendet, um die Sicherheit der Benutzerdaten zu gewährleisten. Das Tool ist OMG UML 2.5.1-konform und bietet umfangreiche Erweiterungen, wie z. B. Wolkensymbole, um Diagramme besser lesbar zu machen.ZenUML wird in einer Vielzahl von Branchen eingesetzt, z. B. in der Finanzbranche, in der Telekommunikation und im Einzelhandel, und wird von einer Vielzahl von Plattformen unterstützt, darunter Confluence, Webanwendungen, Browser-Erweiterungen, IDE-Plug-ins und Desktop-Anwendungen.
Funktionsliste
- Echtzeit-Rendering: Rendert Diagramme in Echtzeit im Browser ohne serverseitige Interaktion.
- Interaktive Diagramme: Benutzer können mit Diagrammen interagieren und schnell durch komplexe Diagramme navigieren.
- Datenschutz und Sicherheit: Es werden keine Daten zum Rendern an den Server gesendet, wodurch die Datensicherheit gewährleistet ist.
- Normenkonformität: Entspricht OMG UML 2.5.1 und bietet umfangreiche Erweiterungen.
- Multiplattform-Unterstützung: Confluence, Web-Anwendungen, Browser-Erweiterungen, IDE-Plug-ins und Desktop-Anwendungen werden unterstützt.
- Einfachere DSL: Verwenden Sie eine einfachere DSL-Sprache, um die Anzahl der Codezeilen zu reduzieren und die Lesbarkeit und Wartbarkeit zu verbessern.
- Professioneller Support: Wir bieten Installations-, Schulungs- und Ausfallsupport, wobei die meisten Probleme innerhalb von 8 Stunden gelöst werden.
- Reichhaltige Erweiterungen: z. B. Wolkensymbole, um Diagramme besser lesbar zu machen.
Hilfe verwenden
Ablauf der Installation
- Verwendung von Webanwendungen::
- Besuchen Sie die ZenUML-Website (https://zenuml.com/).
- Registrieren Sie sich und melden Sie sich bei Ihrem Konto an.
- Betreten Sie den Arbeitsbereich und beginnen Sie mit der Erstellung des Diagramms.
- Confluence-Plugin-Installation::
- Wählen Sie im Confluence-Verwaltungs-Backend die Option Anwenden.
- Suchen Sie nach "ZenUML" und klicken Sie auf "Installieren".
- Sobald die Installation abgeschlossen ist, fügen Sie das ZenUML-Makro zur Seite hinzu und beginnen mit der Erstellung des Diagramms.
- Installation von Browser-Erweiterungen::
- Suchen Sie in Ihrem Browser-Erweiterungsshop nach "ZenUML".
- Klicken Sie auf "Zum Browser hinzufügen" und folgen Sie den Anweisungen, um die Installation abzuschließen.
- Sobald die Installation abgeschlossen ist, klicken Sie auf das ZenUML-Symbol in der Browser-Symbolleiste, um mit der Erstellung des Diagramms zu beginnen.
- IDE-Plugin-In-Installation::
- Suchen Sie im Plugin-Markt der IDE nach "ZenUML".
- Klicken Sie auf "Installieren" und folgen Sie den Aufforderungen, um die Installation abzuschließen.
- Nach der Installation öffnen Sie das ZenUML-Plugin in der IDE und beginnen mit der Erstellung von Diagrammen.
Verwendung Prozess
- Erstellen von Sequenzdiagrammen::
- Wählen Sie im Arbeitsbereich "Neues Diagramm".
- Wählen Sie die Vorlage Sequenzdiagramm.
- Schreiben Sie Code mit der ZenUML-DSL-Sprache, zum Beispiel:
Alice --> Bob: Hallo Bob, wie geht es dir? Bob --> Alice: Mir geht es gut, danke!
- Zeigen Sie Diagramme in Echtzeit an, nehmen Sie Anpassungen und Optimierungen vor.
- Flussdiagramme erstellen::
- Wählen Sie im Arbeitsbereich "Neues Diagramm".
- Wählen Sie die Vorlage Flussdiagramm.
- Schreiben Sie Code mit der ZenUML-DSL-Sprache, zum Beispiel:
Start :Schritt 1; :Schritt 2; :Schritt 3; :Schritt 4; :Schritt 5; :Schritt 6; :Schritt 7 :Schritt 2; :Schritt 3; :Schritt 4; :Schritt 5; :Schritt 6; :Schritt 7 Schritt 3. Start :Schritt 1; :Schritt 2; :Schritt 3; :Schritt 4; :Schritt 5
- Zeigen Sie Diagramme in Echtzeit an, nehmen Sie Anpassungen und Optimierungen vor.
- Exportieren und Weitergeben von Diagrammen::
- Wenn Sie die Erstellung des Diagramms abgeschlossen haben, klicken Sie auf die Schaltfläche "Exportieren" und wählen Sie das Exportformat (PNG, SVG usw.).
- Teilen Sie Diagramme per Link oder Einbettungscode.
- Erweiterte Funktionen::
- Verbessern Sie die Lesbarkeit von Diagrammen mit Wolkensymbolen und anderen Erweiterungen.
- Markieren Sie Meldungen auf dem Diagramm im Bearbeitungsmodus, um schnell im Code zu navigieren.
- Besuchen Sie das ZenUML Help Centre für weitere Tipps und Unterstützung.
allgemeine Probleme
- Wie gewährleisten Sie die Datensicherheit? ZenUML sendet keine Daten zum Rendern an den Server, alle Operationen werden lokal durchgeführt, um die Datensicherheit zu gewährleisten.
- Wie erhalte ich technische Unterstützung? Besuchen Sie das ZenUML Help Centre, um eine Supportanfrage zu stellen. Die meisten Probleme werden innerhalb von 8 Stunden gelöst.
- Unterstützt es die Teamarbeit? ZenUML unterstützt die Zusammenarbeit in Teams, in denen Benutzer Diagrammlinks austauschen und Diagramme gemeinsam bearbeiten und anzeigen können.
Schematischer Anspitzer D2
Es gibt viele Werkzeuge zur Erstellung von Schaltplänen.
Ich verwende gerne textcodebasierte Diagrammwerkzeuge für Wireframe-Diagramme wie Mermaid, Plantuml, Graphviz.
Sie alle erzeugen Bilder auf der Grundlage des Codes und eignen sich perfekt für die Aufnahme in Code-Repositories zur Versionierung.
Kürzlich entdeckte ich ein viel einfacher zu bedienendes Werkzeug dieser Art D2Im Folgenden möchten wir Ihnen ein einfaches, intuitives und leistungsstarkes Instrument vorstellen.
D2 kann in der Befehlszeile oder im Browser verwendet werden. Angenommen, Sie haben eine Bildcode-DateiBeispiel.d2
Dann lautet der Befehl zur Erstellung des Bildes wie folgt.
$ d2 Beispiel.d2
Die meiste Zeit verwende ich es über meinen Browser. Es gibt einen Online-Generator play.d2lang.com(unten), fügen Sie den Code ein, drücken Sie die Schaltfläche "Kompilieren", und das Bild wird sofort erstellt.
Wenn Sie Knoten A wünschen (der Name des Knotens ist A), geben Sie einfach A ein.
A
A ist nur der Name des Knotens. Wenn Sie den Inhalt des Knotens anpassen möchten, schreiben Sie ihn wie unten.
A: A
Als nächstes fügen Sie einen Knoten hinzu.
A: A
B: B
Verbinden Sie sie.
A: A
B: B
A -> B
Die Verbindung kann mit einem positiven Pfeil (->
), oder Sie können den Rückwärtspfeil (<-
), und sogar bidirektionale Pfeile (). Wenn Sie keine Pfeile benötigen, verbinden Sie einfach die Linien (
--
).
Den Pfeilen kann auch Text hinzugefügt werden.
A: A
B: B
A -> B: Verbindung
Es können mehrere Verbindungen zwischen Knoten bestehen.
A: A
B: B
A -> B: Anfrage
A <- B: Antwort
Knotenverbindungen können auch in eine Zeile geschrieben werden.
A -> C <- B: Verbindung
Stufe 1 -> Stufe 2 -> Stufe 3 -> Stufe 4
Stufe 4 -> Stufe 1: Rückmeldung
Diese Syntax reicht aus, um ein einfaches Drahtgitterdiagramm zu zeichnen, das ist doch ganz einfach.
D2 kann sehr komplexe Diagramme zeichnen, für mehr Syntax siehe(Computer-)Datei.
Ein letzter Hinweis: Wenn Sie die Form des Knotens ändern möchten, wird das Feld in einen Kreis umgewandelt, wie unten beschrieben.
A: A
A.Form: Kreis
Die Form kann sogar in eine Wolke geändert werden, um einen Cloud-Dienst anzuzeigen.
A: A
A.Form: Wolke
Die Linienfarbe kann ebenfalls geändert werden.
A: A
A.style.stroke: rot