← Back

Frame Translator

Figma plugin for automated app store screenshot localization

Frame Translator overview

Context

Co-founder at 14x, an app studio shipping multiple consumer apps. We built Frame Translator in a single day using Claude Code as a speed and quality amplifier.

The Problem

At 14x, every app we ship gets localized into 40+ languages across both Google Play and the App Store. That means creating translated screenshots for each store, for each language, and each store has its own set of supported locales with different codes and naming conventions.

Before this tool, the process was: manually translate each text string, duplicate the Figma frame, paste in the translation, check that text still fits the layout, repeat. For a single app with 8-10 frames across 2 stores, that's ~480 frames to produce manually. It was taking hours per app.

The Solution

A Figma plugin that automates the entire localization workflow for app store screenshots. Select frames, the plugin detects the source language automatically from the frame name. Choose target languages filtered by store (Google Play vs. App Store vs. all). One click: AI translates all text, duplicates frames with correct locale-specific naming, and auto-fits text to maintain the original layout.

Font-size fitting algorithm. A binary search that finds the largest font size where translated text still fits within the original bounding box. Works with mixed-size text, handles all of Figma's auto-resize modes. This is what makes Japanese, Ukrainian, and German all render correctly without breaking the design.

Store-aware locale system. Google Play and Apple App Store have different supported locale sets with different code formats (zh-CN vs zh-Hans, iw-IL vs he). The plugin maps between them and generates frame names using the exact code each store expects.

Frame Translator plugin in action in Figma
The plugin translating frames across 40+ locales in Figma

Outcomes

4-8 hours saved per app launch on screenshot localization. Enabled 40+ language localization that we simply wouldn't have attempted manually. Internal tool that directly unblocks the studio's multi-market launch strategy.

Learnings

  • Build tools for your own workflow first. The best internal tools come from feeling the pain acutely.
  • Text layout is deceptively hard. Languages expand and contract unpredictably. The binary-search fitting approach was the breakthrough that made all 40+ languages work without manual adjustment.
  • AI as a craft amplifier, not a replacement. The design decisions are the product work. AI handled the implementation volume.

Timeline

Feb 2026 - 1 day

Stack

TypeScriptFigma Plugin APIGeminiOpenAI

Responsibilities

  • Full plugin architecture
  • Font-size fitting algorithm
  • Multi-provider AI integration
  • Store-aware locale system