Page MenuHomePhabricator

Section Translation: Pick a section
Open, HighPublic

Description

As part of the Section translation workflow (T243495), allow users to pick a section to translate for a given article in two languages.

View this step in prototype for a general overview.

General concept

Selecting a section to translate is the first step of the workflow. At this point, the article and language pairs are known, determined by different entry points in different ways. At this step the users are provided a menu with the sections for them to translate, and contextual information they may need to make a decision.

OverviewLayout diagramLayout detail
Pick a section - Overview.png (768×1 px, 132 KB)
Pick a section - Layout schema.png (768×1 px, 76 KB)
Pick a section - Layout mocks.png (768×1 px, 170 KB)

Users are provided a list of sections for them to pick one to translate:

  • The sections of the source article are shown in a menu. The sections are grouped, based on whether they are present or not in the target article.
  • 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

Pick a section - Header.png (768×1 px, 115 KB)
Pick a section - Header dimensions.png (768×1 px, 99 KB)

Header instructions:

Select a section to translate
Next you’ll see the section contents to decide what to translate.

Language Selector

Pick a section - Lang selector.png (768×1 px, 155 KB)
Pick a section - Lang selector Dimensions.png (768×1 px, 45 KB)

The language selector follows a different design on narrower screens using the whole width to get additional space.

Lists of sections

Pick a section - List of sections.png (768×1 px, 167 KB)
Pick a section - List of sections Dimensions.png (768×1 px, 82 KB)
Pick a section - List of sections Considerations.png (768×1 px, 129 KB)

List titles:

Sections missing in {Source Language}
Sections present in {Target Language]

Access to the source and target pages

Pick a section - Article access.png (768×1 px, 130 KB)
Pick a section - Article access Dimensions.png (768×1 px, 53 KB)

Additional considerations about possible issues

Pick a section - Additional.png (768×1 px, 171 KB)
Pick a section - Additional Dimensions.png (768×1 px, 90 KB)

Block messages:

Automatic section matching
Sections are identified automatically and the results are not always accurate.
[Learn more]

Unsupported sections
Some sections may not appear in the list because their contents are not supported yet.
[Learn more]

Navigation and transitions to other steps

Pick a section - Navigation.png (768×1 px, 145 KB)
Pick a section - Transition.png (768×1 px, 158 KB)

This ticket is focused on the section selection step. Other tickets will provide support for previous steps such as entry points (T241590, T241591, T239699) and following steps such as previewing the section contents (T241589).

Related Objects

Event Timeline

There are a very large number of changes, so older changes are hidden. Show Older Changes
Pginer-WMF triaged this task as Medium priority.Dec 30 2019, 2:59 PM
Pginer-WMF updated the task description. (Show Details)
Pginer-WMF updated the task description. (Show Details)
Pginer-WMF raised the priority of this task from Medium to High.Mar 3 2020, 3:47 PM
Pginer-WMF updated the task description. (Show Details)
Pginer-WMF removed a project: Design.
Pginer-WMF renamed this task from Section Translation: Support section selection to Section Translation: Pick a section.Apr 14 2020, 9:55 AM

Change 597745 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] SX Language Selector: Create SX language selector component

https://gerrit.wikimedia.org/r/597745

Change 597761 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] SX Pick a Section layout: Fix header layout

https://gerrit.wikimedia.org/r/597761

Change 597745 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] SX Language Selector: Create SX language selector component

https://gerrit.wikimedia.org/r/597745

Change 599784 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] SX Confirm/Start Translation: Enhance page functionality

https://gerrit.wikimedia.org/r/599784

Change 597761 abandoned by Nik Gkountas:
SX Pick a Section layout: Fix header layout

Reason:
Splitting patch in different patches

https://gerrit.wikimedia.org/r/597761

Change 601781 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] SX Mobile Pick a Section step: Enhance functionality

https://gerrit.wikimedia.org/r/601781

Change 602033 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] CX language info: create autonym mixin and replace code duplication

https://gerrit.wikimedia.org/r/602033

Change 602494 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] Vuex suggestion module: Refactor to store available language links for articles

https://gerrit.wikimedia.org/r/602494

Change 599784 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] SX Confirm/Start Translation step: Enhance functionality

https://gerrit.wikimedia.org/r/599784

Change 601781 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] SX Mobile Pick a Section step: Enhance functionality

https://gerrit.wikimedia.org/r/601781

Change 602033 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] CX language info: create autonym mixin and delete MWAutonym

https://gerrit.wikimedia.org/r/602033

Change 605977 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] SX Pick a section: Add empty missing sections state and additional considerations

https://gerrit.wikimedia.org/r/605977

Change 605977 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] SX Pick a section: Add empty missing sections state and additional considerations

https://gerrit.wikimedia.org/r/605977

Change 602494 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] Vuex store: Add languageTitleGroups

https://gerrit.wikimedia.org/r/c/mediawiki/extensions/ContentTranslation/ /602494

Change 609437 had a related patch set uploaded (by Nik Gkountas; owner: Nik Gkountas):
[mediawiki/extensions/ContentTranslation@master] SX Pick a section: Complete mobile layout

https://gerrit.wikimedia.org/r/609437

Change 609437 merged by jenkins-bot:
[mediawiki/extensions/ContentTranslation@master] SX Pick a section: Complete mobile layout

https://gerrit.wikimedia.org/r/609437

Videos from current version:

Mobile:
Tablet:
Desktop: