Page MenuHomePhabricator

Enable customization of the feed in multiple languages
Closed, ResolvedPublic5 Story Points

Description

User story [Multilingual reader]

When browsing through the Explore feed...
...I want to choose what cards are shown in each language...
...so that I only see content I’m interested in.

Proposed design

Invision prototype: https://wikimedia.invisionapp.com/share/F4GNQ7VWQXB#/screens/291222779

Redline mocks on Zeplin board - tagged with Multilingual and Customize feed

Interaction flow (QA required )

Pre-conditions: User's device language is English, with Wikipedia app languages set as 1/EN, 2/ZH-HANT, and 3/HE (Hebrew).

  1. Open the "Customize your feed" screen. Note that all card types are shown in the list, but only cards which have multiple language content are shown with a languages under the card-type list item.
  2. Tap on the languages under one of these language-dependent cards, "In the news" to bring up a dialog.
  3. Note that Traditional Chinese is shown unselected and disabled since it is not available in this language. Deselect the English version of "In the news".
  4. Return to the "Customize your feed" screen and select the language bar for the Trending card. Uncheck ALL the languages in the dialog.
  5. Return to the "Customize your feed" screen and note that the Trending card now has been toggled off by default since all languages are deselected.
  6. Re-order the cards so that the “On this day” card is after “Continue reading”.
  7. Tap on the overflow menu and note the options available should be Restore the default view, show all cards, and Hide all cards. Select to hide all cards.
  8. Check that all items should now be toggled off.
  9. Return to the feed, where the empty state should be shown. Tap on the Customize button to return to the customize feed screen.
  10. Tap on the overflow menu and select to “Restore the default view”.
  11. Return to the feed, where the default will be to show content for all languages, grouped by card type (i.e., Trending will show 3 times in a row per day, once in EN, then ZH-HANT, then HE.)

Additional testing for QA:

  • Overflow items
  • Language agnostic cards are not repeated for each language (eg., Continue reading, Because you read, Picture of the day).
  • The last feed setting should be restored (e.g., If user selects to view only HE Wikipedia feed cards then leaves the app, the next time they return to the feed, they should still only see HE cards).

Notes on the design

  • Customize screen
    • Assumes that the system knows the availability of feed content for each Wikipedia language (ie., there is dependency on RI development of a ‘meta’ endpoint that determines availability of endpoints by language) per T191785
    • If a user only has 1 language set, language-dependent cards will not be shown with the languages ‘bar’ .
    • The dialog to select languages may require scrolling, depending on the number languages set.
  • Explore feed - see subtask T192394: Update the Explore feed UI based addition of multilingual customization
NOTE: An enhancement allowing filtering by languages on the Explore feed itself is split into task T192153

Sample view when languages are 1/EN, 2/HE, 3/ZH-HANT

Event Timeline

RHo created this task.Mar 28 2018, 11:20 AM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMar 28 2018, 11:20 AM
RHo updated the task description. (Show Details)Apr 9 2018, 11:19 AM
RHo updated the task description. (Show Details)Apr 9 2018, 11:25 AM
RHo updated the task description. (Show Details)Apr 12 2018, 1:29 PM
RHo updated the task description. (Show Details)Apr 12 2018, 10:42 PM
RHo updated the task description. (Show Details)Apr 13 2018, 11:29 AM
RHo updated the task description. (Show Details)Apr 13 2018, 6:57 PM
RHo updated the task description. (Show Details)Apr 17 2018, 6:28 PM
RHo updated the task description. (Show Details)
LGoto set the point value for this task to 5.Apr 23 2018, 4:09 PM
RHo updated the task description. (Show Details)Apr 23 2018, 4:13 PM

Change 428664 had a related patch set uploaded (by Dbrant; owner: Dbrant):
[apps/android/wikipedia@master] [WIP] Feed customization with multi-language support.

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

Change 428664 merged by jenkins-bot:
[apps/android/wikipedia@master] Feed customization with multi-language support.

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

Hey @Dbrant - looks priiiitty good! Just a few items:

  • Re-order icons on the Customize screen are darker than the expected Black@38% opacity
  • Dialog text has narrower line-height and lighter color than expected (should be using the Body 1 Secondary style - Roboto Regular 14sp with 20 line-height and color Black@54%)

  • The dialog title and buttons should be fixed:
Expected per scrollable content example
Actual
  • In 4 & 5 of the QA steps, when all languages in the "Trending" card dialog are turned off, the Trending card should be toggled off by default since all languages are deselected
RHo added a comment.May 2 2018, 12:21 PM

Oh also, should the Today card be only one language?

Dbrant added a comment.May 2 2018, 1:52 PM

@RHo A couple of notes:

  • When specifying colors, can we please refer to the abstract meta-colors that we have defined in our palette? Since we don't have mocks for Dark or Black mode, it's even more important to use the meta-colors, so that they'll appear correctly in dark/black mode automatically.
  • Regarding the logic of toggling off the card when all of its languages are unselected... Is the converse also true? (i.e. if one or more languages becomes selected, does the card become toggled on?) What if the user had previously turned off the card explicitly, regardless of selecting languages?
RHo added a comment.May 2 2018, 2:45 PM

@RHo A couple of notes:

  • When specifying colors, can we please refer to the abstract meta-colors that we have defined in our palette? Since we don't have mocks for Dark or Black mode, it's even more important to use the meta-colors, so that they'll appear correctly in dark/black mode automatically.
  • Sure, it's Material theme Disabled/De-emphasised
  • Regarding the logic of toggling off the card when all of its languages are unselected... Is the converse also true? (i.e. if one or more languages becomes selected, does the card become toggled on?) What if the user had previously turned off the card explicitly, regardless of selecting languages?
  • Yes the converse is true. But if they explicitly turn on/off the card without choosing the languages then it does not change the languages selected – so in short the language check boxes may affect the card toggle on/off, but toggling the card on/off does not affect the language selection.

Change 430396 had a related patch set uploaded (by Dbrant; owner: Dbrant):
[apps/android/wikipedia@master] Design tweaks for Feed language customization.

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

Change 430396 merged by jenkins-bot:
[apps/android/wikipedia@master] Design tweaks for Feed language customization.

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

Hi @Dbrant - sorry, just a couple of minor things I didn't pick up the first time around:

  • The language code for Traditional Chinese should be ZH-HANT (not ZH-HANS, that's for Simplified) in the cards:

  • Checkbox text should when unchecked remains same color as checked - it only shows as disabled when the checkbox item itself is disabled:
Expected: English unchecked is the same text color (Chinese text and checkbox is disabled as it is not available as a card)
Actual:
Dbrant added a comment.May 8 2018, 1:58 PM

The language code for Traditional Chinese should be ZH-HANT (not ZH-HANS, that's for Simplified) in the cards:

@RHo Do you mean that you selected zh-hant as the app language, but it shows zh-hans in the card header? I'm not sure how/why that would happen.

RHo added a comment.May 8 2018, 2:07 PM

The language code for Traditional Chinese should be ZH-HANT (not ZH-HANS, that's for Simplified) in the cards:

@RHo Do you mean that you selected zh-hant as the app language, but it shows zh-hans in the card header? I'm not sure how/why that would happen.

@Dbrant - yes I swear it happened! but cannot repro now after refreshing the install >.< there's another bug though in that if both ZH-HANT and ZH-HANS are selected, text is only showing in the Traditional. Will file a separate ticket.

Change 431760 had a related patch set uploaded (by Dbrant; owner: Dbrant):
[apps/android/wikipedia@master] Design tweak: don't modify text color of unselected language.

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

Change 431760 merged by jenkins-bot:
[apps/android/wikipedia@master] Design tweak: don't modify text color of unselected language.

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

Last tweak item LGTM on Nexus 7 (8.0) on Wikipedia v2.3.232-alpha-2018-05-10. Moving to QA for further testing

RHo added a comment.Jun 7 2018, 7:28 AM

hi @Dbrant - should there be a separate QA task created to test the content service has been implemented into the feed?

RHo updated the task description. (Show Details)Jun 20 2018, 1:47 PM