Help panel: add call-to-action and help panel into the editing UI
Open, Needs TriagePublic

Description

This is the first task for the "Focus on help desk" feature: making a call to action button/tab can open a help panel when a page is being edited. Requirements for the feature continue to take shape here based on design explorations from T206715.

User story

When I am editing an article and am unsure about how to proceed, ...
...I want to get help while I am doing the editing task ...
...so that I can more confidently complete the edit.

General requirements

  • Platform: This feature will eventually need to exist for both desktop and mobile. Desktop should be built and deployed first.
  • Languages: KO and CS (Growth team's target wikis)
  • Target users: Determined by business rules defined on T206716
  • Eventlogging: This feature will need to be instrumented with EventLogging for all clicks.
  • A/B testing: This feature should be A/B testable. We might want to test these sorts of things:
    • Having the feature at all.
    • Different call to action text.
    • Different configurations of elements in the panel.
  • Other considerations:
    • We want to allow the presence of the call to action to be configurable by the user through a user preference. When we first deploy the feature, users in the treatment group to have the feature should be able to turn it off. Users who do not have it should be able to turn it on. See T206716 for the details.
    • The initial version will not go to anonymous users, but subsequent versions may.
    • We should be able to support RTL languages (such as Arabic and Persian).

Proposed feature design + requirements

1. Call to action (to open the help panel)

  • Notes on the design:
    • Floating button/tab in the bottom right of the editing experience. Floating means that it stays in the same place in the window even as the user navigates around.
    • It should be shown in all editing experiences, regardless of whether it is visual or source editing, and regardless of whether it is the 2010 or 2017 editor. It should also be shown in the "read-only" editing context for protected pages. (Tracked in T211059: Help panel: implement support for VE and MobileFrontend)
    • Whether the button is shown by default for a given user should be able to be configured by the number of edits or number of days the account has. (Tracked in T211117: Help panel: provide ability to vary links by context)
    • It should be able to have text and an icon. The visual display may differ on desktop and mobile.
    • CTA cannot be dismissed, except by clicking a "cog" to go to user preferences and turn it off. (Tracked in T206716: Help panel: business rules on displaying the feature)
    • An additional prompt may be incorporated on first time access that highlights the call to action - either the same pulsing dot used to highlight sections of the VE toolbar, or a tooltip. This will not be included in the initial version.

2. Help panel

  • Mocks: Invision (clickable) prototype at https://wikimedia.invisionapp.com/share/XSP2H5Z7ZMY#/screens/330826495 (Click/Tap on this task in the contents screen to view the relevant mocks)
  • Notes on the design:
    • When the button is clicked, a floating panel should expand up from the button. On mobile, this should cover the full screen.
    • Should be closable back to the call-to-action.
    • Should be able to display text and links. Text and links should be customizable by individual language wikis. See T209297 for details.
    • The preferred implementation is shown on Mock 2B whereby the user should be able to "ask a question" directly from a text-field in the Help panel.

Related tasks

  • Ability to also Search within the help panel has been deferred in a separate 'enhancement' task - see T209301
  • "Ask a question" on Help desk from within the help panel is detailed on task T209318

Related Objects

There are a very large number of changes, so older changes are hidden. Show Older Changes
RHo updated the task description. (Show Details)Thu, Nov 15, 3:25 PM
kostajh updated the task description. (Show Details)Thu, Nov 15, 3:30 PM

@RHo that is helpful, thanks. Just to double check, you would like the button to appear at the bottom right of the page, not the edit form, right?

Should the button also show when the edit window is in read-only context?

RHo added a comment.Thu, Nov 15, 3:44 PM

@RHo that is helpful, thanks. Just to double check, you would like the button to appear at the bottom right of the page, not the edit form, right?

Yes that's right.

Should the button also show when the edit window is in read-only context?

Do you mean in cases like when someone tries to edit a protected article? Good question. Seems like it wouldn't hurt if users are confused by why they cannot edit to get help here, but will let @MMiller make the call.

@RHo -- in a conversation with @Urbanecm and @Trizek-WMF today, @Urbanecm brought up the concern that once we deploy this design, there will be two things in the visual editor that look like they are for getting help: our new feature, and the old question mark icon in the toolbar of the editor. The Editing team has recently started collecting data on usage of that old question mark via Schema:VisualEditorFeatureUse, and so we can look at that data to see how often people interact with it. But anyway, how do you think we should think about this?

RHo added a comment.Thu, Nov 15, 6:18 PM

@RHo -- in a conversation with @Urbanecm and @Trizek-WMF today, @Urbanecm brought up the concern that once we deploy this design, there will be two things in the visual editor that look like they are for getting help: our new feature, and the old question mark icon in the toolbar of the editor. The Editing team has recently started collecting data on usage of that old question mark via Schema:VisualEditorFeatureUse, and so we can look at that data to see how often people interact with it. But anyway, how do you think we should think about this?

I had this in mind as an earlier proposal (incorporating the call to action into the same icon) but decided to move forward with this proposal since where there is text to clearly call out this is to get help with editing, and secondly the icon with help in the chat bubble communicate this is where users can ask for help.
Having said that, we should make sure to track usage of the icon across the different modes to see if there is a marked difference in interaction with this CTA when in VE mode.

@RHo that is helpful, thanks. Just to double check, you would like the button to appear at the bottom right of the page, not the edit form, right?

Yes that's right.

I guess that's on the other side if a RTL language is selected by the user (it can happen...).

Should the button also show when the edit window is in read-only context?

Do you mean in cases like when someone tries to edit a protected article? Good question. Seems like it wouldn't hurt if users are confused by why they cannot edit to get help here, but will let @MMiller make the call.

I would keep the button even if the article is in read-only mode. It would be nice to see if people then suggest an edit through the feature. We can have an extra message when people open the pane to remind that the page is protected (using something similar to mediawiki:protectedpagewarning for instance).

Change 474310 had a related patch set uploaded (by Kosta Harlan; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@master] WIP: Add help pane CTA button

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

RHo updated the task description. (Show Details)Thu, Nov 22, 11:54 PM

An additional prompt may be incorporated on first time access that highlights the call to action - either the same pulsing dot used to highlight sections of the VE toolbar, or a tooltip

I'm wondering if a guided tour might be preferable here. It may not be intuitive to the user that there's an ability to post comments directly to the help desk, and the guided tour would help make sure the user sees this feature.

@MMiller_WMF @RHo I'm getting close to having a finished production for version 0.5 of the help pane. This contains:

  1. Call to action on desktop/mobile that appears in editing context
    1. no rounded buttons yet but I understand that might be upstreamed in OOUI soon?
  2. Help pane which is full screen modal on mobile and popup in desktop
  3. Ability to have configurable per-wiki help links
  4. Ask a question button (no form) which takes the user to the help desk
  5. Ability to turn off the help pane in user preferences

I need to work on styling, but once that's done, I'll move on to building out the interactive form.

Depending on how quickly we progress with T209982: Help panel: Develop Schema and T206719: Help panel: instrumentation, we could think about deploying this basic version to CZ/KO wikis to get some early data on usage while we work on T209318: Help panel: allow users to "Ask a question" to help desk and T209301: Help panel: enable searching help articles.

An additional prompt may be incorporated on first time access that highlights the call to action - either the same pulsing dot used to highlight sections of the VE toolbar, or a tooltip

I'm wondering if a guided tour might be preferable here. It may not be intuitive to the user that there's an ability to post comments directly to the help desk, and the guided tour would help make sure the user sees this feature.

I agree.

RHo added a comment.Mon, Nov 26, 1:36 PM

An additional prompt may be incorporated on first time access that highlights the call to action - either the same pulsing dot used to highlight sections of the VE toolbar, or a tooltip

I'm wondering if a guided tour might be preferable here. It may not be intuitive to the user that there's an ability to post comments directly to the help desk, and the guided tour would help make sure the user sees this feature.

I agree.

I am hesitant about adding a guided help feature as it may draw too much attention to what is itself meant to be sought only by those wanting help in the midst of editing. Secondly, the intention is that the ask for help is meant to make it easy for users to try posting a question directly in the pane without having to learn about help desk, but guided help highlighting the feature may seem like we want to encourage this as the first way to seek help, which I don't think is the case.

MMiller_WMF renamed this task from Help pane: add call-to-action and help pane into the editing UI to Help panel: add call-to-action and help panel into the editing UI.Thu, Nov 29, 7:12 PM
MMiller_WMF updated the task description. (Show Details)
MMiller_WMF added a comment.EditedThu, Nov 29, 10:21 PM

@RHo @kostajh @Trizek-WMF -- I'm getting caught up on this now, and I see four things in the conversation where I wanted weigh in. I will edit the requirements in the task description to reflect this.

  • Protected pages: I agree with @RHo that the feature should be available for protected pages. That's probably a super confusing situation to a newcomer, and they'll need help. Maybe in the future, we can give more specific help or help links related to protected articles, but for now it can be the same experience as with non-protected pages.
  • RTL: does our implementation support RTL languages out of the box? Such as putting the call to action on the lefthand side? I could see this feature being deployed to Arabic or Persian Wikipedias within the fiscal year.
  • Calling attention to the feature: maybe we should skip any sort of pulsing or guidance that directs newcomers to the feature. Theoretically, we should implement the call to action such that people notice it. We can look at initial numbers to decide whether we need to attract more attention.

* Preferences: since @kostajh says it is easy to have a user preference to turn the feature off, I think we should launch with that ability in user preferences (but not indicated anywhere on the feature itself). But a question I have is how the preferences will work for users who don't have the feature. Can we set it up such that people only have the preference option if they are newcomers in the treatment group? And such that non-newcomers can't go turn it on for themselves? Moving this part to T206716.

MMiller_WMF updated the task description. (Show Details)Thu, Nov 29, 10:29 PM
  • Preferences: since @kostajh says it is easy to have a user preference to turn the feature off, I think we should launch with that ability in user preferences (but not indicated anywhere on the feature itself). But a question I have is how the preferences will work for users who don't have the feature. Can we set it up such that people only have the preference option if they are newcomers in the treatment group? And such that non-newcomers can't go turn it on for themselves?

Why are we going to not allow "beta testing" by non-newcomers?

Screenshots of @kostajh 's current work-in-progress implementation:

Help button appears at the bottom right of the edit view:

Clicking it opens this panel:

Next stage of the panel after clicking the button:

Catrope added a comment.EditedFri, Nov 30, 9:38 AM

@kostajh I found two bugs / weird things in the current patch.

After submitting my question, the panel doesn't close, instead I get an empty panel: never mind, I now see where it says // todo: build out question complete panel. in the code

The timestamp in the posted question is malformed, it appears to be a JS timestamp (UNIX x1000) rather than a formatted one:

  • RTL: does our implementation support RTL languages out of the box? Such as putting the call to action on the lefthand side? I could see this feature being deployed to Arabic or Persian Wikipedias within the fiscal year.

Yes. The below looks a bit weird because all of the text is in English, but it's correctly RTL-ed:

Trizek-WMF added a comment.EditedFri, Nov 30, 10:17 AM

Why are we going to not allow "beta testing" by non-newcomers?

Good idea to explore the Beta feature for non-newcomers! They may be happy to have a feature like that, just because they want to try it or have a reassuring button.

MMiller_WMF added a comment.EditedSat, Dec 1, 1:04 AM

@Trizek-WMF @Urbanecm -- how does making it a beta feature for non-newcomers work? Does this mean all users would have it as an option under "Beta"? One of my concerns is that if a lot of people try it out just to see what happens, it could flood the help desk with test questions. What do you think?

Let's move this discussion to T206716.

Change 477713 had a related patch set uploaded (by Kosta Harlan; owner: Kosta Harlan):
[mediawiki/vagrant@master] Update vagrant role for help panel settings

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

Change 474310 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Help Panel: Add call-to-action button and help panel

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

Change 477713 merged by jenkins-bot:
[mediawiki/vagrant@master] Update vagrant role for help panel settings

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

MMiller_WMF updated the task description. (Show Details)Wed, Dec 5, 9:23 PM

Change 477924 had a related patch set uploaded (by Kosta Harlan; owner: Kosta Harlan):
[mediawiki/extensions/GrowthExperiments@master] Help Panel: Update English copy

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

Change 477924 merged by jenkins-bot:
[mediawiki/extensions/GrowthExperiments@master] Help Panel: Update English copy

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

kostajh updated the task description. (Show Details)Thu, Dec 6, 3:10 PM
kostajh reassigned this task from kostajh to MMiller_WMF.
kostajh moved this task from In Progress to Needs PM Review on the Growth-Team (Current Sprint) board.

@MMiller_WMF I edited the summary and linked to tasks that contain follow ups for particular items in this task description. I think we could close this one, but please let me know if you see anything that I've missed.

@kostajh -- so no QA or validation will be needed on this task -- it will all happen on the linked tasks?

so no QA or validation will be needed on this task -- it will all happen on the linked tasks?

Right. If you want to keep it open until all the subtasks are done, that's fine too.

Okay, I would like to keep it open.

Daylen added a subscriber: Daylen.Fri, Dec 7, 4:23 PM