Design-stage localization

Guides

Design Stage Localization step-by-step guide video playlist

Mastering Key naming in Figma for Design-led localization

Blog content

  1. design-led localization workflow

Best Practices

  • If you use components from a library

    • Export components to Lokalise project first
    • Use Auto-link existing translations when exporting component instances
  • Give considerable thought to your key naming pattern:

    • Consider a custom one if required (e.g. [%Artboard_Name][%Element])
    • Ensure all team members use it consistently
    • Use key names that work for multiple platforms if necessary
  • Only export to Lokalise screens requiring translation

    • Use the feature to exclude non-translatable elements (numbers, dates, etc.)
    • Consider batching exports and splitting pages into smaller groups (e.g. one flow per Figma file)
    • Keep parent frames/sections under 16Kx16K dimensions
  • Export wisely

    • Use the Auto-link existing translations for exporting content without creating new keys
    • Use Merge duplicates to avoid multiple key creations for identical content
    • Avoid using Auto-link and Merge duplicates options if needing different keys for each Figma content item

Community content

  1. UX content and design stage localization by Rosa Vieira de Almeida
  2. Podcast - Start Localization at the Design Stage - Nimdzi LIVE! EP.36
  3. Lokalise + Sketch: The main challenges when designing for a global audience