Mobile/UI/Designs/TouchScreen/Proposal8
This proposed mobile browser UI is based around a user action of "tap and hold" which displays both a radial menu of the most frequently used actions and other on-screen UI items in permanent locations for less-frequently accessed options.
Tap and drag actions are used to scroll the page. Scroll should be displayed only when the page is moving.
All UI is displayed only after a tap-and-hold, so the entire display area can be dedicated to content. The user taps and holds:
and after a period of time (to be determined - carefully!) the UI elements are displayed:
The radial menu is comprised (subject to change if we have better information about what is used most frequently) of Bookmarks, Tabs, Back, and Forward. A title bar, with a reload (or stop - more on this later) and a bookmarking star, and a "Tools" menu button in the lower right-hand corner are also displayed.
Note - when either back or forward are tapped, we should probably wait longer before fading the radial menu (even as the page changes underneath) so that a user can continue to hit one or the other to move further back or forward.
Titlebar
The idea behind showing frecency results immediately below the URL field is an attempt to give users some awesomebar-style benefit without having to type. Part of what makes the awesomebar powerful is that, with a keyboard, typing is the fastest way for a user to quickly narrow the field of what suggestions are appropriate. On a mobile device, typing is not as easy, so there's value to offering our best guesses as to what the user is looking for before they need to type at all.
(We could, alternatively, try using a list of most visited sites rather than the frequency and recency set).
That said, once people have to start typing, we should offer awesomebar results:
When a user has entered or chosen a site to go to, and the page begins loading, we display the following:
This bar fades after the page has finished loading. The user can tap on the "stop" button to cancel the page load.
Bookmarks
Bookmarking
Bookmarking works mostly the same way that it does in Firefox 3.
Bookmarks List
mockups to come
Tabs
Option 1 (horizontal scroll)
Option 2 (all on screen)
Option 3 (vertical scroll)
Tools Menu
