Considerations...
Two ways to get into pause state...

1. Click button presented within Edit Check hard
2. Someone directly moves their cursor/focus via the editable surface

The above brings to mind a couple of questions:

• To what extent – if any – should the state of the Check card be consistent between the two entry points described above?
• How might people exit the "paused" state? E.g. some action on the card, some action within the document/editable surface, etc.

Per what @bmartinezcalvo, @Esanders, and I discussed offline, we're going to move forward with a version of Approach #2.

I've updated the task description to reflect the experience we converged on and that Ed is now creating a proof of concept for.

In parallel, Bárbara and I need to finalize the copy that will be shown in the version of the Tone Check card people will see once they begin revising the text that prompted Tone Check to be shown. See the Mid-Edit via Pre-Save column of T390248's task description for reference.

Change #1169709 had a related patch set uploaded (by Esanders; author: Esanders):

[mediawiki/extensions/VisualEditor@master] EditCheck paused: Use bounding rect styling

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

Per today's offline discussion, we are going to move forward with the "bounded rectangle" approach (see below).

We're making this choice A) mindful of the tradeoffs inherit with it and B) aware that if/when we come to learn the Bounded Rectangle approach is causing people to be confused/unclear, we can experiment with the alternative approach.

Approach	Bounded rectangle	Wrapped rectangle
Mock
Tradeoffs	The bounded rectangle approach means the rectangle boundary will appear over-top any non-textual element when the text in question wraps around it. We expect this issue to be relatively rare for people using desktop and non-existent for people using mobile and tablet.	The wrapped rectangle approach means that the border could be confusingly small when a line of text contains a small number of characters (as pictured above).

@bmartinezcalvo , this prototype you made is looking great. A couple of pieces of feedback/updates I'd value us exploring...

• Card copy: could we please try a version of the card copy that appears when you tap Revise that reads as follows...?
  • Look out for expressions that are flattering, disparaging, vague, cliché, or endorsing of a particular viewpoint.
  • Thinking: in this moment, we're seeking to equip people with info./guidance they can immediately understanding and apply. Ideally, the updated UX (T397984#11005953) will eliminate the need for instructing people where to look on the page...
• Card title: could you please update the card title to read Revise tone? so that we can be consistent with the choice we made in T390248
• Success message: could you please propose another variation for the success toast copy? Maybe Thank you ?
  • I think the yet-to-be determined copy needs to simultaneously:
    • Communicate the actions you took were recorded and that the wiki/system is appreciative for you having taken them
    • NOT communicate that the actions you took were effective at addressing / resolving the potential issue
• Calls to Actions: at present the prototype proposes two calls to action within the "Revising tone" state of the Tone Check card: Revise and Decline. Can we please see a version of the prototype that replaces Decline with Back ?
  • Thinking: 1) the experience I'm proposing above would be consistent with the pattern I understood us as converging on for the Decline UX path (T389443) and 2) people might have an easier time understanding the action because of how "literal" the meaning of it would be.

@ppelberg I've created this second version of the Figma prototype with the copy proposals you commented above.

Some thoughts:

• Card copy: I think some clear instructions (as in the previous option) on how to solve the tone check would be helpful in this card state when the user is revising the text, so they can easily follow the steps to solve the check.
• Success message: I've updated it to "Thank you for revising the tone!" since "Thank you" felt a bit generic, so I added this new info to acknowledge what the user has actually accomplished. Wdyt?
• Actions: I assume the "Back" button will always come back to the initial version of the Revise Tone card, discarding any changes the user has already made.

@ppelberg @Esanders assuming we will need to implement this solution as well in the Pre-save moment. Since now the pre-save moment takes you back to the mid-edit to address the tone, I've created this separate task to solve that and implement this new solution in the pre-save moment T399707: Tone Check: Review the Tone Check from the Pre-save moment.

Based on the decisions made during our last team's meeting, I'm sharing the Figma prototype updated with the following:

• Once clicking on Revise, the Edit Check card will include:
  • Title: Revise tone?
  • Description: Look out for expressions that are flattering, disparaging, vague, cliché, or endorsing of a particular viewpoint.
  • Buttons: Recheck + Decline
    • When clicking on Recheck, the card will be loading while rechecking and then:
      • If the model evaluates the revised text as STILL containing tone-related issue(s), the message "The text still contains tone-related issues." will appear within the card.
      • If the model evaluates the revised text as NOT containing any tone-related issues, a success message will appear "Thank you for revising the tone!"
    • Clicking on Decline will take the user to the decline survey; clicking Back inside the decline-survey takes you back to previous revising step.

Change #1168649 had a related patch set uploaded (by Esanders; author: Divec):

[mediawiki/extensions/VisualEditor@master] EditCheck: Add 'stale' state to checks

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

Change #1169709 abandoned by Esanders:

[mediawiki/extensions/VisualEditor@master] EditCheck paused: Use bounding rect styling

Reason:

squashed

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

Test wiki created on Patch demo by ESanders (WMF) using patch(es) linked to this task:
https://patchdemo.wmcloud.org/wikis/ec736e8900/wiki/Douglas Adams?veaction=edit&ecenable=2

El T397984#11010485, @bmartinezcalvo escribió:

Based on the decisions made during our last team's meeting, I'm sharing the Figma prototype updated with the following:

• Once clicking on Revise, the Edit Check card will include:
  • Title: Revise tone?
  • Description: Look out for expressions that are flattering, disparaging, vague, cliché, or endorsing of a particular viewpoint.
  • Buttons: Recheck + Decline
    • When clicking on Recheck, the card will be loading while rechecking and then:
      • If the model evaluates the revised text as STILL containing tone-related issue(s), the message "The text still contains tone-related issues." will appear within the card.
      • If the model evaluates the revised text as NOT containing any tone-related issues, a success message will appear "Thank you for revising the tone!"
    • Clicking on Decline will take the user to the decline survey; clicking Back inside the decline-survey takes you back to previous revising step.

As decided in the team meeting, we will remove the failed recheck step for now. The flow will now be as follows, where the user will return to the 2nd step if the recheck fails:

We will include that failed recheck step with the message "The text still contains tone-related issues." in a future iteration.

I'm not sure the initial step makes sense. If we want to offer "recheck" to the user, we should do it when they've clicked on the card, or when they click into the paragraph. Since we collapse cards when neither of these conditions are true, the only time that "revise" would make sense would be after the user has completed a paragraph and clicked "enter".

Change #1173988 had a related patch set uploaded (by Zoe; author: Zoe):

[mediawiki/extensions/VisualEditor@master] Tone check: Add a "recheck" button when a user revises a paragraph

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

As decided in the last Needs Discussion meeting, I've updated the Figma prototype in this task with the blue borders propsal when the user is revising.

Change #1168649 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] EditCheck: Add 'stale' state to checks

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

Change #1173988 merged by jenkins-bot:

[mediawiki/extensions/VisualEditor@master] ToneCheck: Add a "recheck" button when a user revises a paragraph

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

@zoe: is this meant to be in "Code Review"?

I thought we'd landed it

Test wiki on Patch demo by ESanders (WMF) using patch(es) linked to this task was deleted:

https://patchdemo.wmcloud.org/wikis/ec736e8900/w/