# General Translation Knowledge Base: Come si traducono le animazioni Lottie? URL: https://generaltranslation.com/it/kb/translate-lottie-animations.mdx Docs index: https://generaltranslation.com/llms.txt Description: Traduci le stringhe nei livelli di testo dell'animazione, memorizzate nel JSON Lottie in t.d.k[].s.t, quindi verifica che ogni traduzione rientri nel proprio riquadro, che i font supportino il nuovo sistema di scrittura e che nessun testo sia stato esportato come forme. Riesporta per ogni lingua, sostituisci il testo a runtime oppure modifica il JSON tramite script; la CLI di General Translation traduce i file .lottie dotLottie 1.0 e riadatta il layout. Category: Traduzione Last updated: 2026-10-28 Authors: General Translation Team Published: 2026-10-28 Un'animazione Lottie è un file JSON, di solito esportato da After Effects con il plugin Bodymovin, e i suoi testi si trovano all'interno dei livelli di testo, non in un file di stringhe separato. Tradurla significa sostituire quel testo per ogni lingua senza compromettere l'animazione. Tradurre le parole è la parte facile; il difficile sta in tutto ciò che le circonda: le dimensioni fisse dei riquadri, i font e i glifi incorporati e i sistemi di scrittura right-to-left. ## Dove si trova il testo in un file Lottie Il tipo di un layer è indicato da `ty` e i livelli di testo sono di tipo `5`. Ogni livello di testo ha un oggetto `t` il cui documento, `t.d`, contiene i keyframe in `k`; il campo `s` di ciascun keyframe è un documento di testo il cui `t` è la stringa vera e propria, con le interruzioni di riga indicate come `\r`. Un documento di testo specifica anche il font (`f`), la dimensione (`s`) e, per il testo in un riquadro, la dimensione del riquadro (`sz`) e la sua posizione (`ps`). Il testo che cambia nel corso dell'animazione ha un keyframe per ogni modifica ([Documentazione Lottie: Text](https://lottiefiles.github.io/lottie-docs/text/), [Layers](https://lottiefiles.github.io/lottie-docs/layers/)): ```json title="animation.json (excerpt)" { "fonts": { "list": [ { "fName": "Inter-Bold", "fFamily": "Inter", "fStyle": "Bold", "origin": 0 } ] }, "layers": [ { "ty": 5, "nm": "Headline", "t": { "d": { "k": [ { "t": 0, "s": { "t": "Start your free trial", "f": "Inter-Bold", "s": 48, "sz": [600, 80], "ps": [-300, -40] } } ] } } } ] } ``` Ci sono altri tre punti da tenere presenti: * **Precomposizioni.** Le composizioni annidate conservano i propri livelli in `assets[].layers`, quindi i livelli di testo possono trovarsi anche lì, non solo nell'array `layers` di primo livello. * **Font e glifi.** `fonts.list` riporta il nome di ciascun font. Se il designer ha attivato l'impostazione **Glyphs** di Bodymovin, il file contiene anche un array `chars` con il contorno di ogni carattere utilizzato; se è disattivata, il player ha bisogno del file del font vero e proprio ([Lottie: After Effects export settings](https://lottie.airbnb.tech/#/after-effects)). I glifi vengono renderizzati su Android e sul web, ma non su iOS, che richiede i font ([Lottie: Supported features](https://lottie.airbnb.tech/#/supported-features)). * **Testo convertito in forme.** Il testo che un designer ha convertito in forme in After Effects diventa un livello forma (`ty` 4) e non contiene più alcuna stringa da tradurre. Va quindi riconvertito in livello di testo in After Effects. Un file `.lottie` è un pacchetto dotLottie: un archivio ZIP che contiene un `manifest.json` e uno o più file JSON di animazione, oltre a eventuali immagini e font ([dotLottie 2.0 spec](https://dotlottie.io/spec/2.0/)). Il testo si trova nella stessa posizione all'interno di ciascun JSON di animazione. ## Cosa va storto quando si traduce un'animazione * **Espansione del testo.** Le traduzioni raramente hanno la stessa lunghezza del testo sorgente. Sul [sito di General Translation](https://generaltranslation.com), "Save changes" risulta più largo del 63% in tedesco che in inglese. Un livello di testo in un riquadro ha un `sz` fisso, quindi il testo più lungo va a capo su righe aggiuntive non previste dal design, mentre il testo a punto (senza riquadro) può sforare oltre i bordi del fotogramma. * **Caratteri mancanti.** Un font che copre solo l'alfabeto latino non contiene caratteri giapponesi, cinesi o arabi. Se i glifi vengono esportati, il file contiene solo i contorni dei caratteri presenti nel testo inglese; i maintainer di lottie-web precisano che tutti i glifi del nuovo testo "must have been exported from AE" ([wiki di lottie-web](https://github.com/airbnb/lottie-web/wiki/TextLayer.updateDocumentData)). * **Testo right-to-left.** Il supporto nei player è disomogeneo. lottie-android ha issue aperte sul testo right-to-left ([#1145](https://github.com/airbnb/lottie-android/issues/1145)) e sulle lettere arabe che vengono renderizzate senza legature ([#2279](https://github.com/airbnb/lottie-android/issues/2279)). (Per la pagina che contiene l'animazione, consulta [Come si supportano le lingue RTL (right-to-left) in CSS?](/kb/right-to-left-css).) * **Testo generato da espressioni.** Le espressioni di After Effects sono codice JavaScript salvato nel file (la proprietà `x`). Un livello di testo il cui contenuto deriva da un'espressione viene calcolato durante la riproduzione, quindi non esiste una stringa fissa da tradurre. Prima di tradurre, prova l'animazione sorgente con un testo più lungo e con caratteri accentati. (Consulta [Cos'è la pseudo-localizzazione?](/kb/pseudo-localization).) ## Modi per tradurre un'animazione Lottie | Approccio | Dove cambia il testo | Gestisce adattamento e font | Ripetibile a ogni rilascio | Cosa resta a tuo carico | | -------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------- | --------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------- | | Riesportare da After Effects per ogni lingua | Un designer duplica la composizione, modifica ogni livello di testo ed esporta un file per lingua | Un designer ritocca ogni versione a occhio | No; ogni modifica ai testi va ripetuta per ogni lingua | Un file per lingua e il tempo del designer per ciascuno | | Sostituire il testo a runtime | Il player sostituisce le stringhe durante il rendering dell'animazione | In parte; lottie-web può ridurre il testo nei riquadri per farlo entrare, ma font, glifi e livelli circostanti restano invariati | Sì; le stringhe provengono dalle traduzioni della tua app | Adattamento, copertura dei font e glifi in ogni lingua, oltre a chiavi stabili (testo di origine o nomi dei livelli) | | Modificare il JSON tramite script | Uno script sostituisce ogni valore `s.t`, spesso tramite traduzione automatica o un LLM | No | Sì | A capo, adattamento, font, glifi e ricompressione dei file `.lottie` | | CLI di General Translation | [`gt stage`](/docs/cli/reference/commands/stage) e [`gt download`](/docs/cli/reference/commands/download) generano un file `.lottie` tradotto per ogni lingua | L'elaborazione del layout riadatta il testo e i livelli vicini usando i font che carichi | Sì | Revisione di ogni animazione, rimozione delle espressioni e consumo di elaborazione del layout | La sostituzione a runtime è integrata nei player. In lottie-android, un `TextDelegate` associa il testo di origine al testo sostitutivo e `LottieProperty.TEXT` lo applica tramite le proprietà dinamiche ([Lottie for Android](https://lottie.airbnb.tech/#/android)): ```kotlin // Sostituisci il testo inglese dell'animazione con la risorsa stringa localizzata. val textDelegate = TextDelegate(animationView) textDelegate.setText("Start your free trial", getString(R.string.trial_cta)) animationView.setTextDelegate(textDelegate) ``` In lottie-ios, imposta `animationView.textProvider` su un `DictionaryTextProvider` con chiavi corrispondenti al keypath del livello di testo ([codice sorgente di lottie-ios](https://github.com/airbnb/lottie-ios/blob/master/Sources/Public/TextProvider/AnimationTextProvider.swift)). In lottie-web, chiama `updateDocumentData` sull'elemento del livello di testo. Il metodo `setTextSlot` del player web dotLottie sostituisce il testo che il designer ha esposto come slot ([slot di dotLottie](https://docs.lottiefiles.com/en/runtimes/distributions/js/v0.x/core-concepts/slots)). lottie-web può anche ridurre il testo di un riquadro per adattarlo: [`canResizeFont(true)`](https://github.com/airbnb/lottie-web/wiki/TextLayer.canResizeFont) riduce la dimensione del carattere di un livello di testo finché la stringa non rientra nel riquadro, fino a una soglia minima impostata con [`setMinimumFontSize`](https://github.com/airbnb/lottie-web/wiki/TextLayer.setMinimumFontSize). Nessuna di queste API sposta o ridimensiona i livelli attorno al testo, come la forma di un pulsante dietro un'etichetta. Riesporta da After Effects quando un'animazione viene distribuita in una o due lingue e un designer vuole rifinire ogni fotogramma. Sostituisci il testo a runtime quando le parole provengono dalla tua app, come il nome di un utente, e il riquadro ha spazio sufficiente per la traduzione più lunga. Scegli General Translation quando le animazioni vengono distribuite in molte lingue, cambiano a ogni rilascio e richiedono layout riadattati per ciascuna lingua. Modifica il JSON con script tuoi solo se sei disposto a gestire in autonomia i controlli su adattamento e font. ## Come tradurre i file Lottie con General Translation La CLI di General Translation, `gt`, traduce i file dotLottie tramite la chiave di file `lottie` (da `gt` 2.16.0 in poi). Aggiungi una voce `lottie` con un segnaposto `[locale]` nel percorso: ```json title="gt.config.json" { "defaultLocale": "en", "locales": ["es", "ja"], "files": { "lottie": { "include": ["animations/[locale]/**/*.lottie"] } }, "fonts": { "include": ["assets/fonts/**/*.{ttf,otf}"] } } ``` Le animazioni sorgente si trovano in `animations/en/` e le traduzioni vengono salvate in `animations/es/` e `animations/ja/`. La traduzione dei file Lottie è asincrona: invia i file con [`npx gt stage`](/docs/cli/reference/commands/stage), poi esegui [`npx gt download`](/docs/cli/reference/commands/download) finché tutte le impostazioni regionali non sono completate; quelle ancora in elaborazione vengono ignorate e scaricate in un'esecuzione successiva. [`gt translate`](/docs/cli/reference/commands/translate) non può completare in un'unica esecuzione un job Lottie non preparato per la revisione e ti chiede di prepararlo. I file scaricati sono file `.lottie` completi e non vengono pubblicati sulla CDN. General Translation legge il JSON dell'animazione dalla cartella `animations/` del pacchetto, secondo il layout di dotLottie 1.0. I pacchetti dotLottie 2.0 lo collocano invece in `a/`, mentre una semplice animazione `.json` non è affatto un pacchetto. In entrambi i casi, converti i file con [`@dotlottie/dotlottie-js`](https://github.com/dotlottie/dotlottie-js), le cui funzioni `toDotLottieV1` e `DotLottieV1` generano il layout 1.0. Dopo la traduzione, l'elaborazione del layout mantiene le dimensioni dei caratteri dell'animazione, ridistribuisce il testo e sposta i livelli adiacenti per far spazio a ogni etichetta. Se un'etichetta continua a non entrare, può essere abbreviata o riformulata nella lingua di destinazione senza alterarne il significato; i puntini di sospensione sono l'ultima risorsa, e i token di codice a spaziatura fissa non vengono mai abbreviati. Se non è possibile renderizzare e verificare le modifiche al layout, ottieni semplicemente l'animazione tradotta senza modifiche. Controlla ogni file scaricato prima di pubblicarlo. (Consulta il [riferimento Lottie](/docs/cli/reference/formats/lottie-files).) L'impostazione di primo livello [`fonts`](/docs/cli/reference/config#fonts) carica i tuoi file `.ttf` e `.otf`, così l'elaborazione del layout può usare i font effettivi dell'animazione; se l'animazione incorpora glifi, General Translation aggiunge i contorni dei caratteri richiesti da ciascuna traduzione, ricavandoli dai font caricati quando li contengono. I font sono risorse dell'Organizzazione, quindi per caricarli serve un accesso salvato o una chiave API dell'Organizzazione con `org:assets:write`; con una chiave API di progetto il caricamento non è possibile e la traduzione prosegue con font di fallback, mostrando un avviso. I file con espressioni di After Effects vengono rifiutati, perché le espressioni sono codice eseguibile: esportali di nuovo rimuovendo le espressioni o convertendole in keyframe. ### Cosa ha cambiato l'elaborazione del layout in un test Abbiamo creato un'animazione 480 × 160 di un pulsante a pillola: un'icona da 18px seguita dall'etichetta "Download invoice" in Arial Bold da 22px, con un padding da 16 a 18px. L'abbiamo tradotta in tedesco, francese e giapponese con `gt` 2.26.11 e una chiave API di progetto, quindi senza caricare alcun font: l'elaborazione del layout ha usato i propri font di fallback. Abbiamo misurato ogni etichetta nel renderer SVG di lottie-web 5.13 con i font del browser. Le righe con traduzione completa riportano le traduzioni di General Translation di ciascuna etichetta come semplice stringa, al di fuori dell'animazione, inserite nel pulsante originale a scopo di confronto: | Versione | Testo dell'etichetta | Larghezza dell'etichetta | Larghezza del pulsante | Risultato | | ------------------------------- | ------------------------ | ---------------------------- | ---------------------- | -------------------------------------------------------------------------------------------------------- | | Sorgente in inglese | Download invoice | 187px | 251px | Rientra, a 11px dall'icona | | Tedesco, traduzione completa | Rechnung herunterladen | 260px | 251px | Copre l'icona di 25px e sborda di 18px oltre il bordo | | Tedesco, General Translation | Rechnung laden | 171px | 251px | Rientra | | Francese, traduzione completa | Télécharger la facture | 229px | 251px | Copre l'icona di 9px e sborda di 2px oltre il bordo | | Francese, General Translation | Télécharger facture | 204px | 273px | Rientra; il pulsante si è allargato di 22px verso destra e l'etichetta si trova a 3px dall'icona | | Giapponese, traduzione completa | 請求書をダウンロード | 220px | 251px | Copre l'icona di 5px | | Giapponese, General Translation | 請求書取得 | 111px | 251px | Rientra | Tutte le etichette hanno mantenuto la dimensione di 22px e sono rientrate nello spazio. Per tedesco e giapponese si è preferito accorciare la formulazione anziché allargare il pulsante: *Rechnung laden* ("carica fattura") e 請求書取得 ("ottieni fattura") sono più concise delle etichette abituali. Il francese ha mantenuto il verbo, ha eliminato l'articolo e ha ottenuto un pulsante più largo, ma l'etichetta è finita più vicina all'icona rispetto alla sorgente. Se una formulazione più breve o uno spazio più ridotto siano accettabili lo decide chi esegue la revisione; inoltre, i risultati possono variare da un'esecuzione all'altra. Una seconda animazione dello stesso test conteneva un pulsante "Save changes" da 180px. Il risultato è stato *Speichern*, *Enregistrer* e 保存, le consuete etichette brevi, che rientrano nello spazio senza alcuna modifica al layout. Nella stessa esecuzione, però, il titolo "Your changes are ready" è stato tradotto in giapponese come 変更内容を保存できます ("Puoi salvare le modifiche"): un cambiamento di significato che solo una persona che legge il risultato potrebbe notare. La traduzione di file Lottie comporta un costo di elaborazione del layout, con un prezzo distinto da quello della traduzione e basato sul numero di proprietà animate dell'animazione ([misurazione dell'utilizzo](/docs/platform/dashboard/guides/managing-billing#usage-metering), [prezzi](https://generaltranslation.com/pricing)). I termini del Glossario e i Prompt Personalizzati del tuo [gruppo di contesto](/docs/platform/dashboard/guides/defining-context-for-translations) valgono anche per il testo delle animazioni, così il nome di una funzionalità in un'animazione di onboarding coincide con quello usato nella tua app e nei tuoi [file JSON delle impostazioni regionali](/kb/translate-json-files). ## Domande frequenti ### Perché la mia animazione tradotta mostra riquadri vuoti o lettere mancanti? Il font o i glifi incorporati non includono i nuovi caratteri. Distribuisci un font che supporti il sistema di scrittura. Se esporti i glifi, il file deve contenere un contorno per ogni carattere usato nella traduzione: esporta quindi di nuovo quella lingua da After Effects con il testo tradotto già inserito. ### Serve un file separato per ogni lingua? Con la sostituzione a runtime, no: un unico file vale per tutte le lingue. La riesportazione e la CLI di General Translation generano invece un file per lingua, da caricare in base all'impostazione regionale. ### Posso tradurre un testo convertito in forme? No. Le forme non contengono alcuna stringa da sostituire: ricrea il livello di testo in After Effects ed esporta di nuovo. ## Punti chiave * In Lottie il testo si trova nei livelli di testo (`ty` 5) in `t.d.k[].s.t`, compresi i livelli di testo all'interno delle precomposizioni in `assets`. * Le esportazioni con glifi contengono i contorni solo per i caratteri del testo di origine e iOS non renderizza i glifi; verifica i font per ogni sistema di scrittura che aggiungi. * Le API di Runtime (`TextDelegate`, `DictionaryTextProvider`, `updateDocumentData`, `setTextSlot`) sostituiscono le stringhe; `canResizeFont` di lottie-web può ridurre il testo nei riquadri per adattarlo, ma nessuna di queste API sposta i livelli circostanti. * La CLI di General Translation traduce i file `.lottie` dotLottie 1.0 tramite [`gt stage`](/docs/cli/reference/commands/stage) e [`gt download`](/docs/cli/reference/commands/download), riadatta i layout con i font che hai caricato e rifiuta i file che contengono espressioni. * Nel nostro test, l'elaborazione del layout ha mantenuto le dimensioni dei font e ha fatto entrare ogni etichetta, allargando un pulsante o accorciando il testo; rivedi ogni download per controllare formulazione e spaziature. * L'elaborazione del layout per Lottie ha un prezzo a parte, calcolato in base alle proprietà animate dell'animazione. ## Related questions - [Come si traducono i file JSON di i18n?](https://generaltranslation.com/it/kb/translate-json-files.mdx): Traduci solo i valori stringa di un file JSON di impostazione regionale. Lascia invariati le chiavi non plurali, i segnaposto come {{name}} e i tag, ma tieni presente che le chiavi plurali cambiano da una lingua all'altra: il polacco, ad esempio, richiede inbox_few e inbox_many. Usa uno strumento o un'API in grado di gestire il formato, quindi esegui il parsing dell'output e validalo prima della revisione. - [Come si supportano le lingue RTL (right-to-left) in CSS?](https://generaltranslation.com/it/kb/right-to-left-css.mdx): Imposta dir="rtl" e lang sull'elemento html, perché lang da solo non cambia la direzione, poi sostituisci le proprietà CSS fisiche come margin-left con proprietà logiche come margin-inline-start. Le righe flex, le colonne della griglia e l'allineamento predefinito del testo si invertono da sole; translateX(), left e right no. - [Che cos'è la pseudo-localizzazione?](https://generaltranslation.com/it/kb/pseudo-localization.mdx): La pseudo-localizzazione è un test che sostituisce il testo di origine con una versione alterata, con caratteri accentati, allungata di circa il 40% e racchiusa tra parentesi quadre, così che stringhe hardcoded, troncamenti, font che non vengono visualizzati correttamente e frasi concatenate emergano prima ancora che esista una traduzione. Android include a questo scopo le pseudo-impostazioni regionali en-XA e ar-XB. - [Come si traducono le presentazioni Google Slides?](https://generaltranslation.com/it/kb/translate-google-slides.mdx): Crea una copia della presentazione per ogni lingua, sostituisci il testo in ogni casella di testo, cella di tabella e nota del relatore e ridimensiona il testo che fuoriesce. L'integrazione di General Translation con Google Drive salva ogni lingua in una copia separata accanto alla presentazione sorgente ed esegue un passaggio di formattazione per adattare il nuovo testo a ogni slide. - [Come si traducono i sottotitoli SRT senza alterare la temporizzazione?](https://generaltranslation.com/it/kb/translate-srt-subtitles.mdx): In un file SRT traduci solo il testo dei cue; lascia numeri dei cue, timecode, righe vuote di separazione e tag di formattazione come nel file sorgente. Poi verifica la lunghezza delle righe e la velocità di lettura rispetto ai requisiti della piattaforma di destinazione: la guida di Netflix per l'inglese, ad esempio, consente 42 caratteri per riga e 20 caratteri al secondo per i programmi destinati agli adulti. ## Previous and next questions - Previous question: [Come si traducono i titoli SEO e le meta description?](https://generaltranslation.com/it/kb/translate-seo-metadata.mdx) - Next question: [Cosa sono i codici locale, come en-US ed en-GB?](https://generaltranslation.com/it/kb/locale-codes.mdx) ## Sitemap See the [Knowledge Base sitemap](https://generaltranslation.com/it/kb/sitemap.md) for every article.