# Plan-Code-Verify Workflow (/de/docs/verdent-for-vscode/core-features/plan-code-verify-loop)

> Der Plan-Code-Verify-Workflow bietet präzise Kontrolle über Anforderungen, Umsetzung und Validierung durch mehrere Eingabemodalitäten.



### Was Sie lernen werden [#was-sie-lernen-werden]

* Was der Plan-Code-Verify-Workflow ist
* Multimodale Spezifikationsmethoden (natürliche Sprache, visuell, interaktiv)

***

## **Plan-Code-Verify**-Workflow [#plan-code-verify-workflow]

Integriert alle drei Phasen des Workflows von Verdent:

**Plan:** Klären Sie Anforderungen und entwerfen Sie Lösungen mit klaren, visuellen Logikdiagrammen und Planregeln. Drücken Sie Spezifikationen durch natürliche Sprache, UI-Mockups oder interaktive Demos aus.

**Code**:Überprüfen, refaktorisieren und verbessern Sie Ihren Code mühelos und liefern Sie jedes Mal klare Ergebnisse. Multimodale Eingaben stellen sicher, dass die Umsetzung genau den Anforderungen entspricht.

**Verify:** Erkennen Sie Probleme frühzeitig mit einem Verifier-Subagent und Browser-Werkzeugen für zuverlässige Ergebnisse.

**So funktioniert der Plan-Code-Verify-Workflow:**

<Steps>
  <Step title="Planregeln">
    * Wählen Sie integrierte Rollenvorlagen (Frontend, Test, Produktmanager)
    * Erstellen Sie benutzerdefinierte Planregeln, die zu Ihrem Denkstil und Ihren Arbeitsgewohnheiten passen
  </Step>

  <Step title="Planvorschau">
    * Klären Sie Struktur und Inhalt des Plans durch eine Planüberprüfung
    * Nachdem Sie sich während der Planüberprüfung mit der KI abgestimmt haben, wählen Sie „Generate Plan“, um den detaillierten Planinhalt zu erstellen
  </Step>

  <Step title="Plandesign">
    Detaillierte Spezifikation, einschließlich:

    * Systemarchitekturdiagramme
    * Komponentenstruktur und -beziehungen
    * Datenmodelle und API-Verträge
    * UI/UX-Spezifikationen mit visuellen Mockups
    * Begründung des Technologie-Stacks
  </Step>

  <Step title="Aufgabenaufschlüsselung">
    Hierarchische Liste mit Abhängigkeiten und Prioritäten zur Organisation des Umsetzungs-Workflows

    * Zeigt den Echtzeit-Fortschritt der Aufgaben an
    * Fasst den Abschlussstatus nach Fertigstellung zusammen
  </Step>

  <Step title="Diff-Zusammenfassungen">
    Codeänderungen überprüfen und Code-Reviewer-Subagent

    * Änderungslokalisierung – listet alle geänderten Dateien mit den Codeänderungen auf
    * Logikzusammenfassung – erklärt in natürlicher Sprache, was sich geändert hat und warum
    * Auswirkungsanalyse – hebt nachgelagerte Effekte auf Dokumentation, APIs und abhängigen Code hervor
  </Step>

  <Step title="Frühzeitig verifizieren">
    * Konfigurierbare automatisierte Verifizierung
    * Verifizierung mit Subagents und Browser-Werkzeugen
  </Step>
</Steps>

## Multimodale Spezifikation [#multimodale-spezifikation]

Unterstützt mehrere Möglichkeiten, Ihre Anforderungen auszudrücken:

<Tabs>
  <Tab title="Natürliche Sprache">
    Drücken Sie Anforderungen, Einschränkungen und Abnahmekriterien in natürlicher Sprache aus:

    * Umfassendes kontextuelles Verständnis technischer und geschäftlicher Anforderungen
    * Unterstützt komplexe, mehrschichtige Spezifikationen
    * Natürlicher Gesprächsfluss zur Definition von Anforderungen
  </Tab>

  <Tab title="Visuelle Anforderungen">
    Laden Sie UI-Mockups, Design-Screenshots oder Referenzimplementierungen hoch:

    * Pixelgenaue Umsetzung anhand visueller Spezifikationen
    * Unterstützt mehrere Bildformate für die Design-Kommunikation
    * Visueller Kontext für die UI/UX-Umsetzung
  </Tab>

  <Tab title="Interaktive Demos">
    Teilen Sie funktionierende Beispiele oder Prototypen:

    * Kommunizieren Sie Erwartungen an Verhalten und Nutzererlebnis
    * Demonstrieren Sie komplexe Interaktionen und Workflows
    * Live-Beispiele für eine klarere Kommunikation von Anforderungen
  </Tab>
</Tabs>

Dieser multimodale Ansatz stellt sicher, dass komplexe Anforderungen, insbesondere UI/UX-Spezifikationen, präzise und ohne Unklarheiten erfasst werden.

***

## Siehe auch [#siehe-auch]

<CardGroup cols="3">
  <Card title="Professional Plan" icon="diagram-project" href="/docs/verdent-for-vscode/core-features/professional-plan">
    Verwandelt Ideen in Umsetzungspläne
  </Card>

  <Card title="Code Diff" icon="code-compare" href="/docs/verdent-for-vscode/core-features/code-diff">
    Code-Review-Workflow auf Enterprise-Niveau
  </Card>
</CardGroup>
