How Netflix scales their UI design as it expands to 26 languages

Photo credit: freestocks.org / Unsplash

In the past eight years, Netflix has transformed from an English-only product to now supporting 26 languages—and counting. As we add language support for members in 190 different countries, scaling globalization has never been more important.

Along the way, we’ve built out countless solutions to help us achieve globalization at scale. In this article, we’ll focus on one that my team has been working on: pseudo localization.

The problem

The problem we set out to solve was simple: Expansion of text (due to translation) causes most of the UI layout issues we detect during localization testing.

When translating into other languages, the translated text could be up to 40 percent longer than the English version. This is more prevalent in German, Hebrew, Polish, Finnish, and Portuguese.

Take this real-world example from our German UI :

Don’t miss out.

Translated into German, this becomes much longer:

Lassen Sie sich nichts entgehen!

In a UI context, we see problems:

This is one example among many. The source of the problem is that our UIs are designed in English and assume English string lengths, line heights, and glyphs. More often than not, translating those strings will lead to expansion that causes layout issues.

When the product is translated into 26 languages, like ours is, you potentially end up with 26 defects that need to be logged, managed, and resolved; all the while we had the opportunity to fix the issue at the English design phase, before translation even started.

The solution

Under the hood

Implementation was only half the battle

Learnings

What’s next?