Page MenuHomePhabricator

Implement tabbed browsing design
Closed, ResolvedPublic5 Estimate Story Points

Description

  • Implement styles (see comment) on Dmitry's prototype
  • Make a reusable component for displaying a page preview natively (a link preview view)

This seems to be a really popular request. E.g.:
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom;TicketID=7630203
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom;TicketID=7629733
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom;TicketID=7634980
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom;TicketID=7632135
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom;TicketID=7626674
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom;TicketID=7604686
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom&TicketID=8299981
https://ticket.wikimedia.org/otrs/index.pl?Action=AgentTicketZoom&TicketID=8324750

As a power-reader, I want a way to be able to see multiple pages I've been reading recently.

This is for brainstorming user experience possibilities for tabbed browsing, one of the most-requested features from our users.
Since our page-viewing components are fairly modular and self-contained, it should actually be pretty easy to implement tabbed browsing in some sense. We simply need to invent a clever user experience to surface them.

Research - how do users browse through multiple tabs in chrome/safari/other popular browsers
Consider users who don't use any browsers - think the internet is their google app
How could this relate to History page, could they be the same thing?

Details

Reference
bz67251
Related Gerrit Patches:
apps/android/wikipedia : masterTabbed browsing.

Event Timeline

bzimport raised the priority of this task from to High.Nov 22 2014, 3:33 AM
bzimport set Reference to bz67251.
bzimport added a subscriber: Unknown Object (MLST).
Krenair created this task.Jun 28 2014, 4:41 PM

There are other requests in last time, too. Is there any progress/discussion? :)

(In reply to Florian from comment #1)

There are other requests in last time, too. Is there any
progress/discussion? :)

This is actually a fairly big undertaking. Our goals are to increase the number of active editors, and although we do want to also take some time to make the app fantastic for reading, copying over features of browsers isn't really high on our priority list.

This is definitely something we're interested in doing, but it'll be a lot further down the line.

ok, thanks for reply Dan, totally understandable. Looking forward to all related to this :)

Krenair reopened this task as Open.Apr 9 2015, 4:38 PM
Krenair updated the task description. (Show Details)
Krenair set Security to None.
Krenair added subscribers: Dbrant, awight, Aklapper.
Florian updated the task description. (Show Details)Apr 20 2015, 8:14 AM
Florian updated the task description. (Show Details)Apr 29 2015, 7:34 AM

Change 214117 had a related patch set uploaded (by Dbrant):
[WIP] Tabbed browsing.

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

KLans_WMF renamed this task from Tabbed browsing to BLOCKED BY DESIGN: Tabbed browsing.Jun 2 2015, 8:13 PM
Ragesoss removed a subscriber: Ragesoss.Jun 5 2015, 5:47 PM
KLans_WMF renamed this task from BLOCKED BY DESIGN: Tabbed browsing to Implement tabbed browsing design.Jun 8 2015, 7:44 PM
Deskana removed a subscriber: Deskana.Jun 8 2015, 7:45 PM
KLans_WMF updated the task description. (Show Details)Jun 8 2015, 7:48 PM
KLans_WMF edited a custom field.
KLans_WMF updated the task description. (Show Details)

Couple of design notes here:

  • Need icon for action bar (@Dbrant has a pretty decent looking one, need to look at some alternatives)
  • Reduce drop shadow for cards
  • Increase width of each card

To clarify (for code reviewers), the current incarnation of the Tabs patch is acceptable for an MVP. Additional evolution of the design, as shown in the mockup above, will be done in subsequent tasks.

Change 214117 merged by jenkins-bot:
Tabbed browsing.

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

Met with Dbrant and made changes to the drop shadows for the top edge of the card.

Signedoff by design

Questions:

  1. If I am in tabbed view and click on 'Add tab' - invariably, the Main page article will be added - in fact, Main page article tab can be added many times.
  1. If I am in an article that was tabbed and I click on one of the link and then on the tab icon - my previously tabbed article will be replaced.

The same(the replacement of the most recent tab) happens if I navigate back to some articles and try to tab it.
So I can put into tabs only articles found as a result of an explicit search?

@Etonkovidova, to answer your questions:

  1. When the user adds a new tab, filling it automatically with the Main Page seems like a sensible choice. The alternative would be a blank screen, or perhaps a random page, but neither of those seemed particularly useful.
  1. To open a link in a new tab, you can long-press on the link and select "Open in new tab". The tab icon in the toolbar simply shows the tabs that are currently open. Each tab keeps its own history of pages browsed. So, when you press the tab icon in the toolbar, the title on the current tab is the name of the currently displayed page. Similarly, when you press Back, you will navigate backwards through the history in the current tab.