[1304] One-line Browser Toolbar

[athomasmoz]

Why/User Benefit/User Problem

As a user, I want the browser toolbar to collapse as I'm scrolling through websites, so that I can see as much of the website content as possible on the screen at once

What / Requirements

• Toolbar collapses to single-line when viewing a webpage

Design

Source file is available on Google Drive ~/Firefox - Fire TV/Mocks/Toolbar/FFTV-Toolbar.sketch

[aminalhazwani]

Hello again :) Here some more details for the toolbar design. Something we are thinking about is to keep the same toolbar for both the homescreen and browsing.

On launch the homescreen will display the search bar focused. The other navigation buttons are disabled because there is no website open in the background.

If we have access to the MIC button on the Fire TV remote we could display a remote hint below the search to enable users to search or dictate URLs via voice.

Moving horizontally the focus will move to the next available button. We should talk more about if we would want to keep the MIC remote hint always visible or not.

Moving vertically the focus will the next available channel.

While browsing the toolbar behaves similarly as when on launch. Pressing the HOME button will reveal the toolbar and the channels.

And the focus moves in the same way as described above.

[Sdaswani]

@athomasmoz we need to defer this work until #1310 and #1394 is completed.

[dnarcese]

@lime124 I played around with some different layouts for the toolbar. Do you have some feedback on which option looks the best- or some suggested changes to improve any of them?

Option 1)

Option 2)

Option 3)

[athomasmoz]

Blocking implementation this story on the ticket to move settings to channel. Once that's implemented, we don't need the settings icon (as described in Amin's previous design).

Also, re-assigning to UX to decide where the Firefox branding should go with the new overlay design. That design should also consider the addition of the exit/home button from #1619

[liuche]

With split overlay in #1664, the two-line urlbar takes up a lot of space, so I asked @brampitoyo for thoughts on prioritizing this. e.g., would we want to ship split overlay with the large 2-line toolbar, or can we prioritize this enough (and UX has time) to ship both the 1-line toolbar and the split overlay together?

[brampitoyo]

@liuche since the UX for the one-line toolbar has been completed, I would recommend shipping both that and the split overlay together.

As a user, acclimating to new habits is hard, so I don’t want to see constant rejiggering whenever a new version is released.

The hint bar is a separate issue. It doesn’t replace any UI elements that the user is already used to. Instead, it adds something small and (hopefully) not obstrusive. Because of that, we can deliver it separately from other elements.

[brampitoyo]

Here are the measurements for the one-line browser toolbar, seen within the context of the homescreen overlay:

[brampitoyo]

This issue is (I think) now ready for engineering breakdown, so I’m unassigning myself.

[brampitoyo]

@liuche I’ve updated the specs up above:

• Add in the Firefox logo: top-left corner, first icon
• Take out the voice input hint. We don’t have it yet; and by the time we have it, we can explain it using the hint bar

#1315 (comment)

[liuche]

Since the work here is unblocked, removing the tag - it looks like @dnarcese already did some work for this, so I'm pulling it into the sprint. Note that there may be two places where this needs to be changed, because we want to keep both layouts in order to run the A/B test.

@dnarcese if you have time, could you pick this up? It looks like one of your earlier explorations looks very similar to this mock :)

[liuche]

@brampitoyo ah, sorry I didn't catch this earlier, but it looks like we now no longer have the settings icon in the one-line toolbar. What would this look like with one more icon? For context, iirc the AC toolbar would shrink the urlbar to accommodate more icons.

[liuche]

From our recent discussions, I don't think we actually have a finalized decision on this.

@brampitoyo could you give some context on where this falls in the bigger picture of the new designs/discussions you're having with @athomasmoz - is this blocked again, until we decide on which "overlay" direction and many-buttons problem? FWIW, since we're pausing work on split overlay this isn't blocking anything anymore, but is in a place where it will probably block something fairly soon.

[brampitoyo]

@liuche Yes. You’re right. This issue is blocked again until we have decided on a homescreen design that would either accommodate all the toolbar items, or solve this problem another way.

For now, we’re hoping that the hint bar (control assistance) and button label work will help some of our low-hanging issues!

[mcomella]

@brampitoyo Do we still want to do this? If not, please close. If so, no action necessary.

[brampitoyo]

@mcomella Putting lots of channels on the homescreen takes priority over having a homescreen overlay, so we don’t want to do this anymore.