Capturing Visual Context

Overview of Visual Context

What is Visual Context?

Visual Context provides a visual representation of the source content to Translators and Editors as they are performing their work, and is a very effective way to ensure high-quality translations. Visual Context is displayed in the Smartling CAT Tool - the environment in which translations are performed.

Visual Context is applied to the source strings, so you don’t need to apply Visual Context for each language in your job. The same Visual Context will be visible to all Translation Resource users in the CAT Tool, so if your Visual Context includes text, it’s best that it is in the source language.

Screenshot_2020-10-09_at_16.47.10.png

 

Visual Context vs Content

It is a common misconception that content and Visual Context are one and the same. Content is the actual words and strings that translators perform work on, whereas Visual Context is a visual representation of this content to help ensure translation quality. Sometimes Visual Context is captured automatically alongside the content, and sometimes an additional solution is required to capture Visual Context. More on this later in the article.

 

General Guidelines

  • Visual Context can be either static or dynamic.
    • Static Visual Context has a fixed presentation in the CAT Tool, meaning that context will not update with translations in real-time.
    • Dynamic Visual Context is changeable, meaning that context can update with translations in real-time.
  • Determine the best Visual Context solution based on your content-type and content integration method (see table below).
  • There are ways to automate Visual Context capture for each solution type. Please see the table below and consult your CSM.

 

Types of Visual Context

HTML Context

HTML resources from the content you are translating; examples include websites and apps, including desktop, mobile, or other form factors, as well as HTML email templates. One of the benefits of HTML context is that it is dynamic, allowing linguists to visualize their translations in real-time, rather than simply referring to an image of the source content. Several Smartling content integration solutions provide HTML context natively, while in some cases, a separate solution may need to implement to capture HTML context.

 

Image Context

For example, screenshots. Upload any image file format containing a visual representation of the content that you intend to translate in Smartling. This is the most universal method of Visual Context, as you can feasibly provide screenshots from any source content-type. Image Context can either be matched to strings automatically using OCR (optical character recognition), or by manually mapping the strings to the image within the Smartling Dashboard. Image Context is commonly used for native mobile apps because HTML is not available for them. 

Additionally, Smartling's Context from video functionality is a convenient way to get Image context for Website or Application content. Using a recorded video, it can upload screenshots to the Smartling Dashboard.

 

Video Context

When translating subtitles, you can add a Youtube or public mp4 link when uploading the .srt or .vtt file. This is another form of dynamic context, allowing Translators to view the video in real-time as they are performing translations on your subtitles.

 

Adobe InDesign Visual Context

Visual Context can be generated on saved translations in the CAT Tool for Adobe InDesign files (.idml) by clicking the Generate document with latest [language] translations button.

 

Strings with Visual Context

You can find out which strings have or do not have Visual Context by using the Visual Context filter in the Strings View. 

Screenshot_2020-10-09_at_15.12.20.png

Below the Context filter, you can search by the Context Name. Click Exact Match to find strings with context with the exact match of the filename inserted.

Screenshot_2020-10-09_at_15.31.16.png

 

Additionally, you will see the uploaded Visual Context file name greyed out under the job’s File/URL name in the File/URL column in the Strings View.

Screenshot_2020-10-09_at_15.24.02.png

 

Considerations for manual process

When there is no automated Visual Context solution available for your content, how should you determine whether you should proceed with a manual method for capturing Visual Context? Here are some considerations to help you prioritize which content should have Visual Context:

Does your content include some ambiguous terminology?

For example, does “Home” refer to the button on your webpage or where you’re from? Does “Cancel” refer to terminating a subscription or reverting back on an action on your webpage?

Will your content have a specific layout post-translation?

The last thing you want is to waste time and money translating content that doesn’t fit the layout of the end-design. 

Is this high-value, important content?

For example, if your content drives eCommerce conversions or is highly trafficked, you will likely want to make sure that Visual Context is captured to ensure that translations are of the highest possible quality.

Software application user interfaces benefit greatly from Visual Context because the nature of the strings for such content-types can be more ambiguous. For example, single words and short phrases as opposed to long paragraphs of text. Uploading screenshots can clarify ambiguity and help ensure translation quality.

 

Supporting tools

Smartling has a range of supporting tools which can also further assist in providing guidance to translators. These can be used in alongside Visual Context or as an alternative as part of your translation strategy; 

 

How Visual Context works

Visual Context works differently depending on the content type. Below is an outline of how to create Visual Context for the various content types.

 

Microsoft Office documents

Visual Context is created automatically for Microsoft Office documents. The Visual Context is dynamic for all formats (with the exception of PowerPoint). You can also upload image Visual Context and map the associated strings to that image. This will update the Visual Context panel on the associated string(s).

Visual Context is not automatically available for PowerPoint documents above 20MB. Alternatively, you can upload screenshots of the slides and they will be mapped automatically by OCR.

Adobe InDesign Files

For Adobe InDesign, the context is generated automatically from the .idml file. Translators can generate dynamic Visual Context from within the CAT Tool by clicking Generate document with the latest [language] translations button once they save translations

 

Video subtitles

For video subtitle files, when you upload the .srt or .vtt via the Files tab, you will be prompted to add a YouTube link for Visual Context. Adding the correct link for the uploaded file will match the subtitles to the video so Translators can see the video play in the context panel in the CAT Tool.

 

Web content

Visual Context for any website or web application can be captured automatically or manually, depending on your resources and infrastructure. You can automate Visual Context capture by using Smartling’s Javascript Library, an API integration. Smartling’s Global Delivery Network even automatically captures Visual Context as part of the native integration (see below). If you have developer resources and your website or applications are complex and dynamic, the JavaScript Library can be a great solution to automatically capture high-quality context. If you have limited developer resources, Visual Context can still be captured manually by using Smartling’s Visual Context Crawler, Context Capture Google Chrome Extension, or uploading an HTML or image file. 

 

Mobile Apps

Automatically apply Visual Context of mobile application content with an API integration, or manually add Visual Context with Context upload. Additionally, Smartling's Context from Video allows you to upload a video, from which Smartling will capture screenshots.

 

Connectors

Visual Context is automatically created when content is submitted for translation for many of Smartling’s connectors. There are a few connectors for which a separate Visual Context solution must be implemented. Consult your Solutions Archechit for options on an appropriate Visual Context solution.

 

Visual Context Solutions | Content Types

Visual Context Solution

Content-Type most applicable

Visual Context is captured Automatically or Manually? 

High-level overview

GDN

Websites

Web Applications

Automatically

Natively captured by the integration. Visual Context is automatically created once the string has been ingested via the GDN.

Smartling Connector

Websites

Automatically

Natively captured by the integration. Visual Context is automatically created once the asset is submitted via Connector. Not all connectors support Visual Context, e.g. Wordpress.

JavaScript Library

Websites

Web Applications

Automatically

Embed a snippet of JavaScript in the webpage to send Visual Context to Smartling each time the page is rendered. It can be embedded in development, staging, or production environments.


 The strings must already exist in Smartling in order for the Visual Context to be submitted.

Chrome Extension

Websites

Web Applications

Manually or Automatically

Once the Google Chrome Extension is installed on the browser, manually run the extension on a given page to submit Visual Context to Smartling. 


To automate, either supply a list of URLs or sitemap to the extension or invoke it from javascript (e.g., from Selenium).


The strings must already exist in Smartling in order for the Visual Context to be submitted.

Visual Context Crawler

Websites

Web Applications

Manually

Enter the Domain/URL into the Visual Context Crawler functionality in the Smartling Dashboard. The page is crawled and Visual Context is submitted to Smartling. 


The strings must already exist in Smartling in order for the Visual Context to be submitted.

Image Upload

Websites

Web Applications

Mobile Applications

Design Files

Business Documents

Manually

Manually upload screenshots to the Visual Context tab on Smartling Dashboard. OCR automatically matches the Visual Context to content strings.


In some cases where the image quality is not high enough, OCR may not map Visual Context to every possible string. Manual mapping of content to Visual Context is also supported by dragging a text box on the screenshot and typing the required strings. 


The strings must already exist in Smartling in order for the Visual Context to be submitted.

Visual Context API

Websites

Web Applications

Mobile Application

Design Files

Business Documents

Automatically

The Visual Context API allows for Image Upload, HTML Upload or sending an image, HTML or video URL’s via API call rather than by dragging and dropping the Visual Context files into the Smartling platform.

(NEW) Context from Video

Websites

Web Applications

Mobile Applications

Manually

Screenshots are automatically generated from a screen capture video. These screenshots can then be manually uploaded or uploaded via the Visual Context API.

Was this article helpful?