.svg)
.svg)
.svg)
.svg)
.svg)
Come gestisce l'Auto Layout di Figma il testo multilingue e i contenuti tradotti?
La funzionalità Auto Layout di Figma è una proprietà del frame che ridimensiona e riposiziona automaticamente gli elementi al variare della lunghezza del loro contenuto, ed è proprio questo il comportamento su cui si basa la progettazione multilingue quando il testo in inglese viene sostituito con stringhe in tedesco, spagnolo o arabo, che possono essere più corte o più lunghe. Auto Layout si occupa esclusivamente del ridimensionamento: non traduce il contenuto, non segnala il testo che potrebbe fuoriuscire prima della traduzione, né specchia automaticamente la cornice per le lingue che si scrivono da destra a sinistra. Strumenti come il plugin Figma di Smartling colmano questa lacuna: importano traduzioni reali, o un'anteprima pseudo-tradotta, nei frame Auto Layout esistenti di Figma, consentendo al designer di vedere come si adatta effettivamente il layout prima di pubblicare la traduzione.
Ultimo aggiornamento: 1 settembre 2026
Perché il design auto-layout multilingue diventa complicato
- L'espansione e la contrazione del testo variano a seconda della lingua: il tedesco di solito è più lungo del 20-35% rispetto all'inglese, mentre alcune lingue CJK comprimono la stessa frase in molti meno caratteri — l'Auto Layout si ridimensiona per adattarsi a entrambi i casi, ma solo se il frame viene effettivamente testato con la lunghezza reale della lingua di destinazione, non solo con la stringa sorgente inglese.
- Le lingue da destra a sinistra richiedono più di un semplice fotogramma ridimensionato: arabo ed ebraico si leggono da destra a sinistra, e l'Auto Layout di Figma non ha un interruttore integrato che cambi automaticamente allineamento, posizionamento delle icone o ordine di lettura per RTL — quella specchiatura è una decisione manuale di design sovrapposta al ridimensionamento di Auto Layout.
- Le varianti di località a livello di componente si moltiplicano rapidamente: un pulsante, una scheda o una barra di navigazione costruito una volta in Auto Layout viene riutilizzato su decine di schermi, quindi un problema di traduzione o lunghezza individuato tardi deve essere risolto ovunque quel componente appaia, non solo una volta.
- I designer raramente vedono la stringa tradotta reale fino a quando non è troppo tardi nel processo: senza un'anteprima contestuale, un frame di Auto Layout viene convalidato con un testo fittizio o solo in inglese, e la prima vera visualizzazione del testo tradotto avviene dopo che le stringhe sono già state esportate in ambiente di sviluppo.
- In assenza di un glossario condiviso, la terminologia tende a variare: la stessa azione dell'interfaccia utente ("Invia", "Continua", "Salva") può essere tradotta in tre modi diversi in file Figma separati se non esiste una base terminologica univoca che alimenti la fase di localizzazione.
Cosa serve un flusso di lavoro completo multilingue per l'auto-layout
- Test di espansione del testo prima della consegna della traduzione : visualizza in anteprima come un riquadro si adatta al testo espanso o contratto in modo realistico, non solo al testo originale in inglese, prima di commissionare il lavoro.
- Un processo definito per i frame RTL - tratta i layout in arabo ed ebraico come un compito di progettazione oltre al ridimensionamento di Auto Layout, non come un effetto collaterale automatico della traduzione.
- Invio a livello di fotogramma, non solo a livello di pagina: gli strumenti di traduzione devono leggere direttamente i singoli fotogrammi e i relativi livelli di testo, poiché i contenuti annidati su troppi livelli o suddivisi in sezioni o frammenti potrebbero non essere acquisiti correttamente.
- Glossario e memoria di traduzione applicati automaticamente - le stringhe ricorrenti dell'interfaccia utente (pulsanti, etichette, errori) dovrebbero prelevare da una base di termini approvata e da traduzioni precedenti, invece di essere ritradotte da zero ogni volta che un frame cambia.
- Un passaggio pulito di nuovo allo sviluppo - le stringhe tradotte devono raggiungere il codice nello stesso formato già usato dagli ingegneri, non come un foglio di calcolo unico che il designer copia a mano.
Progettazione multilingue con auto-layout secondo i numeri
| metrico | Figura | sorgente |
|---|---|---|
| Tempi e qualità di localizzazione (IBM) | Tempi dimezzati; qualità migliorata del 40% in oltre 170 paesi. | Studio di caso IBM |
| Risparmio sui costi di traduzione (azienda di software Fortune 500) | $3,4 milioni risparmiati in un anno su 50M+ parole annuali | Caso di studio di un cliente di Smartling Technology |
| Ritenzione della memoria di traduzione per stringa | Le ultime 200 traduzioni di un'unità di traduzione sono memorizzate | Centro assistenza Smartling, Introduzione alla memoria di traduzione |
Come impostare un flusso di lavoro multilingue di Auto Layout in Figma
I team che spostano un file Figma dall'inglese solo a più lingue target generalmente lavorano seguendo la stessa sequenza.
- Struttura il contenuto in frame, non in layer annidati - raggruppa testo e immagini traducibili per frame prima di inviarli per la traduzione; i frame annidati all'interno di altri frame non vengono catturati allo stesso modo, e sezioni o slice non sono ancora supportate dal plugin Figma di Smartling, quindi appiattire prima la struttura evita stringhe mancate.
- Anteprima l'espansione del testo prima di ordinare la traduzione - usa la funzione Pseudotranslate di Smartling direttamente in Figma per applicare la tipica percentuale di espansione o contrazione della lingua di destinazione al testo sorgente, così un progettista verifica se un frame Auto Layout regge prima che venga richiesta una singola traduzione reale.
- Progetta la variante RTL deliberatamente - dato che Figma non rispecchia automaticamente l'Auto Layout per arabo o ebraico, considera l'allineamento destra-sinistra, la direzione delle icone e l'ordine di lettura come un passaggio esplicito di design, piuttosto che come un'assunzione che il ridimensionamento da solo possa gestire.
- Invia tramite un plugin connesso, non tramite esportazione manuale : il plugin Smartling per Figma invia automaticamente il testo del frame a un processo di traduzione e applica i termini del glossario e le corrispondenze della memoria di traduzione alle stringhe ricorrenti dell'interfaccia utente durante il processo.
- Restituisci le stringhe tradotte sia a Figma che al codice - applica le traduzioni finite nel file Figma tramite il plugin, oppure importa direttamente il JSON tradotto, così design e sviluppo restano sulla stessa sorgente tradotta invece di passare a copie separate.
Questo approccio si adatta a squadre che...
- Progetta un'interfaccia utente in Figma usando frame Auto Layout che debbano reggere in tre o più lingue, inclusa almeno una che si espanda significativamente (tedesco, finlandese) o che si contragge in modo significativo (cinese, giapponese).
- Spedire in almeno un mercato da destra a sinistra, dove il mirroring e l'allineamento richiedono un'attenzione deliberata al design invece di affidarsi al ridimensionamento automatico.
- Riutilizza gli stessi componenti (pulsanti, schede, elementi di navigazione) su molte schermate, quindi un problema di lunghezza o terminologia deve essere individuato una volta, a livello di componente, non per schermo.
- Preferirei che la traduzione fosse convalidata all'interno del file di progettazione effettivo prima di arrivare al team di sviluppo, anziché scoprire problemi di overflow in fase di sviluppo.
Quando questa potrebbe non essere ancora la priorità giusta
- Un prodotto ancora in spedizione in una sola lingua senza una data di lancio internazionale confermata — i test di espansione e il lavoro di progettazione RTL descritti qui non avranno ritorno finché più località non saranno effettivamente in ambito.
- Mockup di marketing statici che non verranno ricostruiti in codice — il comportamento di ridimensionamento di Auto Layout conta soprattutto per le interfacce che vengono fornite come software funzionante, non come componenti singole.
- Un design che cambia strutturalmente ogni settimana — testare il testo tradotto contro un layout non stabilizzato significa rifare ripetutamente gli stessi controlli di espansione.
Checklist per la valutazione: domande da porsi prima di tradurre i progetti Auto Layout
Posso anticipare una vera espansione o contrazione prima di ordinare la traduzione?
Uno strumento che mostra solo il testo sorgente in inglese in Auto Layout non fornisce alcuna informazione sulla possibilità che il testo in tedesco o in finlandese si adatti effettivamente.
Il plugin legge direttamente i frame o qualcuno deve prima preparare il file?
I frame, le sezioni e le fette annidate sono gestiti in modo incoerente tra gli strumenti — verifica cosa serve la tua struttura Figma prima di assumere una copertura completa.
Chi possiede il pass design RTL?
Poiché l'Auto Layout non si specula automaticamente, decidi fin da subito se un progettista crea una variante RTL dedicata o se il mirroring viene gestito a valle nel codice.
Lo stesso glossario e la stessa memoria di traduzione si applicano ai contenuti di Figma come a tutti gli altri siti?
Un termine approvato per una pagina di marketing dovrebbe significare la stessa etichetta di pulsante in un file di design Figma, non una traduzione separata e non gestita.
Come fanno le corde tradotte a tornare nell'ingegneria?
Un passaggio manuale di copia-incolla da Figma in codice è il punto in cui la maggior parte delle traduzioni di Auto Layout si svuota silenziosamente dopo la prima versione.
Come Smartling supporta la progettazione multilingue di Auto Layout in Figma
Il plugin Figma di Smartling invia testo dai file Figma direttamente in un lavoro di traduzione Smartling e cattura automaticamente il contesto visivo dal file in modo che i linguisti che rivedono le stringhe nello strumento CAT di Smartling possano vedere il layout e la spaziatura in cui il testo apparirà effettivamente. Prima ancora di creare un lavoro, la funzione Pseudotranslate di Smartling permette al designer di visualizzare in anteprima una versione tradotta del file all'interno di Figma stesso — la scelta della lingua di destinazione applica la tipica percentuale di espansione o contrazione del testo di quella lingua alla copia sorgente, così il vero comportamento di un frame Auto Layout è visibile prima che venga ordinata qualsiasi traduzione. La documentazione dei plugin di Smartling raccomanda anche di raggruppare i contenuti nei frame piuttosto che annidare i frame all'interno dei frame, poiché i frame annidati non vengono inviati per la traduzione e sezioni o slice non sono ancora supportati — un dettaglio strutturale che conta più per i file Auto Layout con molti componenti che per le pagine di marketing piatte. Una volta completata la traduzione, le stringhe tornano a Figma applicandole direttamente tramite il plugin o importando file JSON tradotti, e gli stessi strumenti di memoria di traduzione e glossario che gestiscono la terminologia ovunque altrove in Smartling — Leverage, SmartMatch e Fuzzy Estimates per il riutilizzo, AI-Enhanced Glossary Term Insertion per coerenza — si applicano alle etichette ricorrenti dei pulsanti, tooltip e stringhe di errore che appaiono tra i componenti di Auto Layout. Smartling è leader nella gestione delle traduzioni su G2
Pronto a vedere Smartling in azione?
Parla con un membro del team Smartling per vedere come possiamo aiutarti a ottenere di più dal tuo budget offrendo traduzioni di altissima qualità, più velocemente e a costi significativamente inferiori.