Page MenuHomePhabricator

Section-level images: Add caption onboarding
Open, MediumPublic

Description

User story & summary:

As a logged in newcomer, I want to see caption onboarding that helps me write a good caption for the image, because a caption is needed to complete the task.

Background & research:

Structured tasks break down editing workflows into a series of steps that newcomers can accomplish easily. Newcomer tasks increase newcomer activation (+11.6%), which flows on through to increased retention (1). Initial data shows that structured tasks help improve activation and retention even further (2).

Design:

Desktop:

Desktop Figma designs

Write a caption onboarding.png (900×1 px, 279 KB)

Mobile:
Mobile Figma designs

  • Utilises the standard guidance format, with content from the onboarding tool tips broken into quick tip steps.
  • The onboarding changes slightly changes its copy in comparison to Add an image:
  • “Write a caption to go with the image in the article section”
  • “Describe the image so it’s clear how it relates to both the article and its section”

Add a caption onboarding Brazil.png (640×360 px, 71 KB)

Acceptance Criteria:

Given I'm completing a section-level "add an image" task,
When I get to the caption stage,
Then I see caption onboarding

Given I select "Don't show this again" or "Don't show again",
When I complete another section-level image suggestion.
Then I don't see this caption onboarding again.

Event Timeline

KStoller-WMF changed the task status from Open to In Progress.Mon, May 15, 4:07 AM

We discussed in team meeting that we'll re-use the existing implementation from add image due to time constraints, and @KStoller-WMF will create a follow-up task to switch to GuidedTour for desktop.

The add an image version contains the article title in the first paragraph of the onboarding dialog. Should we keep this and also add the section name in bold? I mean going from:

Readers of Anoures will see the caption displayed with the image. A few guidelines:

to

Readers of Anoures will see the caption displayed with the image in the Étymologie section. A few guidelines:

cc @KStoller-WMF

Change 923377 had a related patch set uploaded (by Sergio Gimeno; author: Sergio Gimeno):

[mediawiki/extensions/GrowthExperiments@master] Section images: add caption onboarding dialog

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

The add an image version contains the article title in the first paragraph of the onboarding dialog. Should we keep this and also add the section name in bold?

+1
I agree that we should continue to highlight that the image (and image caption) needs to be relevant to both the article AND the section, so I like the idea of adding the section name in bold.
It's worth noting the downside is that some article titles and section titles will be much longer than this example. But as long as that is handled gracefully, that seems OK.

@JFernandez-WMF please feel free to chime in if there were reasons to exclude the titles that we aren't thinking of. Thanks!

Yes, this makes sense and sounds good to me! Thank you both!

Change 923377 abandoned by Sergio Gimeno:

[mediawiki/extensions/GrowthExperiments@master] Section images: add caption onboarding dialog

Reason:

Done in I7b4f34735e9e08a7d36804ccbff99e06636bb84c

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

Please let me know if I'm missing something but I think T335232: Section-level images: Add caption help already covers this task, unless we want the (otherwise identical looking) "onboarding" and "help" dialogs to have different content (there are some slight differences in the mockups, e.g. whether the article title is mentioned).

Please let me know if I'm missing something but I think T335232: Section-level images: Add caption help already covers this task, unless we want the (otherwise identical looking) "onboarding" and "help" dialogs to have different content (there are some slight differences in the mockups, e.g. whether the article title is mentioned).

Weird, it looks like I never completed adding requirements for T335232, sorry!

Essentially these two tasks are identical, I think the only difference is T335228 was meant to cover the initial onboarding, while T335232 is basically the same dialog, but triggered when a user taps the ? help icon. When a user navigates to the caption help in this way, we likely shouldn't show that same "Don't show again" footer.
Design requirements for T335232 also mention "without the guided help style", but my understanding was that we removed that requirement from this task... so maybe they both have the same style now and removing the "Don't show again" footer is the only differences between these tasks.

Design requirements for T335232 also mention "without the guided help style", but my understanding was that we removed that requirement from this task... so maybe they both have the same style now and removing the "Don't show again" footer is the only differences between these tasks.

I'm seeing the checkbox requirement already properly handled in beta where it is shown on before writing the caption but not when clicking on the ? icon. Tentatively moving to QA.

Sgs changed the task status from In Progress to Open.Mon, May 29, 3:10 PM
Sgs moved this task from Code Review to QA on the Growth-Team (Current Sprint) board.
Etonkovidova added a subscriber: Etonkovidova.

Checked in betalabs - looks & works as expected:

  • the dialog(s) are the same as for Add image
  • the section title is present in the dialog popup and in the caption's text.

Desktop

Screen Shot 2023-06-01 at 8.48.59 AM.png (1×1 px, 443 KB)
Screen Shot 2023-06-01 at 8.49.23 AM.png (1×1 px, 418 KB)

Mobile

Screen Shot 2023-06-01 at 9.29.34 AM.png (1×770 px, 258 KB)
Screen Shot 2023-06-01 at 9.29.47 AM.png (1×754 px, 266 KB)