768046 - Tab Tray Tweaks (phone)

Status: RESOLVED INVALID

(Firefox for Android Graveyard :: General, defect)

Description

[Ian Barlow (:ibarlow)]

Attachment: tab tray tweaks

We are *almost* there with our new tabs tray, there are just a few remaining bits of polish and interaction refinements we need to address:

1. Keep the tab counter in the top bar when we open the tray. This way, users don't have to reach down to close the tray and can just tap the same spot twice. As a result, we'll want to move the + and Remote Tab icons to the left.

2. Put a divider line between the tab counter and the other icons in the header

3. Add a subtle shadow under the top bar, and above the Title Bar, so the tabs tray actually looks like a physical tray that slides underneath.

4. Keep the tab shape in the top right corner of the screen, so the transition from closed tabs to open tabs feels more natural

5. Move header and content down further when the tabs tray is open, to allow more tabs area to be shown. The header and content should occupy only about 20% of the screen area.

A mockup of all these notes is attached here.

Comment 1

[Ian Barlow (:ibarlow)]

Attachment: Mockup of tablet tweaks

As per Sriram's request, here is an equivalent mockup for the tabs menu on tablets.

Comment 2

[Mark Finkle (:mfinkle) (use needinfo?)]

Ian - are these tweaks still the "current design"? The phone mockup for example does not show the menu button in the rightmost position when the tray is open.

Comment 3

[Ian Barlow (:ibarlow)]

No, these mockups are out of date -- the tray has been updated in other bugs. The only outstanding issue here is: 

5. Move header and content down further when the tabs tray is open, to allow more tabs area to be shown. The header and content should occupy only about 20% of the screen area.