information
This article only covers texts maintained by the user of an application. It does not cover translation of UI texts, documents, or configuration.

Intro

In order to fulfill international business needs, business objects may need to support textual input to be translatable into several languages. The use cases for translations of texts might be very specific to the application context. This guideline will define a pattern for a general use case. If your use case differs, use this pattern as the basis and adapt it as necessary.

The key features of this pattern are:

  • The initial maintenance of an object and its translation are separate steps. Therefore the maintenance screen of the object (in many cases the object page) will accept any textual input in the login language.
  • The translation of the textual input is a separate (follow up) step. It is done in a separate pop-over dialog focusing solely on the translation task.
Field translation flow

Usage

Use text field translation if:

  • Several fields of an object need to be translated.
  • The users maintain data of their actual business processes in one language.
  • Translation into another/several other languages is a follow-up step.

Do not use text field translation if:

The users are not translating the text themselves, but copy translations in several languages from an external source. A table with language/text columns on the object page would be the better approach in this case.

Structure

This pattern assumes that the business user wants to focus on the maintenance of the business object as regards the business results needed. To achieve that, the translatable text fields are on the object page among any other editable fields of the object. Translation is done in both patterns in a separate dialog.

The following logic applies:

Display mode:

  • Translatable text fields are displayed in the login language.

  • If the text does not exist in the login language, a fallback language will be shown.

    1. Fields show the login language.
    2. If the login language does not exist, texts will be shown in English.
    3. If the English version does not exist, the original text language will be shown.
  • To make it visible for the user that the text is not shown in the login language, the language code can be appended to the text.

Edit mode:

  • Translatable text fields are always displayed and edited in the login language.

  • If the text does not exist in the login language, a fallback language will be shown.

    1. Fields show the login language.
    2. If the login language does not exist, texts will be in English.
    3. If the English version does not exist, the original text language will be shown.
  • The fallback text is shown as a placeholder text. It cannot be edited, but it can be overwritten with the login language text at any time.

  • The language code can be appended to the placeholder text.

warning
Do not show the fallback language in an editable text field. It would be unclear for a user if the field would be written in the login language or in its original language after an update.

Field examples with and without fallback language

Field examples with and without fallback language

Behavior & Interaction

The text field translation pattern is intended to support the users to:

  • Initially maintain a business object in their language.

  • Translate the object into the needed languages

    • themselves,
    • via a peer or
    • via an external translation bureau.

The object page focuses on the business needs. The translation task is moved to a pop-up.

  • The pop-up is opened by clicking the Translate button.
  • Depending on the distribution of the fields of the object page, the translate action can be placed as a global action in the header toolbar or as a local action in the relevant section.
  • Optionally, an attribute in the object page header can give Information on the translation status, as an overview or as a quick view with details.

The translation pop-up is organized in tabular form. For each field one line is included. Per displayed language one column is shown. The following requirements apply:

  • If the translate action on the main header bar is activated, the translation will open as an expanded pop-up.
  • In the filter the user can select which languages to choose.
  • The field type matches the field type of the main UI.
  • Set text areas to “growing” mode.
  • The table is a responsive table.
  • In case of an object with a deep structure with translatable fields in details of the object, fields can be repeated.
  • Optionally, the functionality for Excel import/export can be supported to ease communication with translation bureaus.

Object Page Example - Multiple Field Translation

Pop-up for multiple field translation

Pop-up for multiple field translation

Responsiveness

Since the translation pop-up uses the responsive table, it can be used on form factors M and L. If too many languages are displayed, the pop-in behavior of the responsive table will apply.

Since the task of actual translation demands a side-by-side display of the original and translated fields, this use case cannot reasonably be achieved on form factor S.

Therefore on form factor S:

  • Only one language is displayed.
  • The edit mode is not supported.