Page MenuHomePhabricator

Image dimension scaling on UW "Add data" step is wonky [Labs]
Closed, ResolvedPublic

Description

User story: As a Commons uploader, I want to see the image I am uploading on the "Add data" step, so that I can add structured data easily and accurately (without scrolling).

We have this (on Labs), where the image is being scaled to full width, no matter its native size:

We want this:
Over a chat with @egardner, we discussed the scaling issue. Eric suggested that it would probably be better for the width to constrain the max-width of the image, but not to scale up if it is smaller. We should explore this option in more detail

Acceptance Criteria:

Can be tested on https://commons.wikimedia.beta.wmflabs.org/wiki/Special:UploadWizard

  • The image is larger than the thumbnails on the Describe step, but not so large that they either look distorted or they hinder the user from both seeing the image and adding structured data to it.

QA Results

ACStatusDetails
1T221364#5188325

Event Timeline

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptApr 18 2019, 12:53 PM
PDrouin-WMF renamed this task from [stub] image dimension size on UW "Add data" step to Image dimension size on UW "Add data" step.Apr 18 2019, 10:46 PM
PDrouin-WMF removed PDrouin-WMF as the assignee of this task.
PDrouin-WMF updated the task description. (Show Details)
PDrouin-WMF added subscribers: egardner, Ramsey-WMF.
Restricted Application added a project: Multimedia. · View Herald TranscriptApr 18 2019, 10:46 PM
PDrouin-WMF renamed this task from Image dimension size on UW "Add data" step to Image dimension scaling on UW "Add data" step is wonky [Labs].Apr 18 2019, 10:47 PM
PDrouin-WMF updated the task description. (Show Details)

Change 505303 had a related patch set uploaded (by Eric Gardner; owner: Eric Gardner):
[mediawiki/extensions/UploadWizard@master] Don't stretch small images to 100% width in "Data" section

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

egardner claimed this task.Apr 19 2019, 8:15 PM

Ok, this should be a simple fix (just made one change from width to max-width in the CSS.
@PDrouin-WMF this is not on Labs/Beta yet (maybe someone can push there so you can verify), but here's a screenshot from my local instance:

The small, square image is no longer being stretched to fill the available space. I think this change will fix *most* of the weird behavior you are describing above; someone could still upload a 10px wide, 2000px tall image and it would look strange, but that's more of an edge case IMO.

@egardner thanks for the screenshot! looking forward to seeing it on Labs/Beta :D

Change 505303 merged by jenkins-bot:
[mediawiki/extensions/UploadWizard@master] Don't stretch small images to 100% width in "Data" section

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

Ramsey-WMF moved this task from Untriaged to Next up on the Multimedia board.Apr 25 2019, 3:58 PM

Recap from the earlier meeting:

  • Max height is needed - Depicts should be visible on the screen no matter what (if users have a long image, and they don't see what's possible to add, they may skip this step). Could use a bounding box?
  • MM: will do (landscape images won't be full-width anymore, though - do we center them or left-align?)
  • Answer: left-aligned, probably

switching this to Matthias while Eric is out.

Image dimensions will now never exceed 360px height, or the width of the statements panel.

Change 507917 had a related patch set uploaded (by Matthias Mullie; owner: Matthias Mullie):
[mediawiki/extensions/UploadWizard@master] Limit height of thumbs in metadata step

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

Change 507917 merged by Matthias Mullie:
[mediawiki/extensions/UploadWizard@master] Limit height of thumbs in metadata step

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

matthiasmullie updated the task description. (Show Details)
matthiasmullie added a subscriber: matthiasmullie.

Change 508527 had a related patch set uploaded (by Matthias Mullie; owner: Matthias Mullie):
[mediawiki/extensions/UploadWizard@wmf/1.34.0-wmf.3] Limit height of thumbs in metadata step

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

Change 508527 merged by jenkins-bot:
[mediawiki/extensions/UploadWizard@wmf/1.34.0-wmf.3] Limit height of thumbs in metadata step

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

Edtadros reassigned this task from Edtadros to Ramsey-WMF.EditedMay 16 2019, 11:33 PM
Edtadros added a subscriber: Edtadros.

Test Result

Status: ✅ PASS
OS: macOS Mojave
Browser: Chrome
Device: MBP

Test Artifact(s):

Acceptance Criteria:

Can be tested on https://commons.wikimedia.beta.wmflabs.org/wiki/Special:UploadWizard

The image is larger than the thumbnails on the Describe step, but not so large that they either look distorted or they hinder the user from both seeing the image and adding structured data to it.

Edtadros updated the task description. (Show Details)May 16 2019, 11:34 PM
Ramsey-WMF closed this task as Resolved.Jun 7 2019, 10:56 PM