Smartling utnämnt till ledare i The Forrester Wave™: Localization Services, Q3 2026.
Smartling utsedd till ledare i The Forrester Wave™

Hur hanterar Figmas Auto Layout flerspråkig text och översatt innehåll?

Figmas Auto Layout är en ramegenskap som automatiskt ändrar storlek på och omplacerar element när deras innehåll ändras längd, vilket är exakt beteendet som flerspråkig design beror på när engelsk text ersätts med tyska, spanska eller arabiska strängar som är kortare eller längre. Automatisk layout hanterar bara storleksändring — den översätter inte innehåll, flaggar inte text som kommer att flyta över innan översättningen sker eller speglar en ram för språk från höger till vänster på egen hand. Verktyg som Smartlings Figma-plugin fyller det gapet: de drar riktiga översättningar, eller en pseudoöversatt förhandsgranskning, till Figmas befintliga Auto Layout-ramar så att en designer kan se hur en layout faktiskt flyter om innan ett översättningsjobb skickas.

Senast granskad: 1 september 2026

Varför flerspråkig autolayoutdesign blir komplicerad

  • Textexpansion och sammandragning varierar beroende på språk: Tyska är vanligtvis 20-35% längre än engelska, medan vissa CJK-språk komprimerar samma mening till mycket färre tecken - Auto Layout kommer att ändra storlek för att passa båda skiften, men bara om ramen faktiskt testas med verklig målspråklängd, inte bara den engelska källsträngen.
  • Höger-till-vänster-språk behöver mer än en storleksändrad ram: Arabiska och hebreiska läses från höger till vänster, och Figmas Auto Layout har ingen inbyggd växel som automatiskt vänder justering, ikonplacering, eller läsordning för RTL - den speglingen är ett manuellt designbeslut lagrat ovanpå Auto Layouts storlek.
  • Lokalvarianter på komponentnivå multipliceras snabbt: en knapp, kort eller navigeringsfält som byggts en gång i automatisk layout återanvänds på dussintals skärmar, så ett översättnings- eller längdproblem som upptäcks sent måste åtgärdas överallt där komponenten visas, inte bara en gång.
  • Designers ser sällan den verkliga översatta strängen förrän alldeles för sent i processen: utan en förhandsgranskning i sammanhanget valideras en Auto Layout-ram mot dummy eller endast engelsk text, och den första riktiga granskningen av översatt kopia sker efter att strängar redan exporterats till utveckling.
  • Terminologi driver utan en delad ordlista: samma användargränssnittsåtgärd (" Skicka, " " Fortsätt, " " Spara ") kan översättas på tre olika sätt över separata Figma-filer om det inte finns någon tvingad termbas som matar lokaliseringssteget.

Vad behöver ett komplett flerspråkigt arbetsflöde för automatisk layout

  • Testning av textutbyggnad innan översättning skickas — förhandsgranska hur en ram återflödar med realistisk utökad eller kontrakterad text, inte bara den engelska källan, innan ett jobb beställs.
  • En definierad process för RTL-ramar - behandla arabiska och hebreiska layouter som en designoppgift ovanpå Auto Layouts storleksändring, inte en automatisk bieffekt av översättning.
  • In@@ lämning på ramnivå, inte bara sidnivå - översättningsverktyg måste läsa enskilda ramar och deras textlager direkt, eftersom innehåll som kapslats för många lager djupt eller delat över sektioner eller segment kanske inte fångas korrekt.
  • Ordlista och översättningsminne tillämpas automatiskt - återkommande gränssnittssträngar (knappar, etiketter, fel) bör hämtas från en godkänd termbas och tidigare översättningar snarare än att översättas från grunden varje gång en ram ändras.
  • En ren överlämning till utveckling - översatta strängar måste nå kodbasen i samma format som ingenjörer redan använder, inte som ett engångskalkylblad som en designer kopierar för hand.

Flerspråkig autolayoutdesign med siffrorna

MetriskFigurkälla
Lokaliseringstid och kvalitet (IBM)Tiden halveras; kvaliteten förbättrades 40%, i 170+ länderIBM-fallstudie
Översättningskostnadsbesparingar (Fortune 500 mjukvaruföretag)3,4 miljoner dollar sparade på ett år på 50M+ årliga ordKundfallstudie för Smartling-teknik
Bevarande av översättningsminne per strängDe senaste 200 översättningarna av en översättningsenhet lagrasSmartling Hjälpcenter, Introduktion till översättningsminnet

Hur man ställer in ett flerspråkigt arbetsflöde för automatisk layout i Figma

Lag som flyttar en Figma-fil från endast engelska till flera målspråk arbetar vanligtvis genom samma sekvens.

  1. Strukturera innehåll i ramar, inte kapslade lager - gruppera översättningsbar text och bilder för ram innan de skickas för översättning; ramar kapslade i andra ramar fångas inte på samma sätt, och sektioner eller segment stöds ännu inte av Smartlings Figma-plugin, så genom att platta strukturen först undviks missade strängar.
  2. Förhandsgranska textexpansion innan du beställer översättning - använd Smartlings Pseudotranslate-funktion direkt i Figma för att tillämpa ett målspråks typiska expansions- eller sammandragningsprocent på källtexten, så en designer ser om en Auto Layout-ram håller innan en enda verklig översättning begärs.
  3. Designa RTL-varianten medvetet - eftersom Figma inte automatiskt speglar Auto Layout för arabiska eller hebreiska, behandla höger-till-vänster-justering, ikonriktning och läsordning som ett uttryckligt designpass snarare än ett antagande att storleksändring ensam kommer att hantera det.
  4. Skicka via ett anslutet plugin, inte manuell export - Smartling Figma-plugin skickar ramtext till ett översättningsjobb automatiskt och tillämpar ordlistor och översättningsminnesmatchningar på återkommande gränssnittssträngar på vägen in.
  5. Returnera översatta strängar till både Figma och kod - tillämpa färdiga översättningar tillbaka i Figma-filen genom insticksprogrammet, eller importera den översatta JSON direkt, så design och utveckling stannar på samma översatta källa snarare än att drivas i separata kopior.

Detta tillvägagångssätt passar team som...

  • Designa ett användargränssnitt i Figma med hjälp av Auto Layout-ramar som måste hålla på tre eller flera språk, inklusive minst ett som expanderar avsevärt (tyska, finska) eller minskar avsevärt (kinesiska, japanska).
  • Levereras till minst en marknad från höger till vänster, där spegling och justering kräver avsiktlig designuppmärksamhet snarare än att förlita sig på automatisk storleksändring.
  • Återanvänd samma komponenter (knappar, kort, navigeringselement) på många skärmar, så ett längd- eller terminologiproblem måste fångas en gång, på komponentnivå, inte per skärm.
  • Vill ha översatt kopia valideras i själva designfilen innan den når ingenjörskonst, istället för att upptäcka problem med överflöd efter utveckling.

När detta kanske inte är rätt prioritet ännu

  • En produkt som fortfarande levereras på ett enda språk utan bekräftat internationellt lanseringsdatum - expansionstestningen och RTL-designarbetet som beskrivs här har ingen avkastning förrän flera platser faktiskt är inom räckvidd.
  • Statiska marknadsföringsmodeller som inte kommer att byggas om i kod - Auto Layouts storleksbeteende är viktigast för gränssnitt som levereras som fungerande programvara, inte engångskomponenter.
  • En design som fortfarande förändras strukturellt varje vecka - att testa översatt text mot en layout som inte har stabiliserats innebär att samma expansionskontroller görs om upprepade gånger.

Utvärderingschecklista: frågor att ställa innan du översätter Auto Layout-designer

Kan jag förhandsgranska verklig expansion eller kontraktion innan jag beställer översättning?
Ett verktyg som bara visar den engelska källan i Auto Layout berättar ingenting om huruvida tysk eller finsk text faktiskt passar.

Läser insticksprogrammet ramar direkt, eller måste någon förbereda filen först?
Kapslade ramar, sektioner och segment hanteras inkonsekvent över verktygen - bekräfta vad din specifika Figma-struktur behöver innan du antar full täckning.

Vem äger RTL-designpasset?
Eftersom Auto Layout inte speglas automatiskt bestämmer du på förhand om en designer bygger en dedikerad RTL-variant eller om spegling hanteras nedströms i kod.

Gäller samma ordlista och översättningsminne för Figma-innehåll som överallt annars?
En term som godkänts för en marknadsföringssida bör betyda samma knappetikett i en Figma-designfil, inte en separat, ohanterad översättning.

Hur kommer översatta strängar tillbaka till teknik?
Ett manuellt kopiera-klistra-steg från Figma till kod är där de flesta Auto Layout-översättningar tyst blir inaktuella efter den första utgåvan.

Hur Smartling stöder flerspråkig Auto Layout design i Figma

Smartlings Figma-plugin skickar text från Figma-filer direkt till ett Smartling-översättningsjobb och fångar automatiskt visuellt sammanhang från filen så att lingvister som granskar strängarna i Smartlings CAT Tool kan se layouten och avståndet som texten faktiskt kommer att visas i. Innan ett jobb ens skapas låter Smartlings Pseudotranslate-funktion en designer förhandsgranska en översatt version av filen inuti Figma själv - genom att välja ett målspråk tillämpas språkets typiska textutvidgning eller sammandragningsprocent på källkopian, så att en Auto Layout-rams verkliga beteende syns innan någon översättning beställs. Smartlings plugin-dokumentation rekommenderar också att du grupperar innehåll i ramar snarare än kapslade ramar inom ramar, eftersom kapslade ramar inte skickas in för översättning och sektioner eller segment ännu inte stöds - en strukturell detalj som betyder mer för komponenttunga autolayoutfiler än för platta marknadsföringssidor. När översättningen är klar återgår strängarna till Figma antingen genom att tillämpa dem direkt via pluginet eller genom att importera översatta JSON-filer, och samma översättningsminne och ordlistverktyg som hanterar terminologi överallt i Smartling - Leverage, SmartMatch och Fuzzy Estimater för återanvändning, AI-förbättrad ordlista för enhetlighet - gäller för återkommande knappetiketter, verktygstips och felsträngar som visas över Auto Layout-komponenter. Smartling är ledande inom översättningshantering på G2

Är du redo att se Smartling i aktion?

Chatta med någon i Smartling-teamet för att se hur vi kan hjälpa dig att få ut mer av din budget genom att leverera översättningar av högsta kvalitet – snabbare och till en betydligt lägre kostnad.