Page MenuHomePhabricator

As a user of the reading list feature I want to be able to easily manage, organize and personalize my reading lists
Closed, ResolvedPublic

Assigned To
None
Authored By
cmadeo
Oct 5 2017, 9:53 PM
Referenced Files
F10668464: F - Segmented 01.png
Nov 8 2017, 12:51 AM
F10668463: F 04 d.png
Nov 8 2017, 12:51 AM
F10668468: F 06 a.png
Nov 8 2017, 12:51 AM
F10668466: F 03b.png
Nov 8 2017, 12:51 AM
F10668465: F 02a.png
Nov 8 2017, 12:51 AM
F10668467: F 04.png
Nov 8 2017, 12:51 AM
F10668477: F 06 d.png
Nov 8 2017, 12:51 AM
F10650077: F 04.png
Nov 7 2017, 12:28 AM
Subscribers

Description

User story

As a user of the reading list feature I want to be able to easily manage, organize and personalize my reading lists

User types

  • New user (no saved articles)
  • Existing user with out saved articles
  • Existing user with saved articles on one device
  • Existing user with saved articles on multiple devices
  • Existing user with saved articles on multiple devices on multiple platforms

Why are we doing this

Reading list management allows users to personalize and easily identify their reading lists through customizable titles, descriptions and auto generated images based on article lead images.
Additionally, users can utilize management tools to search within lists, sort their lists and apply bulk actions to articles within a list (delete, move).

Design

Suggested features

  • List title (char limit?)
  • List description (char limit?)
  • Image / thumbnail
  • Number of articles
  • Search within a list
  • Sort list (alphabetically, by date added, by date last updated)
  • Apply bulk actions (delete, move to a different list)

User flows

New users / users without saved articlesExisting user: Non-logged in user with saved articles
users without saved articles.png (910×2 px, 188 KB)
Existing user, non logged in user with saved articles.png (1×4 px, 442 KB)
InVisionInVision

Prototype + Mocks

https://wikimedia.invisionapp.com/share/AUE8AFIVZ#/261342942_01_Segmented
Sample mocks and Zeplin links below, please see Zeplin or the InVision link above for the full flow

Saved tabMulti-select on All saved viewRead lists viewIndividual reading list viewEdit Reading listCreate reading listArticle savedArticle added to reading list
F - Segmented 01.png (667×375 px, 115 KB)
F 02a.png (667×375 px, 116 KB)
F 03b.png (667×375 px, 130 KB)
F 04.png (667×375 px, 112 KB)
F 04 d.png (667×375 px, 84 KB)
F 05.png (667×375 px, 38 KB)
F 06 a.png (667×375 px, 214 KB)
F 06 d.png (667×375 px, 217 KB)
Zeplin: https://zpl.io/V1y6qYmZeplin: https://zpl.io/VQ0pYAnZeplin: https://zpl.io/aRMDYDeZeplin: https://zpl.io/aXYE4kEZeplin: https://zpl.io/VxmDl7XZeplin: https://zpl.io/aNwGoeQZeplin: https://zpl.io/adxWrwlZeplin: https://zpl.io/bL4pKn7

Design details

Saved article presentation
Reading list tags
Saved articles in list view (both in the 'All saved articles' view and within an individual reading list) utilize small 'tags' to denote which reading lists they are sorted into. On the 'All saved articles' view, there should be a 'tag' for all reading lists except for the 'default' reading list. On the individual reading list view, tags should only be presented for lists that are not the current open list or the 'default' reading list. Tapping on a tag will open the associated reading list. Reading list names may need to be shortened using ellipses based on character length. If there are more lists than can be presented in the list view, a tag with the number of lists that aren't presented on the list item should be shown (eg. if there are 5 lists that an article is on in total, but only 3 can be presented as tags then a tag with +2 should be shown). Tapping on this tag will open an action sheet with the remaining lists.

Update available indicator
If there is an update available for an individual article a small green dot should appear next to the article title.

Reading list presentation
Default list
The default list is the only list that cannot be deleted or renamed, therefore when bulk editing for reading lists is active, a special note warning users that their default list cannot be deleted should appear. If a user selects the default list on its own in the bulk editing view the 'delete' label should appear disabled. If the user selects multiple articles and the default list, upon tapping on 'delete' a warning message should appear explaining that all of the reading lists except for the default list will be deleted.

Update available indicator
If there are updates to articles within a list available, this is indicated to the user with a text label on the reading list list view and with a corresponding CTA button on the individual reading list view.

Triggering reading list syncing/updating
Users can manually trigger reading list syncing by pulling down to refresh within a specific reading list. Additionally users can sync/update multiple reading lists by tapping on the 'Edit' button on the Reading Lists section and multi-selecting reading lists.

In future versions user will also be able to trigger reading list syncing by tapping on the CTA to 'Update N articles'

Event Timeline

Two potential paths to move forward:

  • One tap action is saved to a 'Bookmark' list which cannot be deleted or renamed
  • One tap action saves an article to the 'All saved' segmented view of the saved tab, which includes ALL articles in reading lists and all bookmarked articles