Adobe Flash – Content Creation & Localization Guidelines

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

1. Purpose of this document
This blog is an outcome of an extensive study undertaken to identify best practices in localization of Flash based content.

Localizing structured content through translation management tools (like SDL WorldServer) can be a simple process. However unstructured content like text appearing in Flash videos is not easy. To add to it, tracking the efficiency of the linguistics becomes all the more difficult for unstructured content.

The blog covers all aspect of Flash localization including creating the English content the right way; so that it becomes localization “friendly”. This should result in cost and time savings; which is multiplied by the number of target languages should yield sufficient dividends.

2. Extraction of Text from a Flash animation

The difficulty of Flash animation localization depends on the globalization level of source – usually English Flash animations. During the localization process, all localizable text is extracted from the source animation, replaced by localized versions and localized strings are modified according to the style guides- including choice of font size, family etc. Occasionally localizable text is not included in the text layers but presented as graphics. Therefore the source animation has to be fixed in the first place to have it ready for localization. As a first step of Flash animation localization is to extract all localizable text from the animation. This is possible by using commercial tools such as “Flash Localization Tool” or renaming source .fla file to the .zip archive (just change extension from .fla to .zip) and extracting all .xml files from “LIBRARY” subfolder of the .zip. See Figure 1 and Figure 2 for more details.


Figure 1 – list of Flash archive with LIBRARY subfolder

Figure 2 – list of text layers in .xml format stored in the LIBRARY subfolder of a Flash archive

Flash native format is a zip archive with defined structure. Having a baisc knowledge of it enables one to easily extract all text layers from the animation. Once done, the only task remains to locate the text within the extracted .xml files and provide the translators with .ini file (if the translation is to be completed by using Trados CAT). Text layers in .xml files can be found surrounded by <characters>Your text</characters> XML tags.
The XML stores the information about font size, family and style (besides storing the localizable text). Most of this information like font family can be easily modified for all text if source font does not support the target language alphabet. For more details about Flash XML file please see Figure 8.

Best Practice # 1:
Never modify texts within text layers with help of action script. It will be difficult to understand script.

3. Pseudo localization
“Pseudo localization” is a process to ensure the animation is ready for localization and all localizable texts is in the text layers only. During this process all strings currently contained in text layers (.xml files) are replaced by pre-defined string, e.g. by “X”. Original .xml files in the LIBRARY subfolder are replaced by modified ones and when this action is completed, render.swf should be played back in Flash player. By playing these renders it is possible to locate any remaining text which was not pseudo localized for various reasons.
Text originally present in the text layers is displayed as “X” in this render. In case there is still any readable text it usually comes from embedded video, graphics or an action script. One can find example of pseudo localization in Figure 3, Figure 4 and Figure 5.

Figure 3 – Example of pseudo localization. All strings except “What’s new” were changed to “X”. “What’s new” is a graphics in Flash animation and thus can’t be easily edited.

Figure 4 – Same screenshot as in Figure “3″ but now localized into Russian. As you can see also “What’s new” is correctly localized. In this case source was fixed and localizable graphical texts were updated to text layers.

Figure 5 – Another example of pseudo localization. Displayed asset is a screenshot from an application and the only editable text is in the upper right corner. In this specific case, it was decided NOT to fake it and leave it in English as the font size was too small

Best Practice # 2:
Apply Pseudo localization to find out any localizable text whichis not in text layers within Flash project. If your project has been globalized ever since the ideal way, pseudo localization can be skiped.

 

4. Text layers in Flash animation
There are many ways to insert text into Flash animation. For example, avoid inserting graphical text (letters as graphical objects) and work with text layers only. If this is the case, DO NOT break text into multiple strings, and keep it in one string only, unless specifically required. Any separation in multiple substrings will result intext segmentation inside .xml file and can lead to loss of context during translation and thus incorrect localization of it’s substring.
In Figure 6 and Figure 7, one can find text “Loyal customers like you save with special upgrade pricing. Adobe Photoshop Elements & Adobe Premiere Elements is now a perfect 10!”
This sentence is separated into two different text layers. Such separation will result into segmentation of strings in the .xml file as well and translator will see them as two separated strings without any relationship between them, see Figure 8.

Figure 6 – “Loyal customers like you save with special upgrade pricing. Adobe Photoshop Elements & Adobe Premiere Elements is now a perfect 10!” text separation into two substrings. On this figure, the first part is visible.

Figure 7 – Second part of text “Loyal customers like you save with special upgrade pricing. Adobe Photoshop Elements & Adobe Premiere Elements is now a perfect 10!”

Figure 8 – Representation of substrings in the .xml file. Every substring is enclosed in the <DOMStaticText> tag inside .xml file.

It is not recommended to split a string into shorter substrings but rather keep them in one text layer whenever possible. Advantages of this approach are:
1. Localized string is well ordered so that localized substrings do not need to be reviewed by native speaker after localization and postprocess.
2. String is not divided into shorter substrings inside .xml file.
Today’s version of Flash allows authors to keep strings with different font family, color, style, size etc. in one text layer. Additionally, there is no need to separate them into several text layers. Keeping source strings in one text layer helps translators and localization engineers to spend less time on translation and post-processing of localized strings in the animation. It also decreases the chance of issues related to word order. In Figure 9 you can find example of complex string (part of the text is in yellow with bigger font) in one text layer.

Figure 9 – Complex string in one text layer only. There is no need to put text in yellow into a separate text layer. With today’s Flash you can create such complex strings.

Best Pratice #3:
Keep the number of text layers within Flash project as low as possible. If any text formatting is required, do it only one text layer (as much as possible).

 

5. Embedded Videos
Many a times, Flash animations may contain embedded videos. These embedded videos can be easily found in Flash object library under “Embedded Video” type, please see Figure 10.
If there are any segments to be localized within embedded videos and only the render has been provided, it will be very difficult and time consuming to localize such strings. In special cases, when the video is carefully analyzed, some text can be “faked“ with small effort.
However, animated text (Figure 11) or static one with moving background is almost impossible to edit and in order to localize this type of source it is necessary to spend many hours to fake just one or two seconds of the final render. The source simply needs to be re-created which increases the effort manifold.
With editable video project file one can modify all text layers inside embedded video and prepare localized versions of those videos.

Figure 10 – Embedded video “soccer.flv” with animated localizable string

Figure 11 – Example of localizable text within the embedded video impossible to fake, text is animated

Best Practice #4:
Embedded videos with localizable texts within Flash project increase the time and effort for localization manifold.
The best way to do is extract all text from Video, localize it, replace all localizable texts and create localized render first. Without editable video file, the only (harrowing) option is to try to fake text within embedded video, which is usually impossible. So DO NOT embed text/assets in videos if you want to localize it. Provide assets and video separetely instead.

6. Screenshot Animations
One can also create an animation inside the Flash project from a series of screenshots. See example of screenshots series in Figure 12 and Figure 13. Text in the screenshots are localizable ones and a source .psd with editable text layer needs to be created initially. Once completed and the text is replaced with a localized version, screenshooting of the localized series can be carried out.
If you have source editable .psd available, please provide it to your localization engineer. Moreover, text effects used in the localized Flash will be identical with those in the source Flash.

Figure 12 – Screenshot series. You can see both preview of the screenshot and also sequence of screenshots in the Flash timeline

Figure 13 – End of the screenshot series in the Flash animation. Text “The Big …” is animated within the series and every screenshot adds one letter of the text into the animation.

Best Practice#5: For any localizable text within a graphics (graphical text), it is important to provide source English assets. If source editable asset is not provided, it has to be re-created by localization vendor first to be able to replace text by a localized version and create render for Flash project. During re-creation of editable source asset some effects can be overseen and hence missed in localized version.

 

7. Buttons & Active Layers
It is vital to keep all buttons with localizable texts as “Movie Clip” type in the Flash project and not to use mixture of different Flash types to simulate button functionality. If button functionality consists of more Flash types, it is very likely that during post processing, the engineers may unintentionally use incorrect alignment of these objects in relation to each other inside certain frame. As a result, this will lead to a functional impact on the flash file, and in some cases, rending it corrupt
An example of corrupted button is described in Figure 14. Here the button consists of graphical text in the yellow box and active layer (shown as a blue frame) which plays role of “clickable” area. You may observe that the box is not aligned with active layer and the left side of this button will not be clickable. Additionally, right side contains an overlapped area which is active which is not correct.

Figure 14 – Corrupted button “What’s new”. Active layer (blue frame) is not aligned with yellow box.

Creating buttons as “Movie clip” will avoid similar issues in Flash animations. Sometimes, modification of assigned action script is required as well.

Best Practice #5:
Active layers outside of button in Flash can lead into misalignment within localized version of Flash. It requires once to resize button and active layer objects with every change in the no. of text characters in the button. Buttons created correctly eliminate potential misalignment risks and decrease the number of button re-sizings by a significant number.

 

8. Flickering
In some Flash players, localized text can exhibit “Flickering“ effect i.e., text is moved by one or a few pixel to left, right, up or down when the cursor is hovered over it. See Figure 15 for more details.

Figure 15 – Flickering in detail – the image is composed from two screenshots of the same part re-captured after few seconds later to see one pixel position changes

The only way how to fix the „Flickering“ issue is to convert text layers within localized Flash project into curves and render into final format. Graphical text (curves) doesn’t show the “Flickering“ effect any more

Best Practice #6:
Flickering effect is visible in some players only. It is recommended to use Flash players without Flickering effect. Otherwise, localized text layers have to be converted into curves before rendering into final format. When multiplied by number of target languages, effort will turn out to be huge.

 

9. Acknowledgements/Credits

This document was prepared from an independent study done in Photoshop Elements 11 by Jakub Škrabal & Petr Knápek from Moravia, and Akulaa Agarwal & Manish Kanwal from Adobe.

Please note that it can be applied to any Adobe/Non Adobe projects requiring localization of text and other assets in Flash files. For any questions, please feel free to reach out to Akulaa Agarwal(akulaa@adobe.com) and Manish Kanwal (mkanwal@adobe.com).

7 thoughts on “Adobe Flash – Content Creation & Localization Guidelines

  1. Pingback: Adobe Flash Localization Guidelines « eaflash

  2. Nice post! Point #8 regarding the “flickering”, isn’t this cause by text fields not sitting on “perfect” pixels? So instead of flattening your text layer, you should rather make sure that the x;y coordinates are integers. If that fails, well, I guess flattening will do the trick, but it’s worth noting that the “source” text layer should be kept as guide layer for future modifications.

    Hope that makes sense!

Leave a Reply