> ## Documentation Index > Fetch the complete documentation index at: https://docs.base44.com/llms.txt > Use this file to discover all available pages before exploring further. # Progettare con l'AI > Impara a progettare la tua app con l'AI: dalle un brief come a un designer, ritocca gli elementi in modalità Edit, imposta limiti con gli AI Controls e affina le opzioni proposte. L'AI è al centro del modo in cui progetti in Base44. Descrivi ciò che vuoi in linguaggio naturale, e l'AI aggiorna codice, stili e componenti per te. La modalità **Edit** ti permette di ritoccare ciò che vedi sullo schermo, e gli AI Controls ti aiutano a impostare dei limiti. Questa pagina copre ogni flusso di lavoro con prompt ed esempi che puoi usare direttamente. The app editor chat making a design change to an app Per il pannello Theme, i font e lo stile globale di una singola app, vedi [Personalizzare il design della tua app](/Building-your-app/Design). *** ## Come funziona il design Non ti serve uno strumento di design né alcuna esperienza. Il design della tua app fa parte del suo codice, e l'AI modifica quel codice per te: ogni modifica di design è una richiesta in linguaggio semplice, da "rendi i pulsanti più arrotondati" a "riprogetta questa intera pagina". Ci sono tre modi per fare una modifica di design, e scegliere quello giusto ti fa risparmiare tempo: | Modifica che vuoi | Usa | | -------------------------------------------------------------------------- | --------------------- | | Colori o font in tutta l'app | Il pannello **Theme** | | Un elemento o una sezione che puoi indicare | La modalità **Edit** | | Qualcosa di più grande, come nuovi layout, redesign o un'atmosfera diversa | La chat AI | **Un buon ordine per un redesign completo:** 1. Imposta prima l'aspetto generale: colori e font nel [pannello Theme](/Building-your-app/Design#global-changes). 2. Chiedi all'AI modifiche a livello di pagina, una pagina alla volta. 3. Rifinisci i singoli elementi in modalità **Edit**. Niente è permanente. Puoi cliccare **Revert** su qualsiasi prompt per annullare quella modifica, o ripristinare una versione precedente della tua app dalla cronologia delle versioni, quindi sperimentare è sempre sicuro. *** ## Progettare nella chat La chat AI è ideale per modifiche globali e decisioni di design che riguardano molte parti della tua app. Puoi definire una persona e un brief una sola volta, e poi costruire su quella base: ```text theme={null} Sei il mio product designer per questa app. Brief di design: - Scopo: aiutare i team di contenuti a pianificare, scrivere e pubblicare articoli più velocemente. - Persone: content lead e writer impegnati, su laptop durante la giornata lavorativa. - Atmosfera: calma, concentrata, moderna, affidabile. Usa questo brief come base per tutti i suggerimenti e le decisioni di design. ``` Non ti serve nemmeno il vocabolario del design. Descrivi la sensazione che vuoi, cita un prodotto di cui ti piace lo stile, oppure carica lo screenshot di un design che ammiri e chiedi all'AI di replicarne lo stile: ```text theme={null} Rendi questa pagina più calma e più premium. Usa lo screenshot allegato come riferimento per lo stile generale. ``` Schemi utili: * Chiedi una critica prima di chiedere le modifiche. * Chiedi un piano in modalità Discuss, approvalo, e poi chiedi all'AI di implementarlo. * Chiarisci sempre l'ambito del design: l'intera app, una pagina o un elemento. Esempio: ```text theme={null} Fai una critica del design solo di questa dashboard. Concentrati su layout, gerarchia, colori, tipografia e spaziatura. Poi proponi un breve piano di piccole modifiche. Aspetta la mia approvazione prima di applicare qualsiasi cosa. ``` Dopo la tua revisione: ```text theme={null} Applica il piano che hai proposto per questa dashboard. Fai le modifiche in piccoli gruppi e descrivi brevemente ogni gruppo man mano. ``` *** ## Scegliere un'opzione di design Quando chiedi all'AI di cambiare il design o il layout di una sezione o di un elemento, potrebbe presentarti opzioni visive tra cui scegliere invece di applicare subito una modifica. Ogni opzione mostra un'anteprima, così puoi vedere il risultato prima di confermare. Puoi anche cliccare l'icona **Expand** su un'opzione per vederla a schermo intero e affinarla prima di scegliere. Design options in the chat, with the Expand icon shown on a mockup Descrivi una modifica mirata, come uno sfondo più chiaro, per regolare solo quei dettagli, oppure chiedi una direzione completamente diversa per sostituire quell'opzione. Quando il risultato ti convince, clicca **Apply**. Expanded design option showing a mockup preview with a change request typed below it *** ## Esplorare direzioni di design Puoi usare la chat AI per esplorare direzioni diverse prima di decidere. Non serve descrivere il tuo design attuale: l'AI fa uno screenshot della tua pagina e analizza ciò che è effettivamente presente. Ciclo di critica: ```text theme={null} Agisci come un senior product designer. Analizza questa pagina e descrivi tre problemi visivi specifici. Per ogni problema, scrivi un prompt Base44 che lo risolverebbe. Non fare ancora nessuna modifica. ``` Direzioni alternative: ```text theme={null} Crea due opzioni visive per questa dashboard: - Opzione A: molto minimale, per lo più neutra con un solo colore d'accento - Opzione B: più espressiva, con colori più ricchi e tipografia leggermente più grande Mantieni invariati contenuti e layout. Descrivi ogni opzione in un breve riepilogo e aspetta che io scelga. ``` Una volta scelta un'opzione, puoi chiedere all'AI di applicare quella direzione a pagine simili. *** ## Usare la modalità Edit La modalità **Edit** è ideale quando vuoi regolare ciò che vedi senza riscrivere tutto. Visualedittoolbar Clicca **Edit** nella chat e poi seleziona l'elemento che vuoi modificare. Puoi: * Selezionare una sezione e regolare visivamente colori, spaziatura e layout. * Chiedere all'AI di ristilizzare una singola istanza di componente. * Eliminare gli elementi che non ti servono più con l'icona **Delete** . * Usarla come sandbox sicura prima di estendere un pattern al resto della tua app. Clicca **Edit Element** sulla barra degli strumenti Edit per chiedere all'AI di fare le modifiche. Ad esempio: ```text theme={null} In questa sezione selezionata: - Schiarisci leggermente lo sfondo - Aumenta la spaziatura verticale tra il titolo e il contenuto - Usa lo stile del pulsante primario per l'azione principale e lo stile secondario per le altre ``` ```text theme={null} Solo per questa card: - Aumenta il padding - Sposta l'icona a sinistra del titolo - Usa un'ombra più morbida coerente con le altre card dell'app ``` *** ## Usare gli AI Controls Usa gli [AI Controls](/Building-your-app/AI-chat-modes#customizing-your-ai-chat) nella chat per guidare e proteggere il tuo design. Puoi: * Impostare linee guida di design che si applicano a ogni prompt. * Congelare file o pagine specifici in modo che l'AI non li modifichi. * Stabilire un tono, come minimale, deciso o giocoso. Esempio di linee guida: ```text theme={null} Linee guida di design globali: - Preferisci uno stile calmo e minimale con molto spazio bianco - Usa angoli arrotondati con raggio 12 su card e pulsanti - Evita gradienti pesanti ed effetti vetro - Mantieni le animazioni discrete e rispetta le preferenze di riduzione del movimento ``` Sii sempre esplicito sull'ambito nei tuoi prompt. La stessa modifica può applicarsi all'intera app, a una pagina o a un singolo elemento, e l'AI seguirà le tue indicazioni: ```text theme={null} Aggiorna lo stile del pulsante primario e propagalo in tutti i punti in cui viene usato il componente del pulsante primario. Non modificare i pulsanti secondari. ``` ```text theme={null} Aggiorna solo la sezione hero nella homepage: - Cambia lo sfondo in un gradiente delicato - Aumenta la dimensione del titolo - Usa lo stile del pulsante primario per la call to action principale Non modificare altre sezioni o pagine. ``` Per proteggere le aree che ti soddisfano mentre sperimenti altrove: * Usa gli AI Controls per congelare file o pagine specifici in modo che l'AI non li modifichi. * Usa l'opzione **Revert** sui singoli prompt per annullare una singola modifica. * Usa la cronologia delle versioni per tornare a uno stato precedente. *** ## FAQ Clicca una domanda qui sotto per saperne di più sulla progettazione con l'AI. Sì. I prompt di design sono messaggi della chat AI, quindi usano i tuoi crediti messaggio come qualsiasi altra richiesta nella chat. La modalità **Edit** stilizza un elemento o una sezione alla volta. Il pannello **Theme** cambia colori e font in tutta la tua app in una volta sola. Per saperne di più sul pannello Theme, vedi [Personalizzare il design della tua app](/Building-your-app/Design). Questa pagina è stata tradotta con l'AI. Per le informazioni più accurate e aggiornate, consulta la [versione inglese](/).