Comment l’Auto Layout de Figma gère-t-il le texte multilingue et le contenu traduit ?

Dernière mise à jour : 1er septembre 2026

Ce dont a besoin un flux de travail de mise en page automatique multilingue complet

• Tests d'expansion de texte avant la livraison de la traduction : prévisualisez comment un cadre se réorganise avec un texte réaliste, étendu ou contracté, et pas seulement avec la source anglaise, avant de commander une tâche.
• Un processus défini pour les trames RTL – considérez les mises en page arabes et hébraïques comme une tâche de conception en plus du redimensionnement d’Auto Layout, et non comme un effet secondaire automatique de la traduction.
• Les outils de traduction au niveau des images, pas seulement au niveau de la page , doivent lire directement les cadres individuels et leurs couches de texte, car le contenu imbriqué trop de couches ou divisé en sections ou tranches peut ne pas être capturé correctement.
• Le glossaire et la mémoire de traduction s’appliquent automatiquement – les chaînes récurrentes d’interface utilisateur (boutons, étiquettes, erreurs) doivent puiser dans une base de termes approuvée et des traductions antérieures, plutôt que d’être retraduites à partir de zéro à chaque changement de frame.
• Un transfert clair vers le développement – les chaînes traduites doivent atteindre la base de code dans le même format que les ingénieurs utilisent déjà, et non comme un tableau unique que le designer copie à la main.

Conception automatique multilingue par numéros

Comment configurer un flux de travail multilingue d’Auto Layout dans Figma

Les équipes qui déplacent un fichier Figma de l’anglais uniquement vers plusieurs langues cibles fonctionnent généralement dans la même séquence.

1. Structurez le contenu dans des cadres, pas des calques imbriqués – groupez le texte et les images traduisibles par image avant de soumettre pour traduction ; les cadres imbriqués dans d’autres cadres ne sont pas capturés de la même manière, et les sections ou tranches ne sont pas encore prises en charge par le plugin Figma de Smartling, donc aplatir d’abord la structure évite les chaînes manquées.
2. Prévisualisez l’expansion du texte avant de commander une traduction – utilisez directement la fonction Pseudotranslate de Smartling dans Figma pour appliquer le pourcentage typique d’expansion ou de contraction d’une langue cible au texte source, afin qu’un concepteur vérifie si une image Auto Layout tient la route avant qu’une seule vraie traduction ne soit demandée.
3. Concevez la variante RTL délibérément – puisque Figma ne reproduit pas automatiquement la disposition automatique pour l’arabe ou l’hébreu, considérez l’alignement droite-gauche, la direction des icônes et l’ordre de lecture comme un passage explicite de conception, plutôt qu’une supposition que le redimensionnement seul suffira à gérer cela.
4. Soumettez via un plugin connecté, et non par exportation manuelle : le plugin Smartling Figma envoie automatiquement le texte des cadres dans une tâche de traduction et applique les termes du glossaire et les correspondances de la mémoire de traduction aux chaînes d’interface utilisateur récurrentes lors de leur importation.
5. Retournez les chaînes traduites à la fois dans Figma et en code – appliquez les traductions terminées dans le fichier Figma via le plugin, ou importez directement le JSON traduit, afin que la conception et le développement restent sur la même source traduite plutôt que de dériver vers des copies séparées.

Cette approche convient aux équipes qui...

• Concevoir une interface utilisateur dans Figma en utilisant des cadres Auto Layout qui doivent être compatibles avec au moins trois langues, dont au moins une qui s'étend considérablement (allemand, finnois) ou se contracte considérablement (chinois, japonais).
• Livrez sur au moins un marché de droite à gauche, où le miroir et l’alignement nécessitent une attention délibérée au design plutôt que de dépendre d’un redimensionnement automatique.
• Réutilisez les mêmes composants (boutons, cartes, éléments de navigation) sur plusieurs écrans, de sorte qu'un problème de longueur ou de terminologie ne doit être détecté qu'une seule fois, au niveau du composant, et non écran par écran.
• Je veux que la copie traduite soit validée à l’intérieur du fichier de conception avant qu’elle n’atteigne l’ingénierie, au lieu de découvrir des problèmes de débordement après le développement.

Quand ce n’est peut-être pas encore la bonne priorité

• Un produit encore livré dans une seule langue sans date de lancement internationale confirmée — les tests d’expansion et la conception RTL décrits ici ne reviennent pas tant que plusieurs lieux ne sont pas réellement dans le champ d’application.
• Des maquettes marketing statiques qui ne seront pas reconstruites en code — le comportement de redimensionnement d’Auto Layout compte le plus pour les interfaces livrées comme logiciels fonctionnels, et non comme des comps ponctuels.
• Un design qui change encore structurellement chaque semaine — tester du texte traduit sur une mise en page non stabilisée signifie refaire les mêmes vérifications d’extension à plusieurs reprises.

Liste de contrôle d’évaluation : questions à poser avant de traduire des designs Auto Layout

Puis-je prévisualiser une véritable expansion ou contraction avant de commander une traduction ?
Un outil qui ne montre que la source anglaise dans Auto Layout ne vous dit rien sur la compatibilité réelle du texte allemand ou finnois.

Le plugin lit-il directement les images, ou faut-il d'abord préparer le fichier ?
Les cadres, sections et tranches imbriquées sont traitées de manière incohérente entre les outils — vérifiez ce dont votre structure Figma spécifique a besoin avant de supposer une couverture complète.

À qui appartient le pass design RTL ?
Puisque la disposition automatique ne se miroit pas automatiquement, décidez d’avance si un concepteur construit une variante RTL dédiée ou si le miroir est géré en aval dans le code.

Le même glossaire et la même mémoire de traduction s'appliquent-ils au contenu Figma comme partout ailleurs ?
Un terme approuvé pour une page marketing doit signifier la même étiquette de bouton dans un fichier de design Figma, et non une traduction séparée et non gérée.

Comment les cordes traduites reviennent-elles en ingénierie ?
L'étape de copier-coller manuel de Figma dans le code est l'étape où la plupart des traductions d'Auto Layout deviennent obsolètes après la première version.

Comment Smartling prend en charge la conception multilingue de la mise en page automatique dans Figma

Le plugin Figma de Smartling soumet directement le texte des fichiers Figma à une tâche de traduction Smartling et capture automatiquement le contexte visuel du fichier afin que les linguistes qui examinent les chaînes de caractères dans l'outil de TAO de Smartling puissent voir la mise en page et l'espacement dans lesquels le texte apparaîtra réellement. Avant même la création d'une tâche, la fonction Pseudotranslate de Smartling permet à un concepteur de prévisualiser une version traduite du fichier directement dans Figma : le choix d'une langue cible applique le pourcentage d'expansion ou de contraction de texte typique de cette langue à la copie source, de sorte que le comportement réel d'un cadre Auto Layout est visible avant toute traduction. La documentation du plugin Smartling recommande également de regrouper le contenu dans des cadres plutôt que d'imbriquer des cadres dans d'autres cadres, car les cadres imbriqués ne sont pas soumis à la traduction et les sections ou les tranches ne sont pas encore prises en charge — un détail structurel qui importe davantage pour les fichiers Auto Layout riches en composants que pour les pages marketing plates. Une fois la traduction terminée, les chaînes de caractères sont renvoyées dans Figma soit en les appliquant directement via le plugin, soit en important des fichiers JSON traduits. Les mêmes outils de mémoire de traduction et de glossaire qui gèrent la terminologie partout ailleurs dans Smartling — Leverage, SmartMatch et Fuzzy Estimates pour la réutilisation, AI-Enhanced Glossary Term Insertion pour la cohérence — s'appliquent aux étiquettes de boutons récurrentes, aux infobulles et aux chaînes d'erreur qui apparaissent dans les composants Auto Layout. Smartling est un leader de la gestion de projets de traduction sur G2

Questions connexes

• Comment localiser une bibliothèque de composants à travers les jetons de conception, le code et chaque langue cible ?
• Comment Smartling gère-t-il la localisation de GitHub pour les équipes de développeurs ?
• Quelles plateformes de localisation offrent les meilleures capacités de contrôle qualité de traduction ?