User:Ge.diego/User Interface Mockup: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
No edit summary
No edit summary
Line 47: Line 47:
As stated in [[User:Ge.diego/Tab_Management_Comments|my tab management comments]], the Opera browser uses already this functionality, and with a very good criterion in my opinion.
As stated in [[User:Ge.diego/Tab_Management_Comments|my tab management comments]], the Opera browser uses already this functionality, and with a very good criterion in my opinion.


The tab should visually cover everything related to it. These elements qualify '''(3)''':
The tab should visually cover everything related to it. These elements qualify because they are changing depending on which tab te user is '''(3)''':
# Back '''[<-]''' and forward '''[->]''' button.
# Back '''[<-]''' and forward '''[->]''' button.
# Stop button '''[[]]'''.
# Stop button '''[[]]'''.
Line 55: Line 55:
# The throbber [.i. -O- 'i'].
# The throbber [.i. -O- 'i'].


The tab should not cover elements not related to the current page '''(4)''':
The tab should not cover elements not related to the current page '''(4)'''. This element remain constant regardless of the tab selected:
#The personal bookmark toolbar.
#The personal bookmark toolbar.


All these changes are represented above in the mockup.
All these changes are represented above in the mockup.

Revision as of 19:38, 5 May 2006

Mockup proposed by Ge.diego user

This mockup is based on the one proposed by Mike Beltzner in the User interface design FX2 page.

Outline of the mockup

Mockup proposed:
                         (0)                                    (0) -.
             (0)          |        (0)-.----.           (0) -.       |
              |           v            v    v                v       v
 .----------------------------------------------------------------------.
 | File   Edit   View   History   Bookmarks   Tools   Help     [_][=][x]|
 |----------------------------------------------------------------------|
 |(.O) (&) (BBC News v) (Mozilla)                                       |<-.
 |----------------------------------------------------------------------|  |
 |.-----------,.-----------,.-----------,-------------------------------| (4)
 ||{} Bar     || {} Foo (x)|| {} Baz    |                               |
 |-------------'           '--------------------------------------------|
 |.--. .--. .--.  ,-------------------..--,,-,   ,----------.---,,  .i. |
 ||<-| |->| |[]| ( |^v|{}www.foo.com v||.)||=>) (  google G |.O |)  -O- |<-.
 |'--' '--' '--'  `-------------------''--''-'   '----------'--v''  'i' |  |
 |----------------------------------------------------------------------| (3)
 |                                                                    |^|
 |                                                                    |H|
 :                             (page content)                         : :
 .                                                                    . .
 :                                                                    : :
 |                                                                    |V|
 |\\                                                                  //|
 '----------------------------------------------------------------------'
 | New tab: http://www.foobarbaz.com                                    |
 '----------------------------------------------------------------------'
  ^     ^                ^       ^                                    ^
  '     |                |       |                                    |
  '-(1) '- (0)      (0) -'       '- (0)                          (2) -'

New features proposed

Page resizer in both bottom corners (1)

I think the page resizer spends only a little amount of space and sometimes may be convenient (for example when you want to resize to see two pages at a time) to resize from the left.

Maintain page resizer in a maximized window (2)

When you have the browser window maximized, in order to resize it, you have first to restore button and then pull the page resizer. i think it could be more usable to allow the user to pull the page resizers whenever he wants to.

Put tab bar on top of embraced elements

As stated in my tab management comments, the Opera browser uses already this functionality, and with a very good criterion in my opinion.

The tab should visually cover everything related to it. These elements qualify because they are changing depending on which tab te user is (3):

  1. Back [<-] and forward [->] button.
  2. Stop button [[]].
  3. URL bar [{} www.foo.com v].
  4. The RSS [.)] and Go [=>] buttons.
  5. The search text and icon [ google G ] and search engine selection drop-down button [.O].
  6. The throbber [.i. -O- 'i'].

The tab should not cover elements not related to the current page (4). This element remain constant regardless of the tab selected:

  1. The personal bookmark toolbar.

All these changes are represented above in the mockup.