> ## 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.
# Importare da Figma
> Trasforma i tuoi design Figma in app e pagine funzionanti. Importa un frame per iniziare una nuova app, o aggiungi pagine Figma a un'app esistente in qualsiasi momento nell'editor.
Base44 si collega a Figma così puoi costruire direttamente dai tuoi design. Importa un frame Figma quando inizi una nuova app, o aggiungi pagine da Figma a un'app esistente in qualsiasi momento durante lo sviluppo.
* **Posto Figma:** Devi avere un posto Editor. Figma blocca l'accesso API per gli account View e Collaborator.
* **File di design:** Devi usare un file Figma Design. FigJam, Slides e altri tipi di file non sono supportati.
* **Link pubblico al frame:** Il link al frame deve essere impostato su **Anyone with the link – Can view**. In Figma, clicca **Share** per aggiornarlo. Puoi rimetterlo su privato dopo l'import.
Puoi collegare un account Figma per workspace.
***
## Iniziare una nuova app da Figma
Usa **Import from Figma** nella schermata principale per trasformare un frame Figma in una nuova app Base44. Base44 ricrea il layout, la struttura e lo stile visivo del design come punto di partenza.
**Per iniziare una nuova app da un design Figma:**
1. Vai su [Base44](https://base44.com).
2. Clicca l'icona **+** nella prompt box.
3. Clicca **Import from Figma**.
4. Clicca **Connect to Figma**.
5. Segui le istruzioni a schermo per dare a Base44 l'accesso a Figma.
6. Incolla il link Figma e clicca **Generate**.
L'importazione si concentra sul frame o sezione selezionato. Altre parti del file Figma non sono incluse a meno che tu non le importi separatamente.
***
## Aggiungere una pagina da Figma
Una volta che l'app è nell'editor, puoi aggiungere frame Figma come nuove pagine in qualsiasi momento. Non sei limitato all'import iniziale. L'accesso Editor è necessario per aggiungere pagine da Figma. I Viewer non possono aggiungere pagine e devi aspettare che l'eventuale generazione attiva finisca prima di aggiungere una pagina.
**Per aggiungere una pagina da Figma:**
1. Apri l'app nell'editor.
2. Nella chat AI, clicca l'icona **+** e seleziona **Add page from Figma**.
3. In Figma, clicca con il tasto destro sul **frame o sezione** che vuoi importare.
4. Scegli **"Copy/Paste as"**, poi seleziona **"Copy link to selection"**.
5. Incolla il link nel dialogo e clicca **Add page**.
***
## Linee guida per l'import da Figma
Preparare il file Figma prima dell'import aiuta Base44 a leggere il design e ricrearlo come layout pulito e accurato. Segui queste linee guida per i migliori risultati.
### Strutturare il layout Figma
Una struttura chiara in Figma rende più facile per Base44 costruire un layout responsive che corrisponda al tuo intento.
Una home page ben strutturata con sezioni chiare e componenti coerenti dà i migliori risultati quando estendi il design in un'app completa.
* **Dividi la pagina in sezioni logiche:** Racchiudi contenuti correlati (per esempio, hero, riga di funzionalità o footer) dentro frame o gruppi così ogni area della pagina è chiaramente definita.
* **Usa auto layout per la gerarchia:** Applica `Auto Layout` a componenti come card, barre di navigazione e blocchi di contenuto ripetitivi. Per esempio, una card informativa con immagine, titolo e descrizione dovrebbe essere raggruppata come `Frame` o `Group`, o preferibilmente `Auto Layout`. Questo aiuta Base44 a capire come gli elementi si relazionano e come devono ridimensionarsi.
* **Mantieni il nesting significativo:** Raggruppa gli elementi che appartengono insieme (per esempio, immagine + titolo + descrizione in una card) ed evita nesting profondo e inutile.
* **Allinea e spazia in modo coerente:** Usa padding, gap e allineamento coerenti dentro i frame così Base44 può preservare spaziatura e gerarchia.
### Lavorare con vettori e forme
Pulire gli elementi vettoriali prima dell'import rende posizionamento e rendering più accurati. Appiattire e semplificare i vettori riduce le sorprese in come gli elementi si allineano, ridimensionano e renderizzano in Base44.
* **Appiattisci vettori complessi:** Se un vettore è costruito da molti percorsi separati, appiattiscilo in un unico vettore quando puoi.
* **Trasforma gli stroke in outline prima di appiattire:** Per linee, cerchi, stelle e forme simili:
* Usa **Outline Stroke** poi appiattisci il risultato in un unico elemento vettoriale.
* **Rimuovi elementi nascosti:** Elimina i layer completamente nascosti o spinti lontano dalla canvas così non interferiscono con il layout importato.
* **Semplifica i fill:** Se un elemento ha più fill, mantieni solo ciò che ti serve. Base44 importa solo l'ultimo fill su un elemento.
### Font, effetti e altre limitazioni
Alcune parti del design Figma vengono adattate durante l'import così il layout risultante funziona in modo affidabile in Base44.
* **Font:**
* Solo i Google Font sono pienamente supportati.
* I font personalizzati vengono sostituiti con un font predefinito durante l'import. Puoi aggiornare la tipografia in seguito in Base44.
* **Effetti di design che potrebbero non essere preservati esattamente:**
* Filtri immagine
* Più layer di sfondo su un singolo elemento
* Variabili e stili basati su variabili
* **Rifiniture del layout:**
* Rifinisci spaziatura, responsività e interazioni dopo l'import usando la chat AI o la modalità Visual Edit.
* Se qualcosa non sembra giusto, regola la struttura direttamente in Base44 o aggiorna il file Figma e importa di nuovo da un frame più pulito.
Se il design si basa fortemente su effetti non supportati o configurazioni complesse di variabili, aspettati differenze visive dopo l'import e prevedi di rifinire il risultato in Base44.
### Costruire il resto dell'app
Una volta importato il frame Figma, puoi trattare la nuova pagina come base per un'app o sito completo.
* Usa la pagina importata come **home page** e riferimento principale per struttura, layout e linguaggio visivo.
* Chiedi alla chat AI di:
* Identificare quali pagine aggiuntive mancano (per esempio, About, Pricing, Blog o Contact).
* Creare nuove pagine che seguano lo stesso linguaggio di design e principi di layout.
* Collegare pulsanti, menu e link sulla home page alle nuove pagine interne.
**Puoi usare un prompt come:**
> `Review the home page carefully, including both its content and its design style. Use the home page as the main reference to understand the website's structure and design language. Identify which additional pages are needed to create a complete website. Create the missing pages while maintaining the same design language, layout principles, and visual style as the home page, so they feel like a direct continuation and not disconnected. When finished, return to the home page and connect all relevant buttons and links so each one navigates to the appropriate internal page.`
Se vedi pattern ripetuti nel design importato (come card, righe di funzionalità o blocchi call-to-action), menzionali nel prompt così l'IA può riutilizzarli sulle nuove pagine.
Questa pagina è stata tradotta utilizzando l'IA. Per informazioni più accurate e aggiornate, consulta la [versione inglese](/).