Page MenuHomePhabricator
Create Task
Maniphest T320527

[S] Mobile: Enable users to open and close quick view on special:search results page
Closed, ResolvedPublic
Actions

Assigned To
SimoneThisDot
Authored By
Sneha
Oct 11 2022, 3:46 PM
Tags
Referenced Files
F35605545: Special_Search (57).png
Oct 20 2022, 7:50 PM
F35605542: Special_Search (55).png
Oct 20 2022, 7:50 PM
F35601175: open quick view.png
Oct 19 2022, 9:04 PM
F35564671: Special_Search (41).png
Oct 12 2022, 2:08 PM
F35564674: Special_Search (40).png
Oct 12 2022, 2:08 PM
Subscribers
Aklapper
Etonkovidova
SimoneThisDot
Sneha

Description

This ticket describes the interaction of opening and closing quick view on Mobile.
More information on the overview of quick view in the epic ticket T306341

Opening

  • When the user clicks on the snippet or the arrow (pointing down), open the quick view below it. (This ticket can show a box in the specified space as details of quick view will be covered in other tickets.)
  • The position of the arrow will not shift in relation to the snippet.
  • Do not shift the screen if the quick view is above the fold.

[] Move the screen up if the quick view is below the fold.

  • Inverse the arrow to point up (indicating that quick view can be close by tapping on it).
  • If another quick view is open, the previous one will close and the new one will open. Make the opening/closing smoother by having the content slide up or down i.e. smoother animation.

Specs in Figma

Special_Search (55).png (800×360 px, 80 KB)

Closing

  • When the user click on the snippet or the arrow (pointing up) close the preview.
  • Preview will also be automatically closed if another preview is opened. Make the opening/closing smoother by having the content slide up or down i.e. smoother animation.
  • The position of the arrow remains fixed in relation to the snippet.
  • Show arrow pointing to the quick view, establishing the connection between the result selected an
  • Inverse the arrow to point down (indicating that quick view can be opened by tapping on it).

Specs in Figma

Special_Search (57).png (800×360 px, 60 KB)

  • Add subtle animation to arrow while opening and closing. Arrow animation example on this link

Note: A new ticket has been created to allow users to open multiple previews at once to avoid jumping of the content. To be re-evaluated in milestone 4. T321590

Details

SubjectRepoBranchLines /-
Enable users to open and close quick view on special:search results pagemediawiki/extensions/SearchVuemaster 353 -117
Customize query in gerrit

Related Objects

Event Timeline

Sneha created this task.Oct 11 2022, 3:46 PM
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptOct 11 2022, 3:46 PM
CBogen moved this task from Incoming to Needs Design on the Structured-Data-Backlog (Current Work) board.Oct 11 2022, 4:24 PM
Sneha mentioned this in T320528: [S] Mobile: Show arrows next to search results for quick view discoverability..Oct 11 2022, 7:20 PM
CBogen moved this task from Needs Design to Ready for Estimation on the Structured-Data-Backlog (Current Work) board.Oct 12 2022, 1:55 PM
CBogen added a project: SDAW-Search-Improvements (Milestone 3: QuickView mobile).
Sneha updated the task description. (Show Details)Oct 12 2022, 2:08 PM
Sneha mentioned this in T320743: [L] Mobile: Create a Quick View component.Oct 13 2022, 4:18 PM
Sneha updated the task description. (Show Details)Oct 13 2022, 4:22 PM
SimoneThisDot subscribed.Oct 18 2022, 11:35 AM

@Sneha While going through the milestone 3 tickets and we just noticed that this AC:
When another quick view is opened the previous one stays open (in the same scroll position user left it), unless the user explicitly closes it."

We need to have a chat about this point as it is going to really change the way we currently implement the SearchPreview.

I am going to start a thread in slack too and then report back the decision here.

SimoneThisDot added a comment.Oct 18 2022, 11:47 AM

Slack conversation: https://wikimedia.slack.com/archives/GKWRAH5FW/p1666093642183289

MarkTraceur renamed this task from Mobile: Enable users to open and close quick view on special:search results page to [S] Mobile: Enable users to open and close quick view on special:search results page.Oct 19 2022, 5:59 PM
MarkTraceur moved this task from Ready for Estimation to Ready for Development on the Structured-Data-Backlog (Current Work) board.
Sneha updated the task description. (Show Details)Oct 19 2022, 8:33 PM
Sneha updated the task description. (Show Details)Oct 19 2022, 9:04 PM
Sneha updated the task description. (Show Details)Oct 20 2022, 7:50 PM
SimoneThisDot claimed this task.Oct 25 2022, 3:10 PM
SimoneThisDot moved this task from Ready for Development to Doing on the Structured-Data-Backlog (Current Work) board.
Sneha mentioned this in T321590: Mobile: Allow users to open multiple search previews.Oct 25 2022, 4:04 PM
Sneha updated the task description. (Show Details)Oct 25 2022, 4:07 PM
SimoneThisDot moved this task from Doing to Code Review on the Structured-Data-Backlog (Current Work) board.Oct 31 2022, 2:55 PM
gerritbot added a comment.Nov 10 2022, 2:31 PM

Change 851057 had a related patch set uploaded (by Simone Cuomo; author: Simone Cuomo):

[mediawiki/extensions/SearchVue@master] Enable users to open and close quick view on special:search results page

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

gerritbot added a project: Patch-For-Review.Nov 10 2022, 2:31 PM
gerritbot added a comment.Nov 18 2022, 1:54 PM

Change 851057 merged by jenkins-bot:

[mediawiki/extensions/SearchVue@master] Enable users to open and close quick view on special:search results page

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

SimoneThisDot mentioned this in rESVU0dc4001dfcc3: Enable users to open and close quick view on special:search results page.Nov 18 2022, 1:55 PM
ReleaseTaggerBot added a project: MW-1.40-notes (1.40.0-wmf.12; 2022-11-28).Nov 18 2022, 2:00 PM
Maintenance_bot removed a project: Patch-For-Review.Nov 18 2022, 2:30 PM
matthiasmullie moved this task from Code Review to Needs QA on the Structured-Data-Backlog (Current Work) board.Nov 21 2022, 3:33 PM
Etonkovidova updated the task description. (Show Details)Jan 19 2023, 7:28 PM
Etonkovidova moved this task from Needs QA to Verify on Production on the Structured-Data-Backlog (Current Work) board.Jan 19 2023, 7:40 PM
Etonkovidova subscribed.

Checked on enwiki betalabs with &quickViewEnableMobile=1
(1) I didn't see the following spec implemented - checked on iPhone 6s only and in a browser emulator.

  • Move the screen up if the quick view is below the fold.

(2) Occasionally, the search preview opens without the thumbnail image although on the desktop an article does have the thumbnail displayed. The issue is not quite reproducible; there might be some factors related to betalabs env. Needs to be rechecked in the production.

Sneha added a comment.Jan 19 2023, 9:17 PM

Hi @Etonkovidova we can scratch the following acceptance criteria as it conflicts with the following ticket. T326345 Whatever issue there is it should be resolved in the new ticket.

  • Move the screen up if the quick view is below the fold.
Etonkovidova added a comment.Jan 19 2023, 9:18 PM
In T320527#8541912, @Sneha wrote:

Hi @Etonkovidova we can scratch the following acceptance criteria as it conflicts with the following ticket. T326345 Whatever issue there is it should be resolved in the new ticket.

  • Move the screen up if the quick view is below the fold.

Agree. Thx!

Etonkovidova closed this task as Resolved.Feb 3 2023, 12:14 AM
Etonkovidova updated the task description. (Show Details)
Etonkovidova updated the task description. (Show Details)
Content licensed under Creative Commons Attribution-ShareAlike (CC BY-SA) 4.0 unless otherwise noted; code licensed under GNU General Public License (GPL) 2.0 or later and other open source licenses. By using this site, you agree to the Terms of Use, Privacy Policy, and Code of Conduct. · Wikimedia Foundation · Privacy Policy · Code of Conduct · Terms of Use · Disclaimer · CC-BY-SA · GPL · Credits