Page MenuHomePhabricator

[DESIGN] Iterate on sidebar recommendations designs
Closed, ResolvedPublicDesign

Assigned To
Authored By
JScherer-WMF
Dec 2 2024, 10:30 PM
Referenced Files
F58024604: image.png
Dec 16 2024, 11:48 PM
F58024602: image.png
Dec 16 2024, 11:48 PM
F58024592: image.png
Dec 16 2024, 11:48 PM
F58024594: image.png
Dec 16 2024, 11:48 PM
F58024590: image.png
Dec 16 2024, 11:48 PM
F58024588: Screenshot 2024-12-16 at 4.37.28 PM.png
Dec 16 2024, 11:48 PM
F58024582: image.png
Dec 16 2024, 11:48 PM
F58024566: image.png
Dec 16 2024, 11:48 PM

Description

As a follow up to T376817, iterate on the design of the sidebar recommendations to make them more usable, scalable, and appropriate for a wider A/B test.

User story: As an exploratory Wikipedia reader, I want to have more control over which articles get recommended to me.

Some feature updates I'm considering for this one:

  • Filtering controls (don't show me articles about _____ or with this keyword_______)
  • Adding whichever API performs best in T379241
  • A thumbs up/down affordance to get a rough quantitative read of recommendation quality.
  • A scroll trigger that has the menu appear after scrolling a specific amount down the page

Event Timeline

JScherer-WMF triaged this task as High priority.

Adding a similar thumbs up/down affordance that we're using in Simple Summaries right now to give us a qualitative signal at scale for the recommendations and a potential control mechanism. We could introduce a requirement to remove read next and flag it to contributors after a certain number of thumbs downs.

image.png (952×1 px, 700 KB)

Mimicking the media viewer settings functionality which would deep link a user to the "Reading Preferences" section of the Preferences pages from the Read next module:

image.png (955×1 px, 703 KB)

Right now that page looks like this:

Screenshot 2024-12-16 at 4.37.28 PM.png (1×3 px, 635 KB)

The primary rationale for doing the deep link is because I want to introduce relatively complex filtering options in "read next" for reader safety and control. More than I would want to include in an overlay on an article page. The tradeoff is bringing the reader away from the article page to do the config.

The Reading Preferences section would look like this:

zero state:

image.png (1×1 px, 127 KB)

hide read next:

image.png (1×1 px, 129 KB)

Conditional filters for hiding certain types of recommendations:

image.png (1×1 px, 156 KB)

NsB: Categories filters would be a multi-select lookup codex component, keyword filters would be an open ended chip input from codex.

Alternative locations:
Right now, having the recommendations in the top right corner of the page implies that a reader will immediately want to jump to another article before reading the article that they're currently on. There are two educated guesses on how the user flow could work that would more closely mimic behaviours we know readers are already doing:

  1. After intro

image.png (925×1 px, 479 KB)

They got the "gist" of an article from the introduction and want to move onto a related article afterwards.

  1. After infobox (if one exists)

image.png (925×1 px, 526 KB)

Most of our linking happens from the infobox today for rabbit hole reading sessions. This assumes that the reader didn't find the link they needed from the intro or infobox and offers alternatives.

In both cases, the recommendations would "stick" in the sidebar below the sticky header after a reader scrolls past these points. These patterns would also "cannibalize" fewer of the blue link clicks that already happen in our articles today. The read next feature would be more of an additional knowledge network exploration affordance rather than a competing one.

JScherer-WMF added a subscriber: ovasileva.

Obviously the filtering features (at least) would need storymapping and critique from the design team, but this iteration of the design is done-ish for now, so I'll move to signoff @ovasileva

@KColeman-WMF from a trust and safety perspective, are there other filters/categories here that you think I should consider? Are there other ways we can protect readers from harmful algorithmic recommendations?

@KColeman-WMF from a trust and safety perspective, are there other filters/categories here that you think I should consider? Are there other ways we can protect readers from harmful algorithmic recommendations?

Hi Justin, thanks for the ping! I like that you are including an explicit way for users to control their recommendations. The following might be out-of-scope but springs to mind for future exploration:

  • In the preferences it could be made even clearer to users what these recommendation preferences will do and how the data will be used / what algorithm drives it / link to the data policy. E.g. "We will use these preferences to recommend articles to you. Your data will remain private, see data policy."
  • Similarly, you may want to add a small line of copy in the recommendations box explaining what is driving these suggestions, especially if it is ML generated.
  • I did initially wonder if there should be a way to hide recommendations from the outset (within the box itself), similar to a "don't show again" checkbox. You could have a popover/dialog that contains basic settings with a link to set more complex filtering on Special:Preferences if needed.
  • The thumb up/down is a good way to assessing overall usefulness of the recommendations box, but I wonder if users could also pinpoint the articles that they are not interested in? Similar to the way you can snooze or hide suggested posts from Instagram.
  • On social media platforms it's common practice to have sensitive content controls for feeds. I'm not sure if that's needed here as we aren't dealing with user-generated content in the same way, but there might be learnings we can take from the way those platforms provide simple pre-defined settings (e.g. more, less sensitive content).
  • This is all just food for thought, from a T&S perspective I like what you have already and look forward to seeing the results!
ovasileva added a subscriber: Jdrewniak.

@JScherer-WMF - I really like the controls here, as well as the positioning after scroll. Wonder if that's something that would be doable in the browser extension as a quick test (cc @Jdrewniak ). Either way - resolving this and adding to our 1:1 notes to discuss further