de_DEen_USes_ESfr_FRhi_INid_IDpl_PLpt_PTru_RUvizh_CNzh_TW

Konversationelles UML: Klassendiagramme sofort mit der eingebetteten KI von VPasCode verfeinern

Einführung

In der schnelllebigen Welt der modernen Softwareentwicklung hinkt die Dokumentation der Entwicklung oft hinterher. Die Diagramm als Code (DaC)Methodik hat sich als leistungsstarke Lösung etabliert, die es Teams ermöglicht, Diagramme wie Quellcode zu behandeln – versionierbar, reproduzierbar und präzise. An der Spitze dieser Revolution steht VPasCode, die einheitliche, browserbasierte Plattform von Visual Paradigm, die branchenübliche Syntaxen wie PlantUML, Mermaid und Graphviz unterstützt.

Während das Schreiben von Code zur Generierung von Diagrammen im Vergleich zum manuellen Zeichnen eine überlegene Präzision bietet, führt es zu einem neuen Reibungspunkt: das manuelle Aktualisieren komplexer Strukturen. Das Hinzufügen von Attributen zu mehreren Unterklassen oder das Refaktorisieren von Beziehungen kann zeitaufwändig und fehleranfällig sein, wenn es zeilenweise erfolgt.

Diagram-as-Code-Arbeitsablauf, der zeigt, wie die KI von VPasCode UML-Klassendiagramme über natürliche Sprachbefehle modifiziert.

Hier setzt VPasCode eingebettete KIden Arbeitsablauf. Durch die Integration von Natural-Language-Processing direkt in den Editor ermöglicht VPasCode Entwicklern, ihre visuellen Modelle konversationell zu verfeinern. Dieser Leitfaden erläutert, wie Sie die Funktion „KI-Ändern“ nutzen können, um ein UML-Klassendiagrammsofort zu aktualisieren und die Lücke zwischen textbasiertem Code und visuellem Design zu schließen, ohne jemals Ihren Arbeitsbereich zu verlassen.


Wichtige Konzepte

Bevor wir in die praktischen Schritte einsteigen, ist es wichtig, die Kerntechnologien zu verstehen, die diese nahtlose Verfeinerung ermöglichen:

  • Diagramm als Code (DaC):Eine Methodik, bei der Diagramme aus textbasiertem Quellcode generiert werden, anstatt manuell mit der Maus gezeichnet zu werden. Dies stellt sicher, dass Diagramme versionierbar, leicht reproduzierbar und in CI/CD-Pipelines integriert sind.

    VPasCode: Einheitliches Diagram-as-Code-Tool für PlantUML, Mermaid & Mehr

  • PlantUML:Ein beliebtes Open-Source-Tool, das einfache textliche Beschreibungen verwendet, um UML-Diagramme zu erstellen. In unserem Beispiel definiert die PlantUML-Syntax die Struktur von Klassen wie Kunde, Bestellung, und Zahlung.

  • Eingebettete KI-Änderung:Im Gegensatz zu externen KI-Tools, die das Hin- und Her-Kopieren von Code erfordern, versteht die eingebettete KI von VPasCode den Kontext Ihrer aktuellen Datei. Sie analysiert Ihren vorhandenen PlantUML-Code, wendet Ihre angeforderten Änderungen (z. B. das Hinzufügen von Attributen oder Methoden) an und schreibt den Code automatisch innerhalb derselben Umgebung neu.

  • Echtzeit-Rendering:VPasCode bietet eine geteilte Bildschirmansicht, in der Änderungen am Code auf der linken Seite sofort im visuellen Diagramm auf der rechten Seite widergespiegelt werden, was sofortiges Feedback gewährleistet und die kognitive Belastung durch den Kontextwechsel reduziert.


Schritt-für-Schritt-Anleitung: Verfeinerung eines Klassendiagramms mit der eingebetteten KI von VPasCode

Die schnelle und bequeme Verfeinerung eines Klassendiagramms innerhalb von VPasCode ohne externe Tools kann in wenigen einfachen Schritten mithilfe der integrierten KI-Funktion durchgeführt werden.

Der Ausgangspunkt

Stellen Sie sich vor, Sie haben ein grundlegendes E-Commerce-Klassendiagramm, das in PlantUML definiert ist. Sie haben eine Zahlung-Klasse mit drei Unterklassen: Bargeld, Scheck, und KreditDerzeit sind diese Unterklassen leere Hüllen, die lediglich von der Elternklasse erben.

(Hinweis: In der tatsächlichen Schnittstelle entspricht dies dem ersten bereitgestellten Bild, das den Code links und das gerenderte Diagramm rechts mit leeren Unterklassen zeigt.)

VPasCode-Schnittstelle, die ein grundlegendes E-Commerce-PlantUML-Klassendiagramm mit leeren Unterklassen Cash, Check und Credit anzeigt.

Abbildung 1: Der Anfangszustand des Klassendiagramms in VPasCode. Beachten Sie die Bargeld, Scheck, und Kredit-Klassen fehlen spezifische Attribute.

Schritt 1: Öffnen Sie das KI-Menü

Um den Verfeinerungsprozess zu beginnen, suchen Sie die KI-Steuerungselemente innerhalb der Editor-Schnittstelle.

  • Klicken Sie auf die KI-Dropdown-Schaltfläche, die sich im oberen linken Bereich über dem Code-Editor befindet. Dieses Menü ist Ihr Zugang zur intelligenten Diagrammanipulation.

VPasCode-Schnittstelle, die das KI-Dropdown-Menü mit den ausgewählten Optionen „Modifizieren“ und „Übersetzen“ zeigt.

Abbildung 2: Das Klicken auf das KI-Dropdown zeigt Optionen zum Ändern oder Übersetzen des Diagramm-Codes.

Schritt 2: Wählen Sie die Option Ändern

Das KI-Menü bietet je nach Bedarf unterschiedliche Funktionen. Für strukturelle Änderungen verwenden Sie die Funktion Ändern.

  • Klicken Sie im Dropdown-Menü auf die ÄndernOption mit dem KI-Symbol daneben. Dies teilt dem System mit, dass Sie beabsichtigen, die bestehende Logik und Struktur des Diagramms zu ändern, anstatt etwas von Grund auf neu zu erstellen.

Schritt 3: Beschreiben Sie die gewünschten Änderungen

Dies ist der wichtigste Schritt, bei dem die natürliche Sprache das manuelle Codieren ersetzt. Sie müssen die genaue PlantUML-Syntax für die neuen Attribute nicht kennen; Sie beschreiben einfach, was Sie wünschen.

  • Im KI-ÄndernDialogfeld, das angezeigt wird, geben Sie eine Beschreibung in natürlicher Sprache ein, wie Sie Ihr Diagramm verfeinern oder ändern möchten.

  • Beispiel-Prompt: „Fügen Sie einige Attribute zu den Unterklassen der Payment-Klasse im Klassendiagramm hinzu“

  • Klicken Sie auf KI-ÄndernSchaltfläche, um Ihre Anfrage einzureichen.

VPasCode-KI-Modifizierungsdialogfeld, das die Aufforderung zeigt, Attribute zu den Kindern der Payment-Klasse im UML-Diagramm hinzuzufügen.
Abbildung 3: Das KI-Ändern-Dialogfeld. Der Benutzer gibt einen Prompt in natürlicher Sprache ein (1) und löst den Prozess aus (2).

Schritt 4: Betrachten Sie das verfeinerte Diagramm

Sobald Sie den Prompt eingereicht haben, beginnt die VPasCode-Engine mit der Arbeit. Sie analysiert die Anfrage, identifiziert die Zielklassen (Cash, Check, Credit) und fügt basierend auf standardisiertem Domänenwissen relevante Attribute und Methoden ein.

  • Die KI verarbeitet Ihre Beschreibung automatisch, aktualisiert den Code und spiegelt die neu hinzugefügten Klassen, Attribute oder Methoden direkt in Ihrem visuellen Klassendiagramm wider.

  • Ergebnis:Wie unten zu sehen, hat die CashKlasse nun cashTendered, die CheckKlasse hat bankID und bankName, und die Kredit Klasse enthält Nummer und expDate. Der Code auf der linken Seite wurde aktualisiert, um mit der Darstellung auf der rechten Seite übereinzustimmen.

Von der KI von VPasCode generiertes UML-Klassendiagramm, das aktualisierte Klassen Cash, Check und Credit mit neuen Attributen und Methoden zeigt.

Abbildung 4: Das verfeinerte Diagramm. Die KI hat die Unterklassen erfolgreich mit relevanten Attributen und Methoden gefüllt und sowohl den Code als auch die visuelle Darstellung aktualisiert.


Fazit

Die Integration von KI in Diagram-as-Code-Tools wie VPasCode stellt einen erheblichen Fortschritt in der Produktivität für Softwarearchitekten und Entwickler dar. Durch Befolgung dieses einfachen Vier-Schritte-Prozesses können Sie ein skelettartiges Klassendiagramm in Sekundenschnelle in ein detailliertes Design-Dokument verwandeln.

Die Möglichkeit, zu sagen „Attribute zu den Kindern von Payment hinzufügen“ und den gleichzeitigen Update von Code und Diagramm zu beobachten, beseitigt die Reibung beim manuellen Syntax-Editing. Ob Sie ein komplexes Unternehmenssystem oder eine einfache Anwendung modellieren, die integrierte KI von VPasCode stellt sicher, dass sich Ihre Dokumentation so schnell entwickelt wie Ihre Ideen.

Bereit, es selbst auszuprobieren? Besuchen Sie VPasCode, um sofort damit zu beginnen, Ihren Text in professionelle Diagramme zu verwandeln.

Der Artikel ist auch in English, Español, Français, English, Bahasa Indonesia, Polski, Portuguese, Ру́сский, Việt Nam, 简体中文 and 繁體中文 verfügbar.