A Beginner's Guide to Design Tool Plugins - Plugin Behavior

Now that you have read through the first part of our beginner’s guide, it’s time to connect your design file to Applanga and upload its content to the dashboard.

However, before you open the plugin and hit the Upload button, we recommend that you take a step back and go through the checklist below; these are based on some of the most frequent questions we get from our design tool plugin users. This way, you can make sure your file is ready to integrate with Applanga:

1. Does your design file contain components?

   If it does, you will need to determine if you need the master component to be translated or if only some instances of this component are in scope. If you upload the master component to Applanga, you will have the option of downloading the translation into the master component and all its instances of the component. Alternatively, you can also leave out some instances of the component by limiting the scope of the download to a specific page or selected content. If you upload an instance of a component, only that instance will be translated when you download the localized version from Applanga.

2. Do you want to upload all the content from your file or just parts of it?

   This scenario requires some prep work. Before your initial upload to Applanga, you will need to exclude the strings that are out of scope. To do so you can either:

   • Lock or hide these strings on the design file
   • Add 3 underscores at the beginning of these strings.

   This way, if you need to upload new content from the same file in the future, these strings will be automatically excluded from the upload.

3. Does your design file have duplicate text strings? How does the plugin deal with that?

   If you know that all duplicate text strings should have the same translation, then there’s nothing for you to worry about. The plugin will, by default, merge all duplicates into one string and upload it to the dashboard. Once you download the translated string into your design file, all the duplicate instances of that string will be updated. If your duplicated strings need a different translation, then you should disable the option to merge new duplicated text (see screenshot below) before your first upload.

   

4. Your file has multiple strings with the same content, but different capitalization. Are these treated as duplicates too? What about white spaces and newlines?

   No, two text strings will only be treated as duplicates if the capitalization and content are 100% identical. The same holds true for white spaces, leading or trailing spaces, and new lines at the beginning or end of the text.

5. Your design file contains formatting like bolding, italics, and change in font sizes within the same string. How will this be uploaded to Applanga? What about duplicate text strings that differ only in formatting?

   The formatting will be uploaded with the string text to Applanga. While the formatting is not applied to the text on Applanga, you will see it written within curly brackets. For example, "Hello World!" in the design file might upload as "Hello {family: Lato; style: Bold; weight: 700;} World". If duplicate text does not contain the same formatting, these strings will not be merged together on Applanga. Instead, they will be uploaded as separate strings.

   The plugins have an option to ignore formatting. This allows you to strip the formatting on upload to Applanga. However, when downloading translations to the design file you will need re-apply the formatting to that translated text.

   

6. Do you want to upload more than one design file to your Applanga project?

   This is perfectly fine! Just keep in mind that there is a 50,000 key limit per project. That is, there can’t be more than 50,000 string entries. If your files contain a large amount of strings and you also plan on uploading the screenshots to Applanga, this might affect the dashboard UI performance.

7. We don't want to use code parameters in our design files. How can we prevent their download via the plugin if we add them to Applanga?

   The design plugins have an option to create a placeholder conversion table. In the table, you can define a text for every instance of a placeholder. The plugin will convert that parameter into a text element during the download. The text elements will be enclosed in curly brackets, but they will still look closer to the final output than the placeholder. For example, you can define that “%d apples” should always be replaced by “5 apples”. When you download a text that has %d on Applanga, in the design file, %d will be replaced with {5 apples}.

   

8. Last but not least, have you read our documentation on the design tool plugin?

   We know this is the least fun part, but reading through our documentation about the plugin, especially the section related to the upload options, will save you time and many headaches in the future.

After you’ve gone over the checklist above and completed the upload, you should complete a few spot checks and look for things that don’t make sense to you. Again, based on feedback from our users, we have put together a list of the most common questions we get at this stage of the integration process.

1. You have used the Inspect & Edit IDs feature in the Applanga plugin, but the strings you just uploaded appear not to have an ID

   This is expected. Applanga uses a content delivery network (CDN) which resets in 10 minute intervals. This means that uploads to Applanga are almost immediate, whereas downloads from Applanga to the design file aren’t. The inspect & edit IDs feature retrieves the IDs from Applanga, so they will only be visible in the plugin dialog 10 minutes after the initial upload.

   If you want to make sure that the IDs are correct, use the Applanga dashboard as reference. The newly uploaded strings and IDs will be visible on the dashboard almost immediately after the upload.

2. You see strings on the dashboard and you’re not sure where they come from

   Sometimes there might be a text element on the layer that is located behind a screenshot, or out-of-scope comments added by a UX designer. We recommend that you look up these unwanted strings in your design file and either lock them, hide them, or add 3 underscores in front of them. This way, you can delete them from the dashboard and make sure that they won’t be uploaded to Applanga again in the future.

3. You need to edit one instance of a duplicated string that already exists in the Applanga. How does the plugin handle this?

   Simply edit the string in the design file and upload it to Applanga. At this point, your dashboard will show the old version of the string and the new one. However, only the new one will be downloaded into your design file once you’ve completed the translation. The associated screenshot will be automatically linked to the new key and string.

4. Your Project contains strings that have been uploaded through another integration. Some of the strings in the Project are duplicates. Your Figma file has the same content, and additionally, it also has the same duplicate text strings. How does the plugin handle this?

   By default, the plugin will merge one of the keys with duplicate text that already exists in the Project with the duplicates from your Figma file. This won’t affect the translation process; all instances of the duplicate string in your Figma file will be updated once you download the translated string from Applanga. If you want the Figma duplicate strings added as new strings to your project, simply uncheck the option below in the plugin’s upload settings:

   To clean up your project’s editor view, we always recommend that you link all duplicated strings so that only one is visible on the dashboard.

Have you read through all our tips and still have some questions left? No problem, feel free to reach out to support@applanga.com and we will be more than happy to help!