Page MenuHomePhabricator

Add an image: mobile preview card
Closed, ResolvedPublic

Description

Corresponding task from "add a link": T268705: Add a link: mobile module preview


On the mobile homepage, users see a preview card of the suggested edit task (per work on T258021). Similarly to T268705: Add a link: mobile module preview, the image task needs to be shown in the card when it's next in the queue for the user.

  • For this new task type, there should be a robot icon preceding the bar graph icon that precedes the task type name in the lower right of the card.
  • The graph icon should have two bars filled in, since this is a "Medium" difficulty task.
  • Therefore the ordering on that line should be robot icon, bar graph icon, "Add an image"
  • There should be a placeholder image in the image thumbnail position – the specific thumbnail is still TBC 

Mockup:

image.png (1×720 px, 381 KB)

NOTE: Refer to Figma for up-to-date detailed redline mocks and specs:
https://www.figma.com/file/ULhJr1isDstRbGE5vjYDsr/Add-images-structured-task-[Growth]?node-id=3051%3A14717

Event Timeline

Change 719394 had a related patch set uploaded (by Gergő Tisza; author: Gergő Tisza):

[mediawiki/extensions/GrowthExperiments@master] Add Image: Fill in placeholder messages

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

Change 719398 had a related patch set uploaded (by Gergő Tisza; author: Gergő Tisza):

[mediawiki/extensions/GrowthExperiments@master] Add Image: do not load page image for addimage tasks

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

Change 719399 had a related patch set uploaded (by Gergő Tisza; author: Gergő Tisza):

[mediawiki/extensions/GrowthExperiments@master] Add Image: Add tasktype-specific CSS class to task cards

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

Change 719394 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] Add Image: Fill in placeholder messages

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

Change 719398 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] Add Image: do not load page image for addimage tasks

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

@MMiller_WMF and @Tgr – I've updated the description to clarify that there should still be an image thumbnail on the Add image task mobile preview, though the thumbnail image is still TBC.

Just updated this with the final mockup and link to Figma.

Change 719399 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] Add Image: Don't show thumbnails on task cards

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

Change 724993 had a related patch set uploaded (by Kosta Harlan; author: Kosta Harlan):

[mediawiki/extensions/GrowthExperiments@master] ImageRecommendations: Set placeholder CSS class on small task card by default

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

Change 724993 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] ImageRecommendations: Set placeholder CSS class on small task card by default

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

for @RHo quick review - can you take a quick look at the header. It seems that the mockup (https://www.figma.com/file/ULhJr1isDstRbGE5vjYDsr/Add-images-structured-task?node-id=3018%3A10119) calls for Base10 but the current production displays Base20. So, the production looks kind of reverse to the mockup.

mockuptestwiki - wmf.9
Screen Shot 2021-12-02 at 2.42.09 PM.png (204×654 px, 19 KB)
Screen Shot 2021-12-02 at 2.40.21 PM.png (434×1 px, 41 KB)

If there are no follow-ups - you may close the task as Resolved.

for @RHo quick review - can you take a quick look at the header. It seems that the mockup (https://www.figma.com/file/ULhJr1isDstRbGE5vjYDsr/Add-images-structured-task?node-id=3018%3A10119) calls for Base10 but the current production displays Base20. So, the production looks kind of reverse to the mockup.

mockuptestwiki - wmf.9
Screen Shot 2021-12-02 at 2.42.09 PM.png (204×654 px, 19 KB)
Screen Shot 2021-12-02 at 2.40.21 PM.png (434×1 px, 41 KB)

Hi @Etonkovidova - thanks for the catch, that's correct the header should indeed by Base10. @Tgr - can it be fixed as part of this ticket or should I file a new one that checks all mobile preview headers?

If there are no follow-ups - you may close the task as Resolved.

Below outstanding issue is fixed

image.png (516×720 px, 48 KB)

for @RHo quick review - can you take a quick look at the header. It seems that the mockup (https://www.figma.com/file/ULhJr1isDstRbGE5vjYDsr/Add-images-structured-task?node-id=3018%3A10119) calls for Base10 but the current production displays Base20. So, the production looks kind of reverse to the mockup.

mockuptestwiki - wmf.9
Screen Shot 2021-12-02 at 2.42.09 PM.png (204×654 px, 19 KB)
Screen Shot 2021-12-02 at 2.40.21 PM.png (434×1 px, 41 KB)

Hi @Etonkovidova - thanks for the catch, that's correct the header should indeed by Base10. @Tgr - can it be fixed as part of this ticket or should I file a new one that checks all mobile preview headers?

If there are no follow-ups - you may close the task as Resolved.