This semester I worked with two classmates, Aislyn Nishii and Nina Levinson, on the localization of an open-source Javascript/HTML game, called Raging Gardens. In this game, a jacked hungry bunny wearing a mask needs to collect carrots, while keeping enemies away by farting in their direction. The player has to test their carrot collecting skills for 3 minutes. Here is a demo of the game and the source code is here.

Translating the Code

We have  decided to localize the game into Spanish. For that, we divided the work into 3 parts: I took care of finding all of the translatable source text, Aislyn was responsible for translating it and Nina took care of putting the translated strings back in.

As I was responsible for finding the translatable text, I opened the index.html file and compared it to the game to check what would have to be translated, and I included everything that I found in a spreadsheet. However, I was faced with the first challenge of translating this game: when comparing the text I extracted from the index file to the text in the game, I realized that there were multiple strings missing. We then realized that the text to be translated was scattered throughout multiple files in different folders, making it really hard to collect all of it. This issue required Nina to open every html and .jss files in the folder and search for the translatable text in each one of them and replace them with the Spanish translation. This lack of organization from the developer led us to have to perform multiple test rounds to make sure that all of the text had been translated correctly. In order to make the work easier for Nina, who was going to be the one to make the implementation, we decided to document the locations of all strings in our excel file, and this proved to be very effective.

Another big part of localizing this game was taking into consideration text expansion, which can take up to 25% more space going from English into Spanish. As the interface buttons were not so big, we made sure to keep words in Spanish short so that the text would fit within the graphics or to use line breaks. This would definitely be another aspect that developers would have had to take into consideration if this game had been thought of with localization in mind since text expansion and contraction would require changes in sizes of buttons and other graphic elements.

As we realized, another challenging issue regarding translating this game has to do with the slang and game-specific vocabulary used, such as in the case of expressions like “Seems Legit” and “rabbitjutsu”, as in the examples below:

As it can also be observed in the images above, we also ran into some issues when we imported the Spanish text into the code, as some of the formatting tags were in the wrong place. This is another aspect of thinking through when developing a game and having localization in mind, because most likely developers will not speak the multiple languages the games will be translated into, so keeping tags in the right place when translating strings is essential. In our case, we were supposed to have “Zanahoria en un tenedor”, and the tag highlighted in fact “o usa un tótem de”.

Lessons Learned

One of the greatest takeaways from the Software Localization course is that, when developing a game, an app, or software, the more you can do upfront, the cheapest it’s going to be. Retrofitting can cost up to 90% to fix your content once it’s already done. In the case of Raging Gardens, as it was made to be an open-source game, the developers were not very concerned about making it localization ready. However, if this was a real for-profit product, they would probably have to spend lots of money on testing and reviewing so that this code would be fit for going global. Creating a code map so that the translatable strings could be easily located would make the work so much easier. The fact that the game was not so text-heavy made it not so difficult to localize, but I could only imagine how hard it would be if there was lots of text in it.