Guida introduttiva a Google Antigravity

1. Introduzione

In questo codelab, imparerai a utilizzare Google Antigravity (denominato Antigravity per il resto del documento), una piattaforma di sviluppo agentica che trasforma l'IDE nell'era degli agenti.

A differenza degli assistenti di programmazione standard che completano automaticamente le righe, Antigravity fornisce un "centro di controllo" per la gestione di agenti autonomi in grado di pianificare, programmare e persino navigare sul web per aiutarti a creare.

Antigravity è progettata come piattaforma incentrata sugli agenti. Presuppone che l'AI non sia solo uno strumento per scrivere codice, ma un attore autonomo in grado di pianificare, eseguire, convalidare e ripetere attività di ingegneria complesse con un intervento umano minimo.

Cosa imparerai a fare

• Installazione e configurazione di Antigravity.
• Esplorare i concetti chiave di Antigravity come Agent Manager, Editor, Browser e altro ancora.
• Esplorare alcuni casi d'uso con Antigravity.

Che cosa ti serve

Al momento Antigravity è disponibile in anteprima per gli account Gmail personali. È dotato di una quota senza costi per l'utilizzo dei modelli di punta.

Antigravity deve essere installato localmente sul tuo sistema. Il prodotto è disponibile su Mac, Windows e distribuzioni Linux specifiche. Oltre alla tua macchina, avrai bisogno di:

• Browser web Chrome
• Un account Gmail (account Gmail personale).

Questo codelab è progettato per utenti e sviluppatori di tutti i livelli (inclusi i principianti).

Problemi relativi ai report

Man mano che procedi con il codelab e con Antigravity, potresti riscontrare problemi.

Per problemi relativi al codelab (errori di battitura, istruzioni errate), apri un bug con il pulsante Report a mistake nell'angolo in basso a sinistra di questo codelab:

Per bug o richieste di funzionalità relativi ad Antigravity, segnala il problema all'interno di Antigravity. Puoi farlo in Agent Manager con il link Provide Feedback nell'angolo in basso a sinistra:

Puoi anche accedere all'editor tramite il link Report Issue sotto l'icona del tuo profilo:

2. Installazione

Inizieremo con l'installazione di Antigravity. Al momento il prodotto è disponibile in anteprima e puoi utilizzare il tuo account Gmail personale per iniziare a utilizzarlo.

Vai alla pagina Download e fai clic sulla versione del sistema operativo appropriata per il tuo caso. Avvia il programma di installazione dell'applicazione e installala sul tuo computer. Una volta completata l'installazione, avvia l'applicazione Antigravity. Dovresti visualizzare una schermata simile alla seguente:

Procedi facendo clic su Next ogni volta. Di seguito sono descritti i passaggi chiave:

• Scegli il flusso di configurazione:viene visualizzata l'opzione per importare le impostazioni esistenti di VS Code o Cursor. Inizieremo da zero.
• Scegliere un tipo di tema dell'editor: noi useremo il tema scuro, ma la scelta è interamente tua.
• Come vuoi usare l'agente Antigravity?

Vediamo questo aspetto in modo più dettagliato. Ricorda che le impostazioni possono essere modificate in qualsiasi momento tramite le impostazioni utente di Antigravity (Cmd + ,).

Prima di esaminare le opzioni, diamo un'occhiata ad alcune proprietà specifiche (che vedi a destra della finestra di dialogo).

Norme di esecuzione del terminale

Si tratta di dare all'agente la possibilità di eseguire comandi (applicazioni/strumenti) nel terminale:

• Procedi sempre:esegui sempre automaticamente i comandi del terminale (ad eccezione di quelli presenti in un elenco di negazione configurabile).
• Richiedi revisione:richiedi la revisione e l'approvazione dell'utente prima di eseguire i comandi del terminale.

Norme relative alle recensioni

Mentre l'agente svolge il suo compito, crea vari artefatti (piano delle attività, piano di implementazione e così via). Le norme di revisione sono impostate in modo da poter determinare chi decide se è necessaria una revisione. Se vuoi sempre rivederlo o lasciare che sia l'agente a decidere. Di conseguenza, anche qui ci sono tre opzioni.

• Procedi sempre:l'agente non chiede mai una revisione.
• L'agente decide:l'agente deciderà quando chiedere la revisione.
• Richiedi recensione:l'agente chiede sempre una recensione.

Norme di esecuzione di JavaScript

Se l'opzione è attivata, l'agente può utilizzare gli strumenti del browser per aprire URL, leggere pagine web e interagire con i contenuti del browser. Questa norma consente di stabilire come viene eseguito JavaScript nel browser.

• Procedi sempre:l'agente non si fermerà per chiedere l'autorizzazione a eseguire JavaScript nel browser. In questo modo, l'agente ha la massima autonomia per eseguire azioni e convalide complesse nel browser, ma anche la massima esposizione agli exploit di sicurezza.
• Richiedi revisione:l'agente si fermerà sempre per chiedere l'autorizzazione a eseguire il codice JavaScript nel browser.
• Disattivato:l'agente non eseguirà mai codice JavaScript nel browser.

Ora che abbiamo compreso le diverse norme, le quattro opzioni a sinistra non sono altro che impostazioni specifiche per le norme di esecuzione, revisione e JavaScript del terminale per tre di queste e una quarta opzione disponibile in cui possiamo controllarle in modo completamente personalizzato. Queste quattro opzioni sono disponibili per consentirci di scegliere il livello di autonomia che vuoi concedere all'agente per eseguire i comandi nel terminale e far esaminare gli artefatti prima di procedere con l'attività.

Queste quattro opzioni sono:

• Modalità sicura: la modalità sicura fornisce controlli di sicurezza avanzati per l'agente, consentendoti di limitarne l'accesso a risorse esterne e operazioni sensibili. Quando la modalità sicura è attivata, vengono applicate diverse misure di sicurezza per proteggere l'ambiente.
• Sviluppo basato sulla revisione (consigliato): l'agente chiederà spesso una revisione.
• Sviluppo basato sull'agente: l'agente non chiederà mai una revisione.
• Configurazione personalizzata

L'opzione Sviluppo basato sulla revisione è un buon compromesso ed è quella consigliata, in quanto consente all'agente di prendere una decisione e tornare dall'utente per l'approvazione.

La pagina successiva è Configura l'editor, dove puoi scegliere le tue preferenze per quanto riguarda:

• Keybindings: configura le scorciatoie da tastiera.
• Estensioni: installa le estensioni di lingua più diffuse e altre estensioni consigliate.
• Riga di comando: installa lo strumento a riga di comando per aprire Antigravity con agy.

Ora puoi accedere a Google. Come accennato in precedenza, Antigravity è disponibile in modalità di anteprima e senza costi se hai un account Gmail personale. Accedi ora con il tuo account. Si aprirà il browser, che ti consentirà di accedere. Se l'autenticazione ha esito positivo, viene visualizzato un messaggio simile a quello riportato di seguito e si torna all'applicazione Antigravity. Segui il flusso.

Infine, i Termini d'uso. Puoi decidere se attivare o meno l'opzione e poi fare clic su Next.

Ti troverai di fronte al momento della verità, in cui Antigravity ti aspetterà per collaborare con te.

3. Agent Manager

Siamo pronti per iniziare.

Antigravity si basa sul codice open source di Visual Studio Code (VS Code), ma modifica radicalmente l'esperienza utente per dare la priorità alla gestione degli agenti rispetto alla modifica del testo. L'interfaccia è suddivisa in due finestre principali distinte: Editor e Agent Manager. Questa separazione delle responsabilità rispecchia la distinzione tra il contributo individuale e la gestione dell'ingegneria.

Agent Manager: Mission Control

All'avvio di Antigravity, l'utente non visualizza in genere una struttura ad albero dei file, ma Agent Manager, come mostrato di seguito:

Questa interfaccia funge da dashboard Mission Control. È progettato per l'orchestrazione di alto livello, consentendo agli sviluppatori di generare, monitorare e interagire con più agenti che operano in modo asincrono in diversi spazi di lavoro o attività.

In questa visualizzazione, lo sviluppatore funge da architetto. Definiscono obiettivi di alto livello, ad esempio:

• Refactoring del modulo di autenticazione
• Aggiorna l'albero delle dipendenze
• Genera una suite di test per l'API Billing

Come indicato nel diagramma precedente, ognuna di queste richieste genera un'istanza dell'agente dedicata. L'interfaccia utente fornisce una visualizzazione di questi flussi di lavoro paralleli, mostrando lo stato di ogni agente, gli artefatti che ha prodotto (piani, risultati, differenze) e le richieste in attesa di approvazione umana.

Questa architettura risolve un limite fondamentale dei precedenti IDE, che offrivano un'esperienza più simile a quella di un chatbot, lineare e sincrona. In un'interfaccia di chat tradizionale, lo sviluppatore deve attendere che l'AI finisca di generare il codice prima di porre la domanda successiva. Nella visualizzazione Manager di Antigravity, uno sviluppatore può inviare cinque agenti diversi a lavorare su cinque bug diversi contemporaneamente, moltiplicando di fatto il throughput.

Se fai clic su Next sopra, puoi aprire uno spazio di lavoro.

Pensa allo spazio di lavoro come lo conoscevi da VS Code e il gioco è fatto. Per aprire una cartella locale, fai clic sul pulsante e seleziona una cartella da cui iniziare. Nel mio caso, avevo una cartella nella mia home directory denominata my-agy-projects e l'ho selezionata. Puoi utilizzare una cartella completamente diversa. Tieni presente che puoi saltare completamente questo passaggio, se vuoi, e aprire uno spazio di lavoro in un secondo momento.

Una volta completato questo passaggio, si aprirà la finestra Agent Manager, mostrata di seguito:

Noterai che l'applicazione è immediatamente impostata per avviare una nuova conversazione nella cartella dello spazio di lavoro (my-agy-projects) selezionata. Puoi utilizzare le tue conoscenze esistenti sull'utilizzo di altre applicazioni AI (Cursor, Gemini CLI) e utilizzare @ e altri modi per includere ulteriore contesto durante la richiesta.

Controlla i menu a discesa Planning e Model Selection. Il menu a discesa Selezione modello ti consente di scegliere uno dei modelli disponibili al momento da utilizzare per l'agente. L'elenco è riportato di seguito:

Allo stesso modo, l'agente sarà in modalità Planning predefinita. Ma possiamo anche scegliere la modalità Fast.

Vediamo cosa dice la documentazione in merito:

• Planning: un agente può pianificare prima di eseguire le attività. Utilizzalo per ricerche approfondite, attività complesse o lavoro collaborativo. In questa modalità, l'agente organizza il suo lavoro in gruppi di attività, produce artefatti ed esegue altri passaggi per ricercare, analizzare e pianificare a fondo il suo lavoro per una qualità ottimale. Qui vedrai molti più output.
• Fast: un agente eseguirà le attività direttamente. Utilizzalo per attività semplici che possono essere completate più rapidamente, come rinominare le variabili, avviare alcuni comandi bash o altre attività più piccole e localizzate. Questa opzione è utile quando la velocità è un fattore importante e l'attività è abbastanza semplice da non preoccuparsi di una qualità peggiore.

Se hai familiarità con il budget di pensiero e termini simili negli agenti, considera questa funzionalità come la possibilità di controllare il pensiero dell'agente, con un impatto diretto sul budget di pensiero. Per ora utilizzeremo le impostazioni predefinite, ma ricorda che al momento del lancio, la disponibilità del modello Gemini 3 Pro è limitata a tutti, quindi riceverai messaggi appropriati che indicano se hai esaurito le quote senza costi per l'utilizzo di Gemini 3.

Dedichiamo un po' di tempo a esaminare la finestra di Agent Manager e a capire alcune cose, in modo da avere chiarezza sugli elementi di base, su come navigare in Antigravity e altro ancora. Di seguito viene mostrata la finestra di Agent Manager:

Fai riferimento al diagramma sopra con i numeri:

1. Inbox: consideralo un modo per tenere traccia di tutte le tue conversazioni in un unico posto. Quando invii gli agenti alle loro attività, queste vengono visualizzate nella Posta in arrivo e puoi fare clic sulla Posta in arrivo per visualizzare un elenco di tutte le conversazioni attive. Se tocchi una conversazione, visualizzerai tutti i messaggi scambiati, lo stato delle attività, ciò che ha prodotto l'agente o se è in attesa di una tua approvazione per le attività. È un ottimo modo per tornare in un secondo momento a un'attività precedente a cui stavi lavorando. Una funzionalità molto utile.
2. Start Conversation: fai clic qui per iniziare una nuova conversazione. Verrà visualizzato direttamente il campo di input in cui è scritto Ask anything.
3. Workspaces: Abbiamo parlato degli spazi di lavoro e del fatto che puoi lavorare in qualsiasi spazio di lavoro tu voglia. Puoi aggiungere altri spazi di lavoro in qualsiasi momento e selezionarne uno quando avvii la conversazione.
4. Playground: questo è un ottimo modo per avviare una conversazione con l'agente e poi, se vuoi, convertirla in uno spazio di lavoro, dove hai un controllo più rigoroso sui file e così via. Consideralo come un'area di lavoro.
5. Editor View: finora ci troviamo nella visualizzazione Gestore agenti. Se vuoi, puoi passare in qualsiasi momento alla visualizzazione Editor. Verranno visualizzati la cartella dell'area di lavoro e tutti i file generati. Puoi modificare direttamente i file o fornire indicazioni e comandi in linea nell'editor, in modo che l'agente possa fare qualcosa o apportare modifiche in base ai tuoi consigli/istruzioni modificati. Tratteremo in dettaglio la visualizzazione Editor in una sezione successiva.
6. Browser: Infine, arriviamo a uno dei fattori di differenziazione più evidenti che rendono Antigravity molto potente, ovvero la sua stretta integrazione con il browser Chrome. Iniziamo a configurare il browser nella sezione successiva.

4. Browser Antigravity

Come indicato nella documentazione, quando l'agente vuole interagire con il browser, richiama un subagente del browser per gestire l'attività in questione. Il subagente del browser esegue un modello specializzato per operare sulle pagine aperte nel browser gestito da Antigravity, che è diverso dal modello selezionato per l'agente principale.

Questo subagente ha accesso a una serie di strumenti necessari per controllare il browser, tra cui fare clic, scorrere, digitare, leggere i log della console e altro ancora. Può anche leggere le pagine aperte tramite l'acquisizione DOM, gli screenshot o l'analisi markdown, nonché registrare video.

Ciò significa che dobbiamo avviare e installare l'estensione del browser Antigravity. Per farlo, avviamo una conversazione nel Playground e seguiamo i passaggi.

Seleziona Playground e assegna all'agente la seguente attività go to antigravity.google, come mostrato di seguito:

Invia l'attività. Vedrai l'agente analizzare l'attività e potrai esaminare il processo di pensiero. A un certo punto, la procedura andrà a buon fine e verrà indicato che è necessario configurare l'agente del browser come mostrato di seguito. Fai clic su Setup.

Verrà visualizzato il browser e un messaggio per installare l'estensione, come mostrato di seguito:

Continua e verrà visualizzata l'estensione di Chrome che potrai installare.

Una volta installata l'estensione, Antigravity Agent inizierà a funzionare e ti chiederà l'autorizzazione per svolgere la sua attività. Dovresti vedere alcune attività nella finestra del browser che è stata aperta:

Torna alla visualizzazione Gestore agenti e dovresti vedere quanto segue:

Questo è esattamente ciò che ci aspettavamo che accadesse, dato che abbiamo chiesto all'agente di visitare il sito web antigravity.google. Concedi l'autorizzazione e vedrai che il sito web è stato raggiunto in modo sicuro, come mostrato di seguito:

5. Artefatti

Antigravity crea artefatti mentre pianifica ed esegue il suo lavoro per comunicare il suo lavoro e ricevere feedback dall'utente umano. Si tratta di file Markdown avanzati, diagrammi dell'architettura, immagini, registrazioni del browser, differenze di codice e così via.

Gli artefatti colmano il "divario di fiducia". Quando un agente afferma "Ho corretto il bug", lo sviluppatore doveva leggere il codice per verificare. In Antigravity, l'agente produce un artefatto per dimostrarlo.

Di seguito sono riportati gli artefatti principali prodotti da Antigravity:

• Task Lists: prima di scrivere il codice, l'agente genera un piano strutturato. In genere non è necessario modificare questo piano, ma puoi esaminarlo e, in alcuni casi, aggiungere un commento per modificarlo, se necessario.
• Implementation Plan: viene utilizzato per progettare le modifiche all'interno del codebase per svolgere un'attività. Questi piani contengono dettagli tecnici sulle revisioni necessarie e devono essere esaminati dall'utente, a meno che i criteri di revisione degli artefatti non siano impostati su "Procedi sempre".
• Walkthrough: viene creato una volta che l'agente ha completato l'implementazione dell'attività, come riepilogo delle modifiche e di come testarle.
• Code diffs: anche se tecnicamente non è un artefatto, Antigravity produce anche differenze di codice che puoi esaminare e commentare.
• Screenshots: l'agente acquisisce lo stato della UI prima e dopo una modifica.
• Browser Recordings: per interazioni dinamiche (ad es. "Fai clic sul pulsante di accesso, attendi il caricamento della rotellina e verifica che la dashboard venga caricata"), l'agente registra un video della sessione. Lo sviluppatore può guardare questo video per verificare che il requisito funzionale sia soddisfatto senza eseguire l'app.

Gli artefatti vengono prodotti e visualizzati nelle visualizzazioni di Agent Manager ed Editor.

Nella visualizzazione Editor, nell'angolo in basso a destra, puoi fare clic su Artifacts:

Nella visualizzazione Gestione agenti, in alto a destra, accanto a Review changes, dovresti vedere un pulsante per attivare/disattivare gli artefatti. Se l'opzione è attiva, puoi visualizzare l'elenco degli artefatti generati:

Dovresti visualizzare la visualizzazione Artefatti come mostrato di seguito. Nel nostro caso, abbiamo chiesto all'agente di visitare la pagina antigravity.google e quindi ha acquisito lo screenshot e creato un video della stessa:

Puoi visualizzare le differenze di codice in Review Changes nella visualizzazione Editor:

Gli sviluppatori possono interagire con questi artefatti e differenze di codice utilizzando "commenti in stile Documenti Google". Puoi selezionare un'azione o un'attività specifica, fornire un comando nel modo in cui vuoi che venga eseguito e poi inviarlo all'agente. L'agente inserirà questo feedback e lo utilizzerà per migliorare il proprio lavoro. Prendi in considerazione l'utilizzo di Documenti Google interattivi, in cui fornisci un feedback all'autore e l'autore lo rielabora.

6. Tornare alla Posta in arrivo

Se hai avviato alcune conversazioni con gli agenti, ora dovresti dare un'occhiata al tuo Inbox nella finestra Agent Manager. Verranno visualizzate tutte le conversazioni. Fai clic su una delle conversazioni per visualizzarne la cronologia, gli artefatti prodotti e altro ancora. Nel nostro caso, dopo aver eseguito la prima conversazione, la Posta in arrivo mostra la conversazione elencata, come mostrato di seguito:

Se fai clic sulla conversazione, vengono visualizzati i dettagli:

Puoi anche continuare la conversazione da qui.

7. Editor

L'editor mantiene la familiarità di VS Code, garantendo il rispetto della memoria muscolare degli sviluppatori esperti. Include l'esploratore di file standard, l'evidenziazione della sintassi e l'ecosistema di estensioni.

Puoi fare clic sul pulsante Open Editor in alto a destra in Agent Manager per passare all'editor.

Configurazione ed estensioni

In una configurazione tipica, sono visibili l'editor, il terminale e l'agente:

In caso contrario, puoi attivare/disattivare i pannelli del terminale e dell'agente nel seguente modo:

• Per attivare/disattivare il riquadro del terminale, utilizza la scorciatoia Ctrl + `.
• Per attivare/disattivare il riquadro dell'agente, utilizza la scorciatoia Cmd + L.

Inoltre, Antigravity può installare alcune estensioni durante la configurazione, ma a seconda del linguaggio di programmazione che utilizzi, probabilmente devi installare altre estensioni. Ad esempio, per lo sviluppo in Python, queste sono le estensioni che potresti scegliere di installare:

Editor

Completamento automatico

Mentre digiti il codice nell'editor, si attiva un completamento automatico intelligente che puoi semplicemente inserire con il tasto Tab:

Scheda da importare

Viene visualizzato il suggerimento Scheda da importare per aggiungere le dipendenze mancanti:

Premi Tab per saltare

Ricevi suggerimenti per passare da una scheda all'altra per spostare il cursore nella posizione logica successiva del codice:

Comandi

Puoi attivare i comandi con Cmd + I nell'editor o nel terminale per i completamenti in linea utilizzando il linguaggio naturale.

Nell'editor, puoi chiedere un metodo per calcolare i numeri di Fibonacci e poi accettarlo o rifiutarlo:

Nel terminale, puoi ricevere suggerimenti per i comandi del terminale:

Riquadro laterale dell'agente

Nell'editor, puoi attivare/disattivare il riquadro laterale dell'agente in diversi modi.

Apertura manuale

Puoi attivare/disattivare manualmente il pannello dell'agente a destra con la scorciatoia Cmd + L.

Puoi iniziare a porre domande, utilizzare @ per includere più contesto, ad esempio file, directory, server MCP o utilizzare / per fare riferimento a un flusso di lavoro (un prompt salvato):

Puoi anche scegliere tra due modalità di conversazione: Fast o Planning :

Fast è consigliato per le attività rapide, mentre Planning è consigliato per le attività più complesse in cui l'agente crea un piano che puoi approvare.

Puoi anche scegliere modelli diversi per la conversazione:

Spiega e correggi

Un altro modo per attivare l'agente è passare il mouse sopra un problema e selezionare Explain and fix:

Inviare i problemi all'agente

Puoi anche andare alla sezione Problems e selezionare Send all to Agent per chiedere all'agente di provare a risolvere questi problemi:

Inviare l'output del terminale all'agente

Puoi anche selezionare una parte dell'output del terminale e inviarla all'agente con Cmd + L:

Passare da Editor ad Agent Manager

In qualsiasi momento, puoi passare dalla modalità editor alla modalità completa di gestione degli agenti tramite il pulsante Open Agent Manager in alto a destra quando ti trovi in modalità editor e viceversa facendo clic sul pulsante Open Editor in alto a destra quando ti trovi in modalità di gestione degli agenti.

In alternativa, puoi utilizzare la scorciatoia da tastiera Cmd + E per passare da una modalità all'altra.

8. Fornisci feedback

Il cuore di Antigravity è la sua capacità di raccogliere facilmente il tuo feedback in ogni fase dell'esperienza. Mentre l'agente lavora a un'attività, crea diversi artefatti:

• Un piano di implementazione e un elenco di attività (prima della programmazione)
• Differenze di codice (durante la generazione del codice)
• Una procedura dettagliata per verificare i risultati (dopo la codifica)

Questi artefatti sono un modo per Antigravity di comunicare i suoi piani e i suoi progressi. Ancora più importante, sono anche un modo per fornire feedback all'agente nello stile dei commenti di Documenti Google. Ciò è molto utile per indirizzare efficacemente l'agente nella direzione che preferisci.

Proviamo a creare una semplice applicazione di elenco di cose da fare e vediamo come possiamo fornire feedback ad Antigravity durante il percorso.

Modalità di pianificazione

Innanzitutto, devi assicurarti che Antigravity sia in modalità Planning (anziché Fast).Puoi selezionarla nella chat del riquadro laterale dell'agente. In questo modo, Antigravity crea un piano di implementazione e un elenco di attività prima di passare al codice. Poi, prova un prompt, ad esempio: Create a todo list web app using Python. In questo modo, l'agente inizierà a pianificare e produrre un piano di implementazione.

Piano di implementazione

Un piano di implementazione è una panoramica di ciò che Antigravity intende fare, dello stack tecnologico che utilizzerà e una descrizione di alto livello delle modifiche proposte.

Implementation Plan - Python Todo App
Goal
Create a simple, functional, and aesthetically pleasing Todo List web application using Python (Flask).

Tech Stack
Backend: Python with Flask
Frontend: HTML5, CSS3 (Vanilla), Jinja2 templates
...

Questo è anche il primo posto in cui puoi fornire un feedback. Nel nostro caso, l'agente vuole utilizzare Flask come framework web Python. Possiamo aggiungere un commento al piano di implementazione per utilizzare FastAPI. Dopo aver aggiunto il commento, invialo o chiedi ad Antigravity di Proceed con il piano di implementazione aggiornato.

Elenco attività

Dopo l'aggiornamento del piano di implementazione, Antigravity crea un elenco di attività. Questo è un elenco concreto di passaggi che Antigravity seguirà per creare e verificare l'app.

Task Plan
 Create requirements.txt
 Create directory structure (static/css, templates)
 Create static/css/style.css
 Create templates/index.html
 Create main.py with FastAPI setup and Database logic
 Verify application

Questo è il secondo punto in cui puoi fornire un feedback.

Ad esempio, nel nostro caso d'uso, puoi aggiungere istruzioni di verifica più dettagliate aggiungendo il seguente commento: Verify application by adding, editing, and deleting a todo item and taking a screenshot.

Ecco alcuni suggerimenti per lavorare sui feedback:

1. Ogni volta che aggiungi un commento ai piani o alle attività, assicurati di inviarlo. Questo è ciò che attiva l'aggiornamento dei piani di Antigravity.
2. A volte, Antigravity passa alla codifica diretta dopo aver creato un piano di implementazione e un elenco di attività senza attendere la tua conferma. In questi casi, puoi comunque commentare i piani/le attività e inviarli di nuovo. Il codice e la procedura dettagliata verranno aggiornati in un secondo momento. Puoi anche interrompere l'attività di programmazione, aggiungere commenti ai piani/alle attività e riprovare.

Modifiche al codice

A questo punto, Antigravity genererà del codice in nuovi file. Puoi Accept all o Reject all queste modifiche nel riquadro laterale della chat dell'agente senza esaminare i dettagli.

Puoi anche fare clic su Review changes per visualizzare i dettagli delle modifiche e aggiungere commenti dettagliati sul codice. Ad esempio, possiamo aggiungere il seguente commento in main.py: Add basic comments to all methods

È un ottimo modo per eseguire l'iterazione del codice con Antigravity.

Procedura dettagliata

Una volta terminata la codifica, Antigravity avvia il server e apre un browser per verificare l'app. Esegue alcuni test manuali, come l'aggiunta e l'aggiornamento delle attività, il tutto grazie all'estensione del browser Antigravity. Alla fine, crea un file di procedura dettagliata per riepilogare le operazioni eseguite per verificare l'app. Questo include uno screenshot o un flusso di verifica con una registrazione del browser.

Puoi anche commentare lo screenshot o la registrazione del browser nella procedura dettagliata. Ad esempio, possiamo aggiungere un commento Change the blue theme to orange theme e inviarlo. Dopo l'invio del commento, Antigravity apporta le modifiche, verifica i risultati e aggiorna la procedura dettagliata

Annulla modifiche

Infine, dopo ogni passaggio, se non sei soddisfatto della modifica, puoi annullarla dalla chat. Basta scegliere ↩️ Undo changes up to this point nella chat.

9. Regole e workflow

Antigravity offre alcune opzioni di personalizzazione: Regole e Flussi di lavoro.

Fai clic su ... nell'angolo in alto a destra e scegli Customizations. Verranno visualizzati Rules e Workflows:

Le regole aiutano a guidare il comportamento dell'agente. Si tratta di linee guida che puoi fornire per assicurarti che l'agente le segua durante la generazione di codice e test. Ad esempio, potresti volere che l'agente segua un determinato stile di codice o che documenti sempre i metodi. Puoi aggiungerle come regole e l'agente le prenderà in considerazione.

I workflow sono prompt salvati che puoi attivare on demand con / mentre interagisci con l'agente. Guidano anche il comportamento dell'agente, ma vengono attivate dall'utente su richiesta.

Un buon paragone è che le Regole sono più simili alle istruzioni di sistema, mentre i workflow sono più simili a prompt salvati che puoi scegliere su richiesta.

Sia le regole che i flussi di lavoro possono essere applicati a livello globale o per spazio di lavoro e salvati nelle seguenti posizioni:

• Regola globale: ~/.gemini/GEMINI.md
• Flusso di lavoro globale: ~/.gemini/antigravity/global_workflows/global-workflow.md
• Regole del workspace: your-workspace/.agent/rules/
• Workspace Workflows: your-workspace/.agent/workflows/

Aggiungiamo alcune regole e flussi di lavoro nell'area di lavoro.

Aggiungi una regola

Innanzitutto, aggiungiamo una regola di stile del codice. Vai a Rules e seleziona il pulsante +Workspace. Assegna un nome, ad esempio code-style-guide, con le seguenti regole di stile del codice:

* Make sure all the code is styled with PEP 8 style guide
* Make sure all the code is properly commented

In secondo luogo, aggiungiamo un'altra regola per assicurarci che il codice venga generato in modo modulare con esempi in una regola code-generation-guide:

* The main method in main.py is the entry point to showcase functionality.
* Do not generate code in the main method. Instead generate distinct functionality in a new file (eg. feature_x.py)
* Then, generate example code to show the new functionality in a new method in main.py (eg. example_feature_x) and simply call that method from the main method.

Le due regole vengono salvate e sono pronte:

Aggiungere un workflow

Definiamo anche un flusso di lavoro per generare test delle unità. In questo modo, potremo attivare i test delle unità una volta che il codice ci soddisfa (anziché farli generare continuamente dall'agente).

Vai a Workflows e seleziona il pulsante +Workspace. Assegna un nome, ad esempio generate-unit-tests, con quanto segue:

* Generate unit tests for each file and each method
* Make sure the unit tests are named similar to files but with test_ prefix

Anche il workflow è pronto:

Prova

Vediamo ora le regole e i flussi di lavoro in azione. Crea un file main.py scheletro nel tuo spazio di lavoro:

def main():
    pass

if __name__ == "__main__":
    main()

Ora vai alla finestra della chat con l'agente e chiedi: Implement binary search and bubble sort.

Dopo un minuto o due, dovresti ricevere tre file nello spazio di lavoro: main.py, bubble_sort.py, binary_search.py. Noterai anche che tutte le regole sono implementate: il file principale non è ingombrante e contiene il codice di esempio, ogni funzionalità è implementata nel proprio file, tutto il codice è documentato e in buono stile:

from binary_search import binary_search, binary_search_recursive
from bubble_sort import bubble_sort, bubble_sort_descending


def example_binary_search():
    """
    Demonstrate binary search algorithm with various test cases.
    """
    ...

def example_bubble_sort():
    """
    Demonstrate bubble sort algorithm with various test cases.
    """
    ...

def main():
    """
    Main entry point to showcase functionality.
    """
    example_binary_search()
    example_bubble_sort()
    print("\n" + "=" * 60)


if __name__ == "__main__":
    main()

Ora che siamo soddisfatti del codice, vediamo se possiamo attivare il flusso di lavoro per la generazione del test delle unità.

Vai alla chat e inizia a digitare /generate. Antigravity conosce già il nostro flusso di lavoro:

Seleziona generate-unit-tests e inserisci. Dopo alcuni secondi, nel tuo spazio di lavoro verranno visualizzati nuovi file: test_binary_search.py, test_bubble_sort.py con una serie di test già implementati.

Bene!

10. Fissare l'agente

Concedere a un agente AI l'accesso al terminale e al browser è un'arma a doppio taglio. Consente il debug e il deployment autonomi, ma apre anche vettori per l'iniezione di prompt e l'esfiltrazione di dati.

Antigravity risolve questo problema tramite un sistema di autorizzazioni granulare basato su policy di esecuzione automatica dei comandi del terminale, elenchi consentiti ed elenchi bloccati.

Quando configuri Antigravity per la prima volta o tramite il menu delle impostazioni, devi selezionare un criterio Terminal Command Auto Execution. Questa impostazione determina l'autonomia dell'agente in merito ai comandi della shell.

Per visualizzare le impostazioni attuali, vai su Antigravity — Settings, poi su Advanced Settings. Dovresti visualizzare la sezione Terminal per le impostazioni dell'agente. Tieni presente questa tabella se vuoi modificare questa impostazione:

Modalità Norme	Descrizione
Off	L'agente non esegue mai automaticamente i comandi del terminale, a meno che non sia esplicitamente consentito.
Auto	L'agente decide se eseguire l'azione in base a modelli di sicurezza interni. Chiede l'autorizzazione per i comandi rischiosi.
Turbo	L'agente esegue sempre automaticamente i comandi, a meno che non venga negato esplicitamente.

Configurare la lista consentita

L'elenco consentito viene utilizzato principalmente con il criterio Off. Rappresenta un modello di sicurezza positivo, il che significa che tutto è vietato a meno che non sia espressamente consentito. Questa è la configurazione più sicura.

Configurazione passo passo

1. Imposta l'opzione Esecuzione automatica comandi terminale su Off.
2. Aggiungi il seguente comando in Comandi del terminale consentiti facendo clic sul pulsante Aggiungi accanto : ls -al . Se vuoi, puoi aggiungere anche altri comandi del terminale.

Test della lista consentita

• Chiedi all'agente: List the files in this directory.
• L'agente viene eseguito automaticamente ls.
• Chiedi all'agente: Delete the <some file>
• L'agente tenterà di eseguire rm <filepath>, ma Antigravity lo bloccherà e forzerà una revisione dell'utente perché rm non è presente nella lista consentita. Prima di eseguire il comando, Antigravity dovrebbe chiederti l'autorizzazione.

Nota: potrebbe essere necessario riavviare Antigravity affinché la lista consentita abbia effetto.

Configurazione dell'elenco valori non consentiti

L'elenco di negazione è la salvaguardia per la norma Turbo (e a volte Automatica). Rappresenta un modello di sicurezza negativo, il che significa che tutto è consentito, a meno che non sia espressamente vietato. Ciò si basa sulla previsione da parte dello sviluppatore di ogni possibile pericolo, il che è rischioso, ma offre la massima velocità.

Configurazione passo passo

1. Imposta l'impostazione Esecuzione automatica comandi terminale su Turbo.
2. Aggiungi i seguenti comandi in Comandi terminale della lista bloccata facendo clic sul pulsante Aggiungi accanto.
3. rm
4. rmdir
5. sudo
6. curl
7. wget

Test dell'elenco valori non consentiti

• Chiedi all'agente: Check the version of python.
• L'agente viene eseguito automaticamente python --version.
• Chiedi all'agente: Download www.google.com home page.
• L'agente tenta di curl. Antigravity rileva curl nella denylist e blocca l'esecuzione, richiedendo l'approvazione manuale.

Nota:potrebbe essere necessario riavviare Antigravity affinché la lista di blocco abbia effetto.

Sicurezza del browser

La capacità di Antigravity di navigare sul web è un superpotere, ma anche una vulnerabilità. Un agente che visita un sito di documentazione compromesso potrebbe imbattersi in un attacco di prompt injection.

Per evitare questo problema, puoi implementare una lista consentita di URL del browser per l'agente browser.

Per visualizzare le impostazioni attuali, vai a Antigravity — Settings e poi a Advanced Settings. Dovresti visualizzare la sezione Lista consentita degli URL del browser per le impostazioni del browser, come mostrato di seguito:

Fai clic su Apri file lista consentita per aprire il file nella cartella HOME/.gemini/antigravity/browserAllowlist.txt.. Qui puoi assicurarti che vengano inseriti solo domini attendibili.

11. Casi d'uso

Ora che abbiamo una conoscenza di base del prodotto, vediamo alcuni casi d'uso per vederlo in azione. Tieni presente che Antigravity è una piattaforma che dà la priorità agli agenti. Ciò significa che nella maggior parte dei casi, ci limitiamo a dare un'istruzione all'agente, che poi svolge il suo compito in autonomia, chiede le autorizzazioni se necessario, produce gli artefatti e ci avvisa quando il compito è terminato. Di conseguenza, non possiamo produrre ogni singolo output della conversazione dell'agente in ciascuno dei seguenti casi d'uso. Ti forniremo le istruzioni e alcuni screenshot necessari dei risultati previsti, ma i tuoi risultati potrebbero essere leggermente diversi.

I casi d'uso che tratteremo vanno dall'automazione di alcune attività con siti esterni alla generazione e alla verifica di casi di test unitari per un progetto, fino allo sviluppo completo di un sito web. Andiamo.

Approfondimenti delle notizie

Si tratta di un caso d'uso semplice, ma può essere la base per utilizzare il browser web per visitare siti web, estrarre informazioni, eseguire alcune azioni e quindi restituire i dati all'utente.

In questo caso, visiteremo il sito di Google News ed estrarremo alcune informazioni. Tuttavia, puoi sperimentare facilmente con un sito a tua scelta e vedere come va.

Assicurati di trovarti in Agent Manager e di aver selezionato Playground, come mostrato di seguito:

Poi, dai la seguente istruzione:

Verrà avviato il processo dell'agente, che determinerà la necessità di avviare il browser e così via. Presta molta attenzione al processo di pensiero e osserva come l'agente svolge il suo lavoro. Se tutto va bene, dovrebbe avviarsi il browser Antigravity e visitare il sito come mostrato di seguito. Il bordo blu attorno al sito indica che l'agente ora controlla il browser e naviga nel sito per ottenere le informazioni.

Al termine dell'operazione, dovresti visualizzare anche la generazione degli artefatti, come mostrato di seguito:

Di seguito è riportato un esempio di esecuzione da parte dell'agente:

A sinistra, puoi notare la sezione Procedimento, in cui puoi scorrere i punti e visualizzare la riproduzione e altri dati.

Cose da provare

• Una volta compreso questo, scegli un sito web disponibile da cui l'agente deve estrarre/riassumere alcuni dati. Prendi in considerazione un sito web che sai che ha dashboard e grafici e chiedi di scegliere alcuni valori.
• Prova il seguente prompt: Visit https://docs.cloud.google.com/release-notes and get me a summary of the release notes, categorized by product.

Genera un sito web dinamico con Python + Flask

Passiamo ora alla generazione di un'applicazione web completa. L'applicazione web che creeremo è un sito che fornisce informazioni su un evento tecnico di un giorno, con interventi di più relatori durante la giornata.

Ancora una volta, assicurati di trovarti nella Agent Manager e di aver selezionato Playground.

Inserisci il seguente prompt:

I would like to generate a website that is a 1-day technical conference informational site.

The website should have the following functionality:
        1. A home page that shows the current date, location, schedule and time table.
        2. The 1-day event is a list of 8 talks in total.
        3. Each talk has 1 or 2 max. speakers. 
        4. A talk has an ID, Title, Speakers, Category (1 or 2), Description and time of the talk.
        5. Each speaker has a First Name, Last Name and LinkedIn url.
        6. Allow for users to search by category, speaker, title.
        7. Give a lunch break of 60 minutes.
        8. Use dummy data for events and speakers, come up with a schedule, the event is about Google Cloud Technologies.
        9. Tech Stack: Python and Flask framework on server side. Front-end is basic HTML, CSS and JavaScript. 
        10. Test out the site on your own for all functionality and provide a detailed README on how to setup, run and make any further changes. 
11. Launch the web application for me to review. 

Puoi iniziare la conversazione con il prompt riportato sopra:

Mentre l'agente svolge il suo compito, procederà con la creazione degli artefatti:

• Artefatto dell'attività
• Artefatto di implementazione
• Artefatto della procedura dettagliata

L'artefatto di attività riportato di seguito era la sequenza iniziale di attività che l'agente ha decifrato in base all'attività assegnata. Di seguito è riportato uno screenshot di esempio dell'esecuzione:

A questo punto, puoi fare clic sull'artefatto Piano di implementazione. Di seguito è riportato uno screenshot di esempio:

Infine, c'è l'artefatto Procedura dettagliata. Contiene tutto ciò che l'agente ha fatto, come mostrato di seguito:

Nota che ha avviato il server e mi ha fornito l'URL, su cui faccio clic e ho l'applicazione. Di seguito è mostrato uno screenshot di esempio:

Se passo all'Editor, nota che nella schermata è presente la cartella in cui viene generata l'applicazione Python Flask. Noterai anche che Agent mode è taggato a destra e puoi continuare la conversazione anche lì.

Ora, supponiamo di voler aggiungere altri talk all'evento. Possiamo rimanere nell'editor e nel riquadro dell'agente e dare un'istruzione come Add two more talks to the schedule.

In questo modo, l'agente analizzerà il requisito, aggiornerà l'attività, il piano di implementazione e convaliderà anche la funzionalità aggiornata. Di seguito è riportato un esempio di conversazione:

Se vuoi, puoi tornare a Gestione agenti. Questa procedura dovrebbe aiutarti a comprendere il processo di transizione da Agent Manager a Editor, apportando le modifiche di conseguenza e così via.

Nota:durante l'esecuzione di questa attività, l'agente ha tentato di avviare il server Flask sulla porta 5000, che era in uso sulla macchina corrente. Ha continuato a tentare con la porta libera successiva, finché non ha deciso di utilizzare la porta 8080 ed è riuscito ad avviare il server.

Cose da provare

• Aggiungi all'applicazione funzionalità aggiuntive che ti interessano. Fornisci i dettagli all'agente e osserva come svolge il suo compito modificando prima l'elenco delle attività, poi il piano di implementazione e così via.
• Chiedi all'agente di generare un file README o altra documentazione per l'applicazione.

Generare una semplice app di produttività

Ora genereremo una semplice applicazione web timer Pomodoro.

Assicurati di trovarti in Agent Manager e di aver selezionato Playground. Inserisci il seguente prompt:

Create a productivity app that features a Pomodoro timer. Give a calm and aesthetic look to the application.

Nota come procede alla creazione dell'elenco delle attività, del piano di implementazione e poi come lo esegue. Continua a prestare attenzione al flusso, potrebbero esserci situazioni in cui ti verrà chiesto di effettuare una revisione. Di seguito è riportato un esempio di esecuzione.

In questo caso, dovrebbe anche avviare il browser Antigravity, eseguire i propri test e quindi confermare che sono andati a buon fine. Uno degli elementi generati è un artefatto multimediale che contiene il video della verifica. È un ottimo modo per vedere cosa è stato testato. Ho anche suggerito alcune modifiche allo stile, dato che non erano state applicate, e sono state apportate.

L'app finale aveva l'aspetto di quella riportata di seguito ed era piuttosto buona.

Che ne dici di aggiungere una bella immagine del timer all'applicazione? Tutto ciò che dobbiamo fare è emettere un'istruzione di follow-up come indicato di seguito:

Add an image to the application that displays a timer.

Di conseguenza, l'agente ha aggiunto una nuova attività all'artefatto Attività:

Poi ha generato un'immagine mentre svolgeva il compito:

Infine, l'app aveva l'immagine come richiesto:

Cose da provare

• Nota che lo sfondo dell'icona a forma di clessidra nell'applicazione non è trasparente. Prova a chiedere all'agente di rendere trasparente questa informazione.
• Prova alcune varianti di qualsiasi applicazione che vuoi generare. Gioca con gli stili, le immagini, chiedi modifiche e così via.

Generare test delle unità, stub simulati e convalidare i test

L'ultimo caso d'uso che proveremo qui è quello di generare test delle unità per un file di codice specifico che abbiamo e per l'agente di eseguire anche i test e convalidarli.

A questo scopo, avremo uno spazio di lavoro con un singolo file Python, come mostrato di seguito:

from typing import Dict

# --- Custom Exceptions ---
class InventoryShortageError(Exception):
    """Raised when there is not enough item stock."""
    pass

class PaymentFailedError(Exception):
    """Raised when the payment gateway rejects the transaction."""
    pass

class InvalidOrderError(Exception):
    """Raised when the order violates business rules."""
    pass

# --- External Service Interfaces (To be Mocked) ---
class InventoryService:
    def get_stock(self, product_id: str) -> int:
        """Connects to DB to check stock."""
        raise NotImplementedError("Real connection required")

    def decrement_stock(self, product_id: str, quantity: int):
        """Connects to DB to reduce stock."""
        raise NotImplementedError("Real connection required")

class PaymentGateway:
    def charge(self, amount: float, currency: str) -> bool:
        """Connects to Stripe/PayPal."""
        raise NotImplementedError("Real connection required")

# --- Main Business Logic ---
class Order:
    def __init__(self, 
                 inventory_service: InventoryService, 
                 payment_gateway: PaymentGateway,
                 customer_email: str,
                 is_vip: bool = False):
        
        self.inventory = inventory_service
        self.payment = payment_gateway
        self.customer_email = customer_email
        self.is_vip = is_vip
        self.items: Dict[str, Dict] = {} # {product_id: {'price': float, 'qty': int}}
        self.is_paid = False
        self.status = "DRAFT"

    def add_item(self, product_id: str, price: float, quantity: int = 1):
        """Adds items to the cart. Rejects invalid prices or quantities."""
        if price < 0:
            raise ValueError("Price cannot be negative")
        if quantity <= 0:
            raise ValueError("Quantity must be greater than zero")

        if product_id in self.items:
            self.items[product_id]['qty'] += quantity
        else:
            self.items[product_id] = {'price': price, 'qty': quantity}

    def remove_item(self, product_id: str):
        """Removes an item entirely from the cart."""
        if product_id in self.items:
            del self.items[product_id]

    @property
    def total_price(self) -> float:
        """Calculates raw total before discounts."""
        return sum(item['price'] * item['qty'] for item in self.items.values())

    def apply_discount(self) -> float:
        """
        Applies business logic:
        1. VIPs get flat 20% off.
        2. Regulars get 10% off if total > 100.
        3. No discount otherwise.
        """
        total = self.total_price
        
        if self.is_vip:
            return round(total * 0.8, 2)
        elif total > 100:
            return round(total * 0.9, 2)
        
        return round(total, 2)

    def checkout(self):
        """
        Orchestrates the checkout process:
        1. Validates cart is not empty.
        2. Checks stock for all items.
        3. Calculates final price.
        4. Charges payment.
        5. Updates inventory.
        """
        if not self.items:
            raise InvalidOrderError("Cannot checkout an empty cart")

        # 1. Check Inventory Logic
        for product_id, data in self.items.items():
            available_stock = self.inventory.get_stock(product_id)
            if available_stock < data['qty']:
                raise InventoryShortageError(f"Not enough stock for {product_id}")

        # 2. Calculate Final Price
        final_amount = self.apply_discount()

        # 3. Process Payment
        try:
            success = self.payment.charge(final_amount, "USD")
            if not success:
                raise PaymentFailedError("Transaction declined by gateway")
        except Exception as e:
            # Catching generic network errors from the gateway
            raise PaymentFailedError(f"Payment gateway error: {str(e)}")

        # 4. Decrement Stock (Only occurs if payment succeeded)
        for product_id, data in self.items.items():
            self.inventory.decrement_stock(product_id, data['qty'])

        self.is_paid = True
        self.status = "COMPLETED"
        
        return {"status": "success", "charged_amount": final_amount}

Assicurati di avere il file Python sopra indicato localmente in una cartella e di caricarlo come Workspace in Antigravity.

Si tratta di un semplice servizio di ordini che ha la seguente funzionalità chiave nella funzione checkout:

1. Verifica che il carrello non sia vuoto.
2. Controlla le scorte di tutti gli articoli.
3. Calcola il prezzo finale.
4. Pagamento degli addebiti.
5. Aggiorna l'inventario.

Assegneremo all'agente il compito di generare scenari di test unitari, fornire implementazioni fittizie ed eseguire i test per assicurarci che vadano a buon fine.

Si aprirà la cartella specifica dello spazio di lavoro e noterai che ora possiamo utilizzare anche il simbolo @ per fare riferimento al file. Ad esempio, potremmo:

Viene visualizzata una spiegazione del contenuto del file:

Possiamo chiedere di generare una visualizzazione migliore tramite il prompt:

Can you visually show this class for better understanding

Il passaggio successivo consiste nel generare i test delle unità e chiedere all'agente di provarli. Invio il seguente prompt:

generate unit tests for this module and test it out with mock implementations.

Ha generato il seguente artefatto dell'attività e ha continuato a svolgere la sua attività.

Puoi anche visualizzare i dettagli dei test eseguiti:

Uno dei file generati era anche il file di test. Di seguito è riportato uno screenshot:

Cose da provare

Prendi il tuo codice e scopri cosa puoi chiedere all'agente, dall'aggiunta di altre funzionalità al refactoring di parti del codice.

12. Complimenti

Congratulazioni, hai installato e compreso correttamente come utilizzare Antigravity, la piattaforma di sviluppo incentrata sugli agenti. I diversi casi d'uso che abbiamo provato dovrebbero aiutarti a prendere i tuoi requisiti ed esplorare come Antigravity può collaborare con te per completarli.

Documenti di riferimento

• Sito ufficiale : https://antigravity.google/
• Documentazione: https://antigravity.google/docs
• Casi d'uso : https://antigravity.google/use-cases
• Download : https://antigravity.google/download
• Canale YouTube di Google Antigravity : https://www.youtube.com/@googleantigravity