Posts tagged "OOBE"

Using system fonts in Flex based applications

This article was originally written in English. Text in other languages is provided via machine translation.

When working with Flash based applications, there are issues with fonts since the specified fonts might not exist on the user machine. The problem is compounded when you have international users each of whom might be working on multiple operating systems (Windows, Mac), multiple versions (Win XP, Win7, Win8, Mac 10.6, and Mac 10.7), multiple locales (French, Italian, Spanish, Russian etc) and thus having different available system fonts. One option to streamline the experience would be to embed fonts – entire fonts or specific subset of characters from a font. The other option would be to use the operating system’s default fonts.

Adobe’ installer and licensing components (which goes out with Master Collection and almost all point products like Photoshop, InDesign, and Illustrator) uses the later approach. The component identifies user’s locale from OS locale and then picks up a font from a prioritized list of pre-defined list of fonts for that locale. The font specification file has been externalized so that any future changes around font names could be easily verified and accommodated without making a code change. Further the list has been segregated based on font fall-back for text appearing in software UI and for text fields in the application.

The list of fonts for each locale is listed towards the end of this blog post. Getting to this list has not been an easy task and there has been a huge effort from multiple teams for this. Some of the hurdles that the team had to clear were –

  1. Getting an exhaustive set of fonts used in each locale and OS
  2. Segregating the fonts according to UI and Text fall-back
  3. Putting those fonts and fall-back logic together in an xml file
  4. Identifying the font’s priority so that same logic works across all OS platforms and versions
  5. Working with linguists to test each screen with applied fonts for readability and aesthetics
  6. Iterating #3 and #4 based on linguist’ response and ultimately arriving at final font fall-back xml file
Locale UI Font Fall-back Text Field Font Fall-back
Japanese Hiragino Kaku Gothic ProN W3, Hiragino Kaku Gothic Pro W3, Meiryo UI, Meiryo, MS UI Gothic, MS Gothic, _sans Hiragino Kaku Gothic ProN W3, Hiragino Kaku Gothic Pro W3, Meiryo, MS Gothic, _sans
Korean AppleGothic Regular, Malgun Gothic, New Gulim, Gulim, _sans AppleGothic Regular, Malgun Gothic, New Gulim, Gulim, _sans
Chinese Traditional Heiti TC Light, Lihei Pro, Microsoft JhengHei, MingLiU, MingLiU_HKSCS, _sans Heiti TC Light, Lihei Pro, Microsoft JhengHei, MingLiU, MingLiU_HKSCS, _sans
Chinese Simplified Heiti SC Light, STXihei, Microsoft YaHei, SimSun-18030, SimHei, SimSun, MS Song, _sans Heiti SC Light, STXihei, Microsoft YaHei, SimSun-18030, SimHei, SimSun, MS Song, _sans
Russian, Ukrainian Lucida Grande, MS Sans Serif, _sans Lucida Grande, MS Sans Serif, _sans
All others * Lucida Grande, Segoe UI, Tahoma, _sans Lucida Grande, Segoe UI, Tahoma, _sans

All others include French, German, Spanish, Italian, Brazilian Portuguese, Netherlands, Swedish, Danish, Finnish, Norwegian, Czech, Polish, Turkish, Hungarian, Romanian, Slovenian, Slovak, and Croatian.
P.S: These font fall-backs were defined and tested for Flex 4.5.1 SDK with Spark components (using TLF, Text Layout Framework)

One caveat to note here is that system fonts keep changing from time to time, which usually amounts to new fonts, or new versions of existing fonts, but sometimes results in existing fonts becoming deprecated. In general, though, linguistic support in OSes, in terms of glyph coverage in bundled fonts, gets better, not worse.