Page MenuHomePhabricator

Iterative improvements to Statements
Closed, DeclinedPublic

Description

Background

We have a longstanding issue: the visual treatment of Wikidata links and the Prominence Buttons are not ideal due to technical issues discovered while implementing the original design.

Currently on Commons:

Original design:

The visual polish present in the original design above was difficult to implement because the “dot” dividers don’t line up in all circumstances, due to the width differences of the “Primary” button text (either “Prominent” or “Mark as Prominent”), and how that already variable width would change when localized. For more information, that declined ticket is here: T218707

One recommended solution has been to hide the Wikidata links and only show them on hover, leaving the Prominent buttons right aligned. This is not ideal as it runs into accessibility and mobile editing issues.

Additionally, making content available only on hover creates more problems than it solves, because it makes Wikidata link use cases more difficult to support. We have community members, eagerly anticipating qualifiers, asking that we display links for qualifier property numbers and values. These use cases are being documented here: Use cases for WD links in Commons Structured Data

We’d like to both refine the user interface and support Commoners who need control over when Wikidata links are shown or hidden. Below are some UX improvements I propose to address the visual concerns of the links and buttons,

Proposed UX improvements

  • Using icons instead of buttons for marking "prominence"
    • Removes the complexity of localizing and laying out the button copy
    • Pairing the icon with a tooltip, which offers more space to explain what “Mark as prominent” and “Prominent” are, as well as being able to link to the “Learn more” page Commons:Depicts - Wikimedia Commons.
  • Adding Wikidata links at the Qualifier level
    • Displaying Wikidata branding makes it clear where the data is coming from, and if additional data sources are ever included, using a new branding’s logo will help users differentiate between sources.
    • However, including branding for every link adds significant visual weight to the interface, so another option is to not show branding at the qualifier level of a statement, and rely on the links themselves to identify the source. This comes at the expense of being able to spot-check identifiers as quickly as possible though.
  • Using a show/hide toggle for Wikidata links
    • Gives user control over when to display links, including if a user never wants or needs to see them. Note that by default, users will not see Statements as they are already behind the second tab on the File Page (after File Information).
    • This supports all use cases mentioned above (Use cases for WD links in Commons Structured Data)

Link for direct feedback

InVision Freehand

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptJun 11 2019, 3:22 PM
PDrouin-WMF updated the task description. (Show Details)Jun 11 2019, 3:22 PM
PDrouin-WMF updated the task description. (Show Details)
PDrouin-WMF updated the task description. (Show Details)Jun 11 2019, 11:14 PM
PDrouin-WMF moved this task from Next up 📓 to Doing 📝 on the SDC Design board.
PDrouin-WMF added a subscriber: Ramsey-WMF.

Looks good to me as far as pure design perspective. Only question we have is how hard the switching will be to implement in engineering, which is still TBD, but certainly not insignificant.

PDrouin-WMF updated the task description. (Show Details)Jun 12 2019, 9:06 PM
PDrouin-WMF updated the task description. (Show Details)Jun 12 2019, 9:16 PM

@PDrouin-WMF I dropped my feedback in Invision. I'm not convinced that this is the right solution. I don't see revealing the full set of information as a setting to be turned on, additionally, I would take some time to rethink the expected affordances around the icons that you chose. Take a look at OOUI to see if there are any opportunities for repurposing and/or applying the iconography.

All the proposed changes are on hold. The team will be implementing this for now: T227230

PDrouin-WMF closed this task as Declined.Aug 20 2019, 4:58 PM

Closing this because we went with another solution (linking the labels themselves) and that is now live.