Background

To ensure that wikistories remain relevant and up-to date, story watchers are alerted with a custom notification when changes to an article involves text used in a story. Change can be partial (text used in a story haas been partially modified in the article) or complete (text used in the story is no longer present in the article).

For these scenarios, it would require:

• Setting up a notification: UX copy, links, actions, bundling rules
• Treatment in the story builder

Description/User story

As a wikistory watcher,
I want to be notified of changes to the notified of changes to the underlying article,
so that I can update the wikistory accordingly.

As a story maintainer,
I was to understand the nature of the article changes and how they affect the wikistory,
so that I can update the wikistory correctly.

Design

01. Discovery of problematic text inside story builder.

• Show a clear label indicating that the text is outdated and needs to be reviewed.
• Label message "Outdated story text, review".
• Place warning icon next to label message.
• Place label message below the story text.
• Divide the label message and story text using a separator.
• Separator is 1 px border and has #C8CCD1 color.
• Tap on "review" take users to Review changes screen.

02. Review Outdated story text.

• Screen title: "Review changes"
• Show previously selected story text in an underlined format.
• Underline has 1 px border and use #000 color.
• Use the color #e07076 to indicate the removed information.
• Use the color #75C877 to indicate the newly added information.
• Present two buttons at the bottom "No change required", "Update".
• "No change required" button take users back to the story page.
• Remove outdated story text label if users tap on "No change required" button.
• "Update" button take users to update story text.
• Device back key should take users back to the story builder.
• Back arrow on top should take users back to the story builder.
• On scroll, show all other changes to the text while they're on review changes screen.

03. Update outdated information.

• Show updated story text highlighted.
• Tap on "Clear" button removes the highlight and let editors choose any other text.
• Tap on "Add to story" text updates the text box on story page.
• Remove warning message from text box on story page.

• Allow editors to choose new fact when previously selected text is no longer part of the article.
• Present story text without any highlights.

04. Notification in story change

• Show following notification message when text has changed in article. "(article_name) article has been edited, check Story:(story_name) for accuracy."
• Make entire notification serve as primary link which opens problematic story page on story builder.
• Only trigger notification when there is a change in article text which have been used in a story.

Design file

Acceptance Criteria

Alerting:

• Showing alert of outdated text on builder with right UX copy
• Showing alert on notices / alerts with right UX copy
• After selecting clear button, alert disappears from story
• After selecting add to story, alert disappears from story

Displaying changes:

• Highlighting removed information in red and added information in green:
  • When word is removed
  • When word is added
  • When sentence is removed
  • When sentence is added
  • When a letter is changed
  • When a number is changed
• Highlighting previously selected text as underlined

CTA on builder:

• Clear button removes selection and allows user to select afresh/ a different text block.
• Add to story button replaces the original text

Navigation:

• Back arrow takes user to story builder
• Device back key takes user to story builder

Test Scenarios

Open questions