Microformats/UE/ideas: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
| Line 15: | Line 15: | ||
== Navigation Toolbar == | == Navigation Toolbar == | ||
#Tabbed Toolbars (Faaborg): | #'''Tabbed Toolbars''' (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/tabbedToolbar.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/tabbedToolbar.jpg_large.jpg | ||
| Line 24: | Line 24: | ||
== Location Bar == | == Location Bar == | ||
'''Plus icon''' in the location bar (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/locationBarMenu.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/locationBarMenu.jpg_large.jpg | ||
== Toolbar == | == Toolbar == | ||
#Tabbed Toolbars, see Navigation Toolbar above (Faaborg) | #'''Tabbed Toolbars''', see Navigation Toolbar above (Faaborg) | ||
#Operator (Kaply): | #'''Operator''' (Kaply): | ||
http://people.mozilla.com/~faaborg/files/20061215-introducingOperator/summit1.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20061215-introducingOperator/summit1.jpg_large.jpg | ||
| Line 44: | Line 44: | ||
== Side Bar == | == Side Bar == | ||
#The Content Sidebar (Faaborg): | #'''The Content Sidebar''' (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/contentSidebar.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/contentSidebar.jpg_large.jpg | ||
#Sub-Page History (Faaborg): | #'''Sub-Page History''' (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/microformatHistoryLocations.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/microformatHistoryLocations.jpg_large.jpg | ||
#Sub-Page Favorites (Faaborg): | #'''Sub-Page Favorites''' (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/microformatFavoritesMITTrip.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/microformatFavoritesMITTrip.jpg_large.jpg | ||
| Line 57: | Line 57: | ||
===General=== | ===General=== | ||
#Live Clipboard (Ozzie, and his concept development team): | #'''Live Clipboard''' (Ray Ozzie, and his concept development team): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/liveClipboardAmbiguity.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/liveClipboardAmbiguity.jpg | ||
#Operator 6.0.2 (Kaply): | |||
#'''Operator 6.0.2''' (Kaply): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/operator062.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/operator062.jpg | ||
===Display=== | ===Display=== | ||
#Glass, on a light page (Faaborg): | #'''Glass''', on a light page (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_glassOnWhite.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_glassOnWhite.jpg_large.jpg | ||
#Glass, on a dark page (Faaborg, idea suggested by Beltzner): | #'''Glass''', on a dark page (Faaborg, idea suggested by Beltzner): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_glassOnBlack.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_glassOnBlack.jpg_large.jpg | ||
#Lights (Faaborg. idea suggested by Shaver): | #'''Lights''' (Faaborg. idea suggested by Shaver): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_lights.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_lights.jpg_large.jpg | ||
#Bubbles (Faaborg | |||
#'''Bubbles''' (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_bubbles.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_bubbles.jpg_large.jpg | ||
#Push, the page literally pushed toward you in areas that contain microformated content (Faaborg): | |||
#'''Push''', the page literally pushed toward you in areas that contain microformated content (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_push.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_push.jpg_large.jpg | ||
#Dock for OS X, on light page (Faaborg): | |||
#'''Dock''' for OS X, on light page (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_dockOnWhite.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_dockOnWhite.jpg_large.jpg | ||
#Dock for OS X, on a dark page (Faaborg): | |||
#'''Dock''' for OS X, on a dark page (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_dockOnBlack.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_dockOnBlack.jpg_large.jpg | ||
#Start for Vista (Faaborg): | |||
#'''Start''' for Vista (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_start.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_start.jpg_large.jpg | ||
#File for OS X (Faaborg): | #'''File''' for OS X (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_fileOSX.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_fileOSX.jpg_large.jpg | ||
#File for Vista (Faaborg): | |||
#'''File''' for Vista (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_fileVista.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_fileVista.jpg_large.jpg | ||
#Target Acquired for Ubuntu (Faaborg): | |||
#'''Target Acquired''' for Ubuntu's Human theme (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_targetAcquired.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/layer_targetAcquired.jpg_large.jpg | ||
===Interaction with a Specific Microformat=== | ===Interaction with a Specific Microformat=== | ||
#Non-Modal Design (Faaborg): | #'''Non-Modal Design''' (Faaborg): | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/nonModal1.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/nonModal1.jpg_large.jpg | ||
The user hovers their mouse over the icons and the entire area is highlighted: | The user hovers their mouse over the icons and the entire area is highlighted: | ||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/nonModal2.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/nonModal2.jpg_large.jpg | ||
#Contextual Menu (Faaborg, idea suggested by Tantek): | |||
#'''Contextual Menu''' (Faaborg, idea suggested by Tantek): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/descriptiveText.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/descriptiveText.jpg_large.jpg | ||
#Clover (Faaborg): | |||
#'''Clover''' (Faaborg): | |||
http://people.mozilla.com/~faaborg/files/20070204-detectionUI/clover.jpg_large.jpg | http://people.mozilla.com/~faaborg/files/20070204-detectionUI/clover.jpg_large.jpg | ||
==Find Bar== | ==Find Bar== | ||
| Line 117: | Line 130: | ||
==Status Bar== | ==Status Bar== | ||
#Operator 6.0.1 (Kaply) | #'''Operator 6.0.1''' (Kaply) | ||
#Tails Export (de Bruin) | #'''Tails Export''' (Robert de Bruin) | ||
Revision as of 09:35, 4 February 2007
Please Add Your Designs to this Page
Have a cool idea about microformat detection UI? Add it below and share it with the world, (or at least the Mozilla community). Mockups at any level of fidelity, creativity, and general wackiness are completely welcome.
Categorization of Conceptual Mockups
Conceptual mockups on this page are categorized by area in the Firefox chrome:
Menu Bar
There are currently no conceptual mockups for this area in the chrome.
- Tabbed Toolbars (Faaborg):
Search Bar
There are currently no conceptual mockups for this area in the chrome.
Location Bar
Plus icon in the location bar (Faaborg):
Toolbar
- Tabbed Toolbars, see Navigation Toolbar above (Faaborg)
- Operator (Kaply):
Tabstrip
There are currently no conceptual mockups for this area in the chrome.
Notification Box
There are currently no conceptual mockups for this area in the chrome.
Rumor has it that another microformats extension for Firefox may be using this style of interaction. I'll link to it once it is publicly released.
Side Bar
- The Content Sidebar (Faaborg):
- Sub-Page History (Faaborg):
- Sub-Page Favorites (Faaborg):
Content Area
General
- Live Clipboard (Ray Ozzie, and his concept development team):
- Operator 6.0.2 (Kaply):
Display
- Glass, on a light page (Faaborg):
- Glass, on a dark page (Faaborg, idea suggested by Beltzner):
- Lights (Faaborg. idea suggested by Shaver):
- Bubbles (Faaborg):
- Push, the page literally pushed toward you in areas that contain microformated content (Faaborg):
- Dock for OS X, on light page (Faaborg):
- Dock for OS X, on a dark page (Faaborg):
- Start for Vista (Faaborg):
- File for OS X (Faaborg):
- File for Vista (Faaborg):
- Target Acquired for Ubuntu's Human theme (Faaborg):
Interaction with a Specific Microformat
- Non-Modal Design (Faaborg):
The user hovers their mouse over the icons and the entire area is highlighted:
- Contextual Menu (Faaborg, idea suggested by Tantek):
- Clover (Faaborg):
Find Bar
There are currently no conceptual mockups for this area in the chrome.
Status Bar
- Operator 6.0.1 (Kaply)
- Tails Export (Robert de Bruin)