Re-order story pages
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	• AMuigai
	Nov 30 2021, 9:17 PM

Description

Background

Within the process of creating a Wikistory, a user may want to re-order the pages they had selected to have a better flow to the story.

Request

Allow users to reorder the pages in a story in a way that they can see what changes they are making.

Design details

Long press on a story page

01 Story page reorder.png (780×360 px, 351 KB)

Activate reordering when users long press(500ms) on a story page available at the bottom.

Float story page	Move story page	Settle story page

Float the story page in action.
Drag story page in action to its desired position.
Settle story page to its new location when a user lifts the finger.
If first story page is in action, allow scrolling to it's right only.
If last story page is in action, allow scrolling to it's left only.

Note: During development, we can explore how we can provide tactile feedback after long-press on a story page. Tactile feedback can inform users that they can start reordering.

Design details

Details

	Subject	Repo	Branch	Lines +/-
	Re-order story pages	mediawiki/extensions/Wikistories	master	+260 -2

Customize query in gerrit

Related Objects

Mentioned In: rEWST75dabe172af6: Re-order story pages
T308183: [Improvement] Changing the animation transition from style left to transition: translate3d
T308182: [Improvement] Scroll while reorder the frame story
T308179: [Improvement] Reorder frame better collision algorithm
T308175: [Story Builder] Delete Frame Animation (Current/Suggestion)
Mentioned Here: T308179: [Improvement] Reorder frame better collision algorithm

Event Timeline

• AMuigai created this task.Nov 30 2021, 9:17 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptNov 30 2021, 9:17 PM

• AMuigai triaged this task as Medium priority.Nov 30 2021, 9:29 PM

SGautam_WMF moved this task from Backlog to Definition on the Inuka-Team (Kanban) board.Dec 6 2021, 4:26 AM

SGautam_WMF updated the task description. (Show Details)Dec 7 2021, 1:04 PM

SGautam_WMF updated the task description. (Show Details)

• AMuigai edited projects, added Wikistories; removed Wikistories (Prototype).Jan 13 2022, 11:56 AM

• AMuigai moved this task from Backlog to MVP on the Wikistories board.Jan 13 2022, 7:41 PM

• AMuigai edited projects, added Wikistories (MVP); removed Wikistories.

SBisson moved this task from Definition to Backlog on the Inuka-Team (Kanban) board.Feb 4 2022, 7:34 PM

SBisson moved this task from Backlog to Definition on the Inuka-Team (Kanban) board.Mar 3 2022, 11:06 AM

SGautam_WMF renamed this task from Re-order story frames to Re-order story pages.Mar 21 2022, 1:56 PM

SGautam_WMF updated the task description. (Show Details)

SGautam_WMF updated the task description. (Show Details)Mar 23 2022, 12:38 PM

SGautam_WMF moved this task from Definition to Ready for Dev on the Inuka-Team (Kanban) board.Mar 23 2022, 5:14 PM

hueitan claimed this task.Mar 28 2022, 7:31 PM

hueitan moved this task from Ready for Dev to Dev on the Inuka-Team (Kanban) board.

Change 779543 had a related patch set uploaded (by Huei Tan; author: Huei Tan):

[mediawiki/extensions/Wikistories@master] Re-order story pages

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

gerritbot added a project: Patch-For-Review.Apr 12 2022, 7:23 PM

hueitan mentioned this in T308175: [Story Builder] Delete Frame Animation (Current/Suggestion).May 11 2022, 7:22 PM

hueitan mentioned this in T308179: [Improvement] Reorder frame better collision algorithm.May 11 2022, 7:34 PM

hueitan mentioned this in T308182: [Improvement] Scroll while reorder the frame story.May 11 2022, 7:46 PM

hueitan mentioned this in T308183: [Improvement] Changing the animation transition from style left to transition: translate3d.

hueitan moved this task from Dev to Code Review on the Inuka-Team (Kanban) board.May 19 2022, 9:00 AM

Change 779543 merged by jenkins-bot:

[mediawiki/extensions/Wikistories@master] Re-order story pages

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

hueitan mentioned this in rEWST75dabe172af6: Re-order story pages.May 20 2022, 3:19 PM

Maintenance_bot removed a project: Patch-For-Review.May 20 2022, 3:30 PM

SBisson moved this task from Code Review to QA on the Inuka-Team (Kanban) board.May 20 2022, 3:59 PM

ReleaseTaggerBot added a project: MW-1.39-notes (1.39.0-wmf.13; 2022-05-23).May 20 2022, 4:00 PM

Testing:

I have noticed some weird behaviour with this on my android device, using Chrome. Sometimes, it seems as though the page I want to move goes behind other pages and thus, does not get re-positioned. Here is a recording of the experience.

In T296783#7969985, @EUdoh-WMF wrote:

Testing:

I have noticed some weird behaviour with this on my android device, using Chrome. Sometimes, it seems as though the page I want to move goes behind other pages and thus, does not get re-positioned. Here is a recording of the experience.

We know this isn't perfect. We think T308179: [Improvement] Reorder frame better collision algorithm will fix it. In the meantime, I suggest moving it to design review to also get Sudhanshu's feedback to help prioritize the improvements.

Sounds good. Thanks!

Some other improvements to consider.

Increase the size of thumbnails to find out if it improves re-ordering.
Currently, if we long press on a thumbnail which is not active then ordering activates without first switching to the story page in action. This doesn't feel natural therefore as part of improvement first switch to the page users want to reorder follow by reordering. I will explain this with visual reference when provide detail info. about it.

I will add these two in a separate ticket.

SGautam_WMF moved this task from Design sign off to Product sign off on the Inuka-Team (Kanban) board.Jun 29 2022, 9:10 AM

SGautam_WMF closed this task as Resolved.Jun 30 2022, 3:58 AM

	F34854865: Reorder 01.png
	Dec 7 2021, 1:04 PM

Re-order story pagesClosed, ResolvedPublicActions

Description

Background

Request

Design details

Details

Related Objects

Event Timeline

Re-order story pages
Closed, ResolvedPublic
Actions