As part of the Section translation workflow (T243495), allow users to preview the contents of the section to translate and the contents already present in the target article, to confirm their initial selection.
This is an intermediate step that is the continuation of the initial section selection (T241587) and leads to the translation editor (on desktop: the one-section mode of Content Translation; on mobile: a custom mobile editor).
[[ https://pauginer.github.io/prototypes/translation/sections/dash-mob/#SectionOverview | View this step in prototype ]] for a general overview.
# General concept
Once users have selected a section, they can compare the contents in both languages. In this way, they can check what they are going to translate and how that fits in the current contents of the target article. From this point, users can confirm the selection to start translating, or go back to pick a different section.
| Overview | Layout diagram | Layout detail |
|---|---|---|
|{F31746295, size=full}| {F31746300, size=full} |{F31746303, size=full}|
As part of the Section translation workflow, users are provided a view to preview the contents before starting the translation:
- Tabs are provided for the user so view the source section and the whole target article.
-- A placeholder is shown in the target article view to indicate where the translated section will be added.
- Navigation: users can go back to the section selection menu (T241587), or move through the next/previous section.
- "Translate this section" option leads users to the translation view to translate the section (Content translation editor on desktop, or the mobile translation editor, when available, on mobile).
-- When scrolling a sticky header will keep the translation action visible.
- The solution will be responsive to support both mobile and desktop devices.
Below are described in more detail the different pieces supporting this step.
# Header
|{F31746316, size=full} | {F31746319, size=full} | {F31746322, size=full}
# Source and Target selector
| {F31746324, size=full} | {F31746326, size=full} |
# Contents
|{F31746328, size=full}|{F31746331, size=full}|
# Sticky Header
Contents to review can be long. As users get immersed in reviewing these contents it is useful to keep the main actions at hand. A sticky header will be shown to provide easy access as the user scrolls down past the main actions.
{F31746333, width=50%}
# Sections already present
Most of the time, users will pick a section that is missing in the target article in the "Pick a section" step (T241587). However, it is possible for them to select an existing section. In those cases, the user will be informed of the implications and provided an option to ignore the section found in case it was mapped incorrectly.
|{F31756217, size=full}|{F31756219, size=full}|{F31933660, size=full}|