Page MenuHomePhabricator

Addressing Reading list and Watchlist discoverability, clarity, and interaction challenges on web
Open, Needs TriagePublic

Assigned To
None
Authored By
Sneha
Fri, May 15, 5:38 PM
Referenced Files
F88245609: image.png
Sat, Jun 13, 3:45 AM
F88245509: image.png
Sat, Jun 13, 3:45 AM
F83422164: New Vector (2).png
Fri, May 22, 12:31 PM
F83160937: image.png
Thu, May 21, 12:07 PM
F83160871: image.png
Thu, May 21, 12:07 PM
F83160829: image.png
Thu, May 21, 12:07 PM
F82903577: New Vector (1).png
Wed, May 20, 12:41 PM
F81745636: icon explorations.png
Fri, May 15, 8:40 PM

Description

Purpose of this ticket

The reader experience team is planning to roll out the ReadingList feature to all account holding users in early July 2026. This ticket is to align on an approach for introducing Reading Lists on the web alongside Watchlists before the release timeline.

Background

The Reading List feature aims to provide a lightweight and intuitive way for readers to collect and return to content they saved for reading or referencing later on web. The solution for introducing reading lists must coexist with the existing Watchlist functionality, which serves a different but important audience with established usage patterns.

This ticket documents the existing challenges, design explorations, community feedback, and presents various ideas related to introducing a Reading List feature alongside the current Watchlist functionality.

Reading list is currently in beta and the goal is to align on an approach we can use to to scale Reading List to everyone.

Problem statement

How might we introduce a Reading List feature for all users on Wikipedia in a way that is easy for readers to discover and understand the functionality, while ensuring the existing Watchlist functionality remains easily accessible for users who depend on it.

Key challenges

1. Iconography
  • The current Watchlist star icon is interpreted by users as a “favorite” or “save for later” action rather than its intended purpose of monitoring article changes. Reference study
  • In a recent new editor research a participant also commented on how icons (such as bookmark/heart/star) connoted different things and the watchlist one was confusing in that they'd only want to add the favorite/most important articles for a star menu.
  • Because of that confusion, a Bookmark icon (for adding to reading list) and Star icon (for adding to watchlist) placed side-by-side can create cognitive overload or ambiguity for the users. Especially readers and new editors would struggle to distinguish between the two functionalities.

    Iconography.png (1,440×789 px, 376 KB)
2. Limited interface space
  • Space constraints, especially on mobile web, significantly limit how many actions can be surfaced directly in the article toolbar and header.
  • Even if icon confusion is successfully addressed, both “bookmark” and “watch” compete for highly valuable UI real estate above the article. This creates difficult prioritization decisions around:
    • Which action should remain directly visible in the action bar or in the header
    • Which feature should move into the overflow menu
    • How discoverable each feature remains after de-prioritization
  • As a result, surfacing one feature more prominently may require the other to become less immediately accessible, potentially impacting the feature discoverability.

    Limited space.png (391×699 px, 110 KB)

Direction proposed originally

Readers

Users with 0 edits and 0 articles on watchlist see Save/Bookmark as a primary action both above article and in the header. Watch actions are moved to the overflow menu. This would result in all the new accounts to be opted into this version.

Original proposal - readers.png (2,651×929 px, 532 KB)

Editors

Users with >0 edits and >0 articles on watchlist continue to see the Watch function but have access to Save/Readinglist in the overflow menu.

Original proposal - editor.png (2,469×927 px, 532 KB)

Preference

A potential preference to switch the spots for users who may want to use other options more than the defaults.

Preferences.png (516×203 px, 15 KB)

Concerns with above direction

Reader -> Editor path
  • A key concern raised by the community is the importance of the reader → new editor funnel. There is a concern that moving Watchlist functionality into the overflow menu could reduce discoverability for users transitioning from reading to editing, making contributor workflows harder to find and adopt.
  • We are currently exploring how much of a role watch functionality plays in the reader → newcomer editor journey. Our assumption was that while watch functionality is useful for established editors and moderators who already understand the value of contributing, it is unclear whether discovering watch functionality actually drives readers to become editors. We need more research to understand this area.
  • We also looked at recent usage data of the Watchstar button, and we noticed that while editors with more than 100+ edits have the highest usage rate, new users with 0 edits are also using it at a higher rate than novice editors. This may suggest that newcomers are treating the Watchstar as a way to favourite articles instead of the intended Watch functionality.
Preferences
  • Another concern raised was around using Preferences as a way to let users customize or swap feature placement. While this could provide flexibility, Preferences are often difficult to discover and may be inaccessible or overly cumbersome for many users.
  • We agree with this concern and that relying on Preferences to resolve core UX conflicts is not considered a scalable or sustainable solution, particularly as similar feature placement and prioritization challenges may continue to emerge in the future.

Revised proposal

Desktop

Given that:

  • the community feels strongly about making the Watchlist easily discoverable by potential editors and new account holders
  • many community members are eager to try Reading Lists alongside their existing contributor-focused tools

...we are exploring a proposal that allows Reading Lists and Watchlists to coexist on Desktop in a way that minimizes confusion.

In this proposal, both Reading Lists and Watchlists would remain consistently visible and accessible to all users on Desktop, rather than prioritizing one experience over the other. This approach ensures that neither workflow becomes hidden or difficult to discover on Desktop, while also supporting users who may rely on both simultaneously.

New Vector (2).png (1,440×791 px, 377 KB)

  • Adding a label to star adds clarity to what it means, as star is often confused with favouriting.
  • Allows us to keep using star as an icon for watch functionality, as editors are familiar with its various states (empty, partially-filled, filled in.)
  • Making it look like a link button ensures that editing features such as “Watch”, “Edit”, “View history” are visually grouped together.
  • This approach would make having both lists accessible from the header a natural choice. Note: The current icon used for accessing Reading Lists is temporary. If this direction moves forward, we will further explore a more suitable icon. The icon for accessing "Saved pages" has been updated in the mock above to differentiate it from Watchlist.
  • This also allows for a consistent experience between Article page and Talk page where Watch is always available in the same location.
Mobile

Mobile phones face space constraints, and showing both Watch and Save actions prominently would either require replacing an existing action or overcrowding the interface with an additional icon.

  • We also do not recommend introducing both actions as unlabeled icons, as this could create considerable confusion for users.
  • Usage data suggests that many users with 0 or fewer edits are using watchstar and watchlist on Minerva, indicating that Watch functionality on mobile might be used by some users as favouriting an article already.
  • Based on this assumption, we propose surfacing the Save action on article pages, while placing Watch within the overflow menu on mobile.

Talk page on mobile:

  • To maintain consistency and reduce confusion for newer editors, we also recommend keeping Watch in the same location across different views, by surfacing it in the overflow menu on Talk pages as well.
  • We also propose moving the Subscribe action onto the page itself in place of star, positioning it as a more lightweight and approachable way for readers to engage with discussions, thereby creating more approachable pathways for readers to engage behind the scenes and become editors.
Mobile - article page.png (384×779 px, 173 KB)
Mobile - talk page.png (384×779 px, 128 KB)

Tablet

Tablet - article page.png (929×791 px, 229 KB)
Tablet - talk.png (929×791 px, 134 KB)

Next steps

Review the revised proposals with stakeholders and community, and use this ticket as a space for constructive feedback and discussion.

For the revised proposal we’re specifically looking for feedback on:

  • The proposed visual treatment for Watch on Desktop
  • If the placement of Watchstar within the overflow menu across all views is acceptable.
  • What are the thoughts of moving Subscribe above the article on Talk pages. [Please refer to the design rational mentioned in the revised proposal]

Also feel free to share other ideas not already explored here and which addresses the challenges mentioned earlier.


Appendix:

Other ideas explored that were not pursued due to a number of challenges:

  • Progressive introduction to features based on user behaviours/signals
  • Unified "Add" action with separate lists
  • Single unified list
  • Icon changes

Read more about the above ideas in this comment

Event Timeline

Sneha renamed this task from Addressing Readinglist and Watchlist discoverability, clarity, and interaction challenges to Addressing Reading list and Watchlist discoverability, clarity, and interaction challenges on web.Fri, May 15, 8:25 PM
Sneha updated the task description. (Show Details)
Other ideas explored that were not pursued due to a number of challenges:

1. Progressive introduction to features based on user behaviours/signals

One of the ideas (extending the original proposal) was to introduce the watchlist functionality to readers based on behavioural signals such as: making a first edit, interacting with Watchlist-related features, or demonstrating contributor-oriented behaviour. This approach would gradually expose new users to Watchlist workflows and potentially prompt them to switch feature placement or visibility preferences if they wish to.

Challenges

  • Requires accurately identifying transition moments between reader and contributor behaviour
  • Risks making incorrect assumptions about user intent or evolving needs
  • A user beginning to edit does not necessarily mean Reading Lists become less important to them
  • Contributor needs may emerge gradually over time rather than at a single identifiable moment
  • Allowing users to switch feature placement would likely require additional settings or preferences to switch things back, which introduces discoverability of preferences concerns
  • Adds system complexity in figuring out the correct behaviour/signals

2. Unified "Add" action with separate lists

A single button where users have to choose which list they want to save to.

Challenges

  • Increases the number of taps required to save/watch content. Risks making saving/watching articles feel slower.
  • Adds even more steps if the user wants to add the article to a custom list or assign a custom label
  • A unified icon may not be correctly understood.

Singled button.png (2,540×1,186 px, 1 MB)


3. Single unified list

We thought of a concept of combining Reading List and Watchlist into a single saved-content system. Users save content in one place (everything you save goes to a single list) and users can choose how they want to view their saved items, such as a reading-focused list or a recent changes feed for the items saved.

Challenges

  • Mixes two fundamentally different use cases: learning vs monitoring changes
  • Users may not want to always “Save”, “Watch” the same article.
  • Advanced Watchlist functionality may clutter the experience for readers
  • May disrupt existing Watchlist workflows and require editors to relearn the interface
  • Supporting both reader and contributor workflows in one view could add significant complexity
  • Technical differences between existing systems (Codex vs OOUI)

4. Icon changes

Several icon changes were considered by the contributor team’s designers.

Challenges

  • Watch star currently has three states: An empty star when the page is not being watched, a half filled star when the page is watched temporarily, a filled star when the page is watched permanently.
  • Finding an alternative icon system that clearly communicates all three states while remaining easily recognizable introduced additional design challenges. Below are some of the explorations considered.
  • Note that: the icon change does not resolve the limited space on mobile phones for showing both options together.

icon explorations.png (2,314×3,582 px, 77 KB)

Sneha added a subscriber: HFan-WMF.

Thanks for taking previous feedback onboard and revising your plan.

I'm a little iffy on adding the word "watch" next to the watchstar. The rest of it (in the prime real estate area, having both watchstar and reading list on desktop, reading lists only on Minerva) seems fine.

How about bringing the reading list "bookmark" icon somewhere before the Namespace:Title, and maintain the watchstar at its original default position? Will it still cause confusion to the users?

@Novem_Linguae @Hakimi97 Thanks for engaging here and sharing your thoughts. Adding a label to the star icon could improve clarity not only for readers, but also for newer editors, since the star is often interpreted as a “favourite” action. Regardless of addition of bookmark icon, there may be value in making the Watch functionality more explicit and easier to understand for people who are less familiar with editing workflows. Also separating the bookmark and star icons into different locations may not fully address the underlying ambiguity around what the star icon represents.

Thanks for your response @Sneha . I noticed that on the F81742777 the "Read" label link was removed for the desktop page view. Could I get some explanations regarding how it was there initially and what leads to the decision to remove it?

oh good catch @Hakimi97 that's a mistake... I will fix the mock tomorrow.

@Sneha thanks for the detailed write-up. Building on the revised proposal, I wanted to share some alternatives that could also help us plan ahead for possible toolbar needs for Suggestion Mode (T416531):

  1. Place the Bookmark next to the article title. The reasons behind this proposal is to:
    • Relate the Bookmark directly to the article being next to its title, since you're saving this article, not performing an action on it.
    • Create a clearer visual separation between saving content (Bookmark) and acting on it (Edit, View history, Watch).
    • Free up space in the page toolbar — which we'll likely need for a Suggestions entry point at some point (T416531).
  2. Use the cdxIconWatchlist instead of a star. The reasons behind this is:
    • The star risks being confused with the "Save" action.
    • Use the same icon already used in the Watchlist option in the user menu would make the connection clearer for users.
  3. Since Watch is an action with two states (turn on/off), it should use a quiet ToggleButton rather than a link-style treatment. This makes the interactive behavior explicit without relying on a filled/unfilled star to communicate state — which is ambiguous and already causing confusion with the Bookmark icon.
  4. Add tooltips to explain both Bookmark + Watch actions when hovering on them. At least this will help reinforcing the difference between both actions on desktop:
    • Watch: "Follow updates on this page"
    • Bookmark: "Save to your reading list"
  5. In Minerva (mobile/tablet):
    • Moving Watchlist into the overflow menu makes sense, especially since we'll probably need to reserve toolbar space for Suggestions (T416531).
    • We could also make the toolbar responsive to surface more actions on larger mobile screens (and tablet), consistent with what's proposed for the edit toolbar in T423146.
image.png (2,880×1,600 px, 1 MB)
image.png (2,880×1,600 px, 1 MB)
image.png (2,880×1,600 px, 1 MB)
Unselected Bookmark and WatchSelected Bookmark and WatchWith side panels collapsed

@bmartinezcalvo thanks a lot for your detailed feedback and visuals. I wanted to share some thoughts on the recommendations:

  1. I am concerned about this position next to article name as article names can vary which could shift the position of the bookmark icon. It would make it harder to build strong muscle memory. Also on mobile having the icon outside of the action bar (which we tried) introduces more visual density and we are trying to minimize that in order to keep the reading interface lightweight on minerva.
  2. The star icon has three states (filled, half-filled for temp watching, filled) and it will be difficult to convey that with a watchlist icon
  3. Same comment as above - it in fact has three states which right now is conveyed by icon.
  4. Tool tip is a good idea however if the label "watch" is able to disambiguate the meaning it might be not needed.
  5. It might be better to keep the items above article max to 5 on minerva to ensure we are not overcrowding the space and avoiding visual density. But I agree with making toolbar responsive specially on desktop it does not work very well right now. We plan to work on improving responsiveness as part of essential work.

Do you mean by this that T428855 is not a bug, it's by design? But why?

Are these styles needed anymore? Because of them, the watch link text label is not aligned vertically (Windows 11 Firefox 151.0.4).

image.png (435×85 px, 5 KB)
image.png (349×62 px, 3 KB)