# Flusso di lavoro Plan-Code-Verify (/it/docs/verdent-for-vscode/core-features/plan-code-verify-loop)

> Il flusso di lavoro Plan-Code-Verify offre un controllo preciso su requisiti, implementazione e validazione attraverso più modalità di input.



### Cosa imparerai [#cosa-imparerai]

* Cos'è il flusso di lavoro Plan-Code-Verify
* Metodi di specifica multimodali (linguaggio naturale, visivo, interattivo)

***

## Flusso di lavoro **Plan-Code-Verify** [#flusso-di-lavoro-plan-code-verify]

Integra tutte e tre le fasi del flusso di lavoro di Verdent:

**Plan:** chiarisci i requisiti e progetta le soluzioni con diagrammi logici chiari e visivi e regole di pianificazione. Esprimi le specifiche tramite linguaggio naturale, mockup dell'interfaccia o demo interattive.

**Code:** rivedi, rifattorizza e migliora il tuo codice con facilità, ottenendo risultati chiari ogni volta. Gli input multimodali garantiscono che l'implementazione rispetti esattamente i requisiti.

**Verify:** individua i problemi in anticipo con un sottoagente verificatore e strumenti del browser per risultati affidabili.

**Come funziona il flusso di lavoro Plan-Code-Verify:**

<Steps>
  <Step title="Regole di pianificazione">
    * Scegli tra i modelli di ruolo integrati (Frontend, Test, Product Manager)
    * Crea regole di pianificazione personalizzate che si adattano al tuo stile di pensiero e alle tue abitudini di lavoro
  </Step>

  <Step title="Anteprima del piano">
    * Chiarisci la struttura e il contenuto del piano tramite la revisione del piano
    * Dopo esserti allineato con l'AI durante la revisione del piano, seleziona "Generate Plan" per creare i contenuti dettagliati del piano
  </Step>

  <Step title="Progettazione del piano">
    Specifica dettagliata che include:

    * Diagrammi dell'architettura di sistema
    * Struttura dei componenti e relazioni
    * Modelli di dati e contratti di API
    * Specifiche UI/UX con mockup visivi
    * Giustificazione dello stack tecnologico
  </Step>

  <Step title="Suddivisione delle attività">
    Elenco gerarchico con dipendenze e priorità per organizzare il flusso di lavoro dell'implementazione

    * Visualizza l'avanzamento delle attività in tempo reale
    * Riepiloga il loro stato di completamento una volta terminate
  </Step>

  <Step title="Riepiloghi delle differenze">
    Rivedi le modifiche al codice e il sottoagente Code-reviewer

    * Localizzazione delle modifiche: elenca tutti i file modificati con le relative modifiche al codice
    * Riepilogo della logica: spiega cosa è cambiato e perché in linguaggio naturale
    * Analisi dell'impatto: evidenzia gli effetti a valle su documentazione, API e codice dipendente
  </Step>

  <Step title="Verifica in anticipo ">
    * Verifica automatizzata configurabile
    * Verifica con sottoagenti e strumenti del browser
  </Step>
</Steps>

## Specifica multimodale [#specifica-multimodale]

Supporta più modi per esprimere i tuoi requisiti:

<Tabs>
  <Tab title="Linguaggio naturale">
    Esprimi requisiti, vincoli e criteri di accettazione in linguaggio naturale:

    * Ricca comprensione contestuale dei requisiti tecnici e di business
    * Supporta specifiche complesse e multilivello
    * Flusso di conversazione naturale per la definizione dei requisiti
  </Tab>

  <Tab title="Requisiti visivi">
    Carica mockup dell'interfaccia, screenshot di design o implementazioni di riferimento:

    * Ricreazione pixel-perfect a partire dalle specifiche visive
    * Supporta più formati di immagine per la comunicazione del design
    * Contesto visivo per l'implementazione UI/UX
  </Tab>

  <Tab title="Demo interattive">
    Condividi esempi funzionanti o prototipi:

    * Comunica le aspettative sul comportamento e sull'esperienza utente
    * Dimostra interazioni e flussi di lavoro complessi
    * Esempi dal vivo per una comunicazione più chiara dei requisiti
  </Tab>
</Tabs>

Questo approccio multimodale garantisce che i requisiti complessi, in particolare le specifiche UI/UX, vengano catturati con precisione e senza ambiguità.

***

## Vedi anche [#vedi-anche]

<CardGroup cols="3">
  <Card title="Piano professionale" icon="diagram-project" href="/docs/verdent-for-vscode/core-features/professional-plan">
    Trasforma le idee in piani di implementazione
  </Card>

  <Card title="Differenze del codice" icon="code-compare" href="/docs/verdent-for-vscode/core-features/code-diff">
    Flusso di lavoro di revisione del codice di livello enterprise
  </Card>
</CardGroup>