Page MenuHomePhabricator

NewImpact: Introduce new design to existing newcomers via GuidedTour and Drawer
Closed, ResolvedPublic

Assigned To
Authored By
RHo
Nov 22 2022, 3:46 PM
Referenced Files
F36269648: Screen Shot 2023-01-16 at 8.55.05 PM.png
Jan 17 2023, 4:56 AM
F36269646: Screen Shot 2023-01-16 at 8.52.20 PM.png
Jan 17 2023, 4:56 AM
F35828290: image.png
Dec 2 2022, 1:00 PM
F35828288: image.png
Dec 2 2022, 1:00 PM
F35824192: image.png
Nov 29 2022, 3:15 PM
F35824190: image.png
Nov 29 2022, 3:15 PM
F35819620: image.png
Nov 25 2022, 2:23 PM
F35817719: image.png
Nov 24 2022, 5:40 PM

Description

Existing newcomers are shown a pop-up that highlights that there is a new impact module design.

Proposed design
Desktop
image.png (882×828 px, 135 KB)
Mobile
image.png (686×438 px, 45 KB)
  • Existing newcomers are shown a pop-up that highlights that there is a new impact module design.
  • Same message on both Desktop and mobile, but in different formats:
    • On Desktop, the GuideTour extension will be used to show a dialog over the new impact module.
    • On Mobile, an info drawer will be shown over the new Impact module (*not* the homepage summary)
  • Copy (finalised, QQQ available on copy spreadsheet):
    • Heading: Updated design
    • Description text: More of your editing activity has been added!
    • Close message button label: Got it

Designs on figma: https://www.figma.com/file/fOa1x7hw6EM9VnaMJv7vib/Positive-reinforcement?node-id=3513%3A112805&t=tfloogWjzDCoemsw-

Acceptance Criteria

  1. Message appears for existing newcomers who had the Impact module and had visited their homepage before.
Completion checklist

Functionality

  • The patches have been code reviewed and merged
  • The task passes its acceptance criteria

Engineering

  • There are existing and passing unit/integration tests
  • Tests for every involved patch should pass
  • Coverage for every involved project should have improved or stayed the same

Design & QA

  • If the task is UX/Design related: it must be reviewed and approved by the UX/Design team
  • Must be reviewed and approved by Quality Assurance.

Documentation

  • Related and updated documentation done where necessary

Event Timeline

RHo triaged this task as Medium priority.
RHo moved this task from 📗Backlog (Current sprint) to 💪In Progress on the Growth Design board.
RHo added a subscriber: KStoller-WMF.

hi @KStoller-WMF - initial proposed designs are posted above, interested to get your 2c in particular on:

  • Should there be a feedback CTA at all? If so, should it go to a Talk page in Growth Mediawiki subpage? FWIW I am following the same "Give us feedback" action on CX.
  • All the copy - it's super drafty, happy to have them revised.

@RHo looks good!

  1. I like the idea of providing an easy way to provide feedback, but won't users have to dismiss the guided tour in order to see the new impact module? So it would be dismissed before they are ready to provide feedback? Is there a way to return to the guided tour?
  2. I have no issues with the current copy, but if we want to keep it shorter here's an idea:

Heading: New layout
Description text: More of your editing activity has been added!
Feedback CTA: How did we do? [[ URL | Let us know]].
Close message button label: Got it

@RHo looks good!

  1. I like the idea of providing an easy way to provide feedback, but won't users have to dismiss the guided tour in order to see the new impact module? So it would be dismissed before they are ready to provide feedback? Is there a way to return to the guided tour?

Yeah, that's why I am unsure if we should include the feedback link on this guided tour at all, because it is meant to be first time once only ephemeral experience, and not help or more info that someone would access time and again. Maybe we can separate it out as an action for the entire homepage elsewhere, I was thinking in the header on Desktop and at the bottom of the summary modules on mobile. Or we could have it on the bottom of the modules on both.

Desktop header + Mobile end of summary modules
image.png (704×1 px, 138 KB)
Bottom of both homepages
image.png (762×2 px, 214 KB)
  1. I have no issues with the current copy, but if we want to keep it shorter here's an idea:

Heading: New layout
Description text: More of your editing activity has been added!
Feedback CTA: How did we do? [[ URL | Let us know]].
Close message button label: Got it

Gotcha, I amended a little to remove reference to "we" and "us" based on previous content writer advice about avoid ambiguity of who "we" is (Wikipedia/Wikimedia?) in the UI. And think maybe "updated design" might speak more to there being newer elements added. What about the following:

  • Heading: Updated design
  • Description text: More of your editing activity has been added!
  • Feedback CTA: How do you like these features? [[ URL | Give feedback]].
  • Close message button label: Got it

Nice, I like the idea of adding a more permanent feedback option, as we have been talking about trying to move in that direction anyway (to start getting more feedback from newcomers who are actually using the homepage). I'm fine with either approach, with a slight preference for the Desktop header + Mobile end of summary modules design.

Your revised language sounds great! @RHo do you mind updating the task and designs? Where is the feedback URL leading? https://www.mediawiki.org/wiki/Talk:Growth/Personalized_first_day/Newcomer_homepage ?

I know we have a tight deadline, so if Engineers think the feedback option adds too much extra work, we can definitely break this into two tasks and just add that guided tour prior to the initial pilot release.

Nice, I like the idea of adding a more permanent feedback option, as we have been talking about trying to move in that direction anyway (to start getting more feedback from newcomers who are actually using the homepage). I'm fine with either approach, with a slight preference for the Desktop header + Mobile end of summary modules design.

OK great, just updated!

Your revised language sounds great! @RHo do you mind updating the task and designs? Where is the feedback URL leading? https://www.mediawiki.org/wiki/Talk:Growth/Personalized_first_day/Newcomer_homepage ?

Yes this seems like a good enough place to start with and we can change it to somewhere else later if it is getting too many comments (or none!) - unless @Trizek-WMF has a different suggestion now?

I know we have a tight deadline, so if Engineers think the feedback option adds too much extra work, we can definitely break this into two tasks and just add that guided tour prior to the initial pilot release.

Agree, pinging @kostajh for your thoughts about when this could be fit into relrase

Assuming that we discuss about the feedback page link for the guided tour, providing the link in the guided tour itself won't let people retrieve this link later.

If we go with a "give feedback" link, as I can see it in the mockups, we have a risk of having replies about anything. We should either go with an intermediary page, that lists where to provide feedback (if about the contents, contact your mentor ; if about the tools, click here), or on a local page where mentors/volunteers would triage the feedack for us.

So the question is not really about the page where the feedback would arrive, but more about what we want to collect and where.

Maybe the solution would be (for now) to have a feedback link inside the impact module, that clearly say what is it for: How do you like the data we provide about your impact? [[ URL | Give feedback]].

Assuming that we discuss about the feedback page link for the guided tour, providing the link in the guided tour itself won't let people retrieve this link later.

We could consider showing the guided tour on the second viewing of the impact module, but in general I don't think it's good to provide a feedback link in a component that is only going to be seen once.

If we go with a "give feedback" link, as I can see it in the mockups, we have a risk of having replies about anything. We should either go with an intermediary page, that lists where to provide feedback (if about the contents, contact your mentor ; if about the tools, click here), or on a local page where mentors/volunteers would triage the feedack for us.

So the question is not really about the page where the feedback would arrive, but more about what we want to collect and where.

Maybe the solution would be (for now) to have a feedback link inside the impact module, that clearly say what is it for: How do you like the data we provide about your impact? [[ URL | Give feedback]].

In MediaWiki, and on the homepage, it's fairly common to include a ?, settings cog, or ellipsis icon at the top right of a component.

Perhaps we could do something like that, but for the Impact module

image.png (816×754 px, 91 KB)

Where the dropdown would provide a link to "Give feedback about the impact module" and that takes you to e.g. https://www.mediawiki.org/wiki/Talk:Growth/Positive_reinforcement

In the future that dropdown/settings icon could also provide a place for users to customize the impact module, e.g. users who don't want to see edit streak data would be able to switch that off from this location.

Assuming that we discuss about the feedback page link for the guided tour, providing the link in the guided tour itself won't let people retrieve this link later.

We could consider showing the guided tour on the second viewing of the impact module, but in general I don't think it's good to provide a feedback link in a component that is only going to be seen once.

If we go with a "give feedback" link, as I can see it in the mockups, we have a risk of having replies about anything. We should either go with an intermediary page, that lists where to provide feedback (if about the contents, contact your mentor ; if about the tools, click here), or on a local page where mentors/volunteers would triage the feedack for us.

So the question is not really about the page where the feedback would arrive, but more about what we want to collect and where.

Maybe the solution would be (for now) to have a feedback link inside the impact module, that clearly say what is it for: How do you like the data we provide about your impact? [[ URL | Give feedback]].

In MediaWiki, and on the homepage, it's fairly common to include a ?, settings cog, or ellipsis icon at the top right of a component.

Perhaps we could do something like that, but for the Impact module

image.png (816×754 px, 91 KB)

Where the dropdown would provide a link to "Give feedback about the impact module" and that takes you to e.g. https://www.mediawiki.org/wiki/Talk:Growth/Positive_reinforcement

In the future that dropdown/settings icon could also provide a place for users to customize the impact module, e.g. users who don't want to see edit streak data would be able to switch that off from this location.

The main point of this task is to introduce and highlight to existing users that their impact module has changed, so I don't agree with showing it the second time it is seen, it really should be the first time view.
The feedback link on the intro message is meant to be a "bonus", and I think it would make sense to introduce one feedback point to the homepage for its entire contents, which would be added separately in the homepage as a whole (per the proposal). If we did think, we could remove the link to the feedback page (wherever that leads to) in the new impact module intro message, and just reference Use the "Give feedback" link on your homepage to comment on the new design

The main point of this task is to introduce and highlight to existing users that their impact module has changed, so I don't agree with showing it the second time it is seen, it really should be the first time view.

Fair enough!

The feedback link on the intro message is meant to be a "bonus", and I think it would make sense to introduce one feedback point to the homepage for its entire contents, which would be added separately in the homepage as a whole (per the proposal). If we did think, we could remove the link to the feedback page (wherever that leads to) in the new impact module intro message, and just reference Use the "Give feedback" link on your homepage to comment on the new design

Then perhaps we should make the GuidedTour have two steps (pretty common in GuidedTour usage), step one says "Here is the new impact module" and step two focuses on the cog/ellipsis/settings icon and says "here is where you can give feedback"?

The main point of this task is to introduce and highlight to existing users that their impact module has changed, so I don't agree with showing it the second time it is seen, it really should be the first time view.

Fair enough!

The feedback link on the intro message is meant to be a "bonus", and I think it would make sense to introduce one feedback point to the homepage for its entire contents, which would be added separately in the homepage as a whole (per the proposal). If we did think, we could remove the link to the feedback page (wherever that leads to) in the new impact module intro message, and just reference Use the "Give feedback" link on your homepage to comment on the new design

Then perhaps we should make the GuidedTour have two steps (pretty common in GuidedTour usage), step one says "Here is the new impact module" and step two focuses on the cog/ellipsis/settings icon and says "here is where you can give feedback"?

I would say yes but we don't have GuidedTour on Mobile so would prefer keeping it simple in v1 and only have the one single intro message on both. Also, in order ot not have too many different feedback links, would still prefer to have the single "Give feedback" link to be at the homepage level (and therefore appear on the homepage) rather than per module (and having it appear on specific modules which are different screens on mobile).

RHo attached a referenced file: F35824192: image.png. (Show Details)
RHo attached a referenced file: F35824190: image.png. (Show Details)

Message appears for existing newcomers who had the Impact module and had visited their homepage before.

To clarify, should this only appear for users who have an activated impact module? Otherwise it might be confusing, as the unactivated state looks the same.

Message appears for existing newcomers who had the Impact module and had visited their homepage before.

To clarify, should this only appear for users who have an activated impact module? Otherwise it might be confusing, as the unactivated state looks the same.

Yes, good catch! Sorry I will update the mock to show it over an activated one. (Although we do have a task T322850 to update the unactivated state with score cards)

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

[mediawiki/extensions/GrowthExperiments@master] UserImpact: Show discovery tour to users who had old module

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

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

[mediawiki/extensions/GrowthExperiments@master] [WIP] User impact: Show discovery notice to mobile users

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

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

[schemas/event/secondary@master] homepagemodule: Add support for newimpact drawer/tour events

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

Change 863385 merged by jenkins-bot:

[schemas/event/secondary@master] homepagemodule: Add support for newimpact drawer/tour events

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

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

[mediawiki/extensions/GrowthExperiments@wmf/1.40.0-wmf.12] User impact: Show discovery tour to desktop users who had old module

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

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

[mediawiki/extensions/GrowthExperiments@wmf/1.40.0-wmf.12] User impact: Show discovery notice to mobile users

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

Change 863290 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] User impact: Show discovery tour to desktop users who had old module

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

Change 864712 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@wmf/1.40.0-wmf.12] User impact: Show discovery tour to desktop users who had old module

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

Mentioned in SAL (#wikimedia-operations) [2022-12-05T09:37:40Z] <kharlan@deploy1002> Started scap: Backport for [[gerrit:864712|User impact: Show discovery tour to desktop users who had old module (T323619)]]

Change 863330 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@master] User impact: Show discovery notice to mobile users

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

Mentioned in SAL (#wikimedia-operations) [2022-12-05T09:50:40Z] <kharlan@deploy1002> kharlan and kharlan: Backport for [[gerrit:864712|User impact: Show discovery tour to desktop users who had old module (T323619)]] synced to the testservers: mwdebug2002.codfw.wmnet, mwdebug2001.codfw.wmnet, mwdebug1002.eqiad.wmnet, mwdebug1001.eqiad.wmnet

Mentioned in SAL (#wikimedia-operations) [2022-12-05T10:05:13Z] <kharlan@deploy1002> Finished scap: Backport for [[gerrit:864712|User impact: Show discovery tour to desktop users who had old module (T323619)]] (duration: 27m 33s)

Change 864713 merged by jenkins-bot:

[mediawiki/extensions/GrowthExperiments@wmf/1.40.0-wmf.12] User impact: Show discovery notice to mobile users

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

Mentioned in SAL (#wikimedia-operations) [2022-12-05T10:22:08Z] <kharlan@deploy1002> Started scap: Backport for [[gerrit:864713|User impact: Show discovery notice to mobile users (T323619)]]

Mentioned in SAL (#wikimedia-operations) [2022-12-05T10:23:48Z] <kharlan@deploy1002> kharlan and kharlan: Backport for [[gerrit:864713|User impact: Show discovery notice to mobile users (T323619)]] synced to the testservers: mwdebug1001.eqiad.wmnet, mwdebug2001.codfw.wmnet, mwdebug1002.eqiad.wmnet, mwdebug2002.codfw.wmnet

Mentioned in SAL (#wikimedia-operations) [2022-12-05T10:31:38Z] <kharlan@deploy1002> Finished scap: Backport for [[gerrit:864713|User impact: Show discovery notice to mobile users (T323619)]] (duration: 09m 30s)

kostajh renamed this task from NewImpact: Introduce new design to existing newcomers to NewImpact: Introduce new design to existing newcomers via GuidedTour and Drawer.Dec 5 2022, 2:52 PM
kostajh moved this task from Code Review to QA on the Growth-Team (Sprint 0 (Growth Team)) board.
Etonkovidova subscribed.

Checked in production:

desktopmobile
Screen Shot 2023-01-16 at 8.52.20 PM.png (1×1 px, 105 KB)
Screen Shot 2023-01-16 at 8.55.05 PM.png (1×618 px, 134 KB)