Frame Translator

Co-fondateur de 14x, un studio d'applications qui lance de multiples applications grand public. Nous avons développé Frame Translator en une seule journée en utilisant Claude Code comme accélérateur de vitesse et de qualité.

Chez 14x, chaque application que nous lançons est localisée dans plus de 40 langues, à la fois sur Google Play et l'App Store. Cela implique de créer des captures d'écran traduites pour chaque store et pour chaque langue. De plus, chaque store possède sa propre liste de locales supportées avec des codes et des conventions de nommage différents.

Avant cet outil, le processus était le suivant : traduire manuellement chaque chaîne de texte, dupliquer la frame Figma, coller la traduction, vérifier que le texte s'intègre toujours dans la mise en page, puis recommencer. Pour une seule application avec 8 à 10 frames sur 2 stores, cela représente environ ~480 frames à produire manuellement. Cela prenait des heures par application.

Un plugin Figma qui automatise l'ensemble du workflow de localisation pour les captures d'écran des stores. Vous sélectionnez les frames, le plugin détecte automatiquement la langue source à partir du nom de la frame. Vous choisissez les langues cibles filtrées par store (Google Play, App Store ou tous). En un clic, l'AI traduit tout le texte, duplique les frames avec le bon nommage spécifique à la locale et ajuste automatiquement le texte pour conserver la mise en page d'origine.

Algorithme d'ajustement de la taille de police. Une recherche dichotomique qui trouve la plus grande taille de police permettant au texte traduit de tenir dans la boîte englobante d'origine. Il fonctionne avec des textes de tailles mixtes et gère tous les modes de redimensionnement automatique de Figma. C'est ce qui permet au japonais, à l'ukrainien et à l'allemand de s'afficher correctement sans casser le design.

Système de locales spécifique aux stores. Google Play et l'Apple App Store ont des ensembles de locales supportées différents avec des formats de code distincts (zh-CN contre zh-Hans, iw-IL contre he). Le plugin fait la correspondance entre eux et génère les noms de frames en utilisant le code exact attendu par chaque store.

4 à 8 heures gagnées par lancement d'application sur la localisation des captures d'écran. Cela a permis une localisation dans plus de 40 langues que nous n'aurions tout simplement pas tentée manuellement. C'est un outil interne qui débloque directement la stratégie de lancement multi-marchés du studio.

• Créez d'abord des outils pour votre propre workflow. Les meilleurs outils internes naissent d'un besoin ressenti de manière aiguë.
• La mise en page du texte est trompeusement complexe. Les langues s'allongent et se contractent de manière imprévisible. L'approche d'ajustement par recherche dichotomique a été la percée qui a permis de faire fonctionner plus de 40 langues sans ajustement manuel.
• L'AI comme amplificateur de savoir-faire, et non comme remplaçant. Les décisions de design constituent le véritable travail sur le produit. L'AI s'est chargée du volume d'implémentation.