Firefox/Projects/Extension Manager Redesign: Difference between revisions

Jump to navigation Jump to search

Firefox/Projects/Extension Manager Redesign (view source)

Revision as of 20:02, 3 March 2010

2,755 bytes removed ,  3 March 2010
no edit summary
(+goals)
No edit summary
Line 1: Line 1:


= Pitch =
= Pitch =
The new theme for Firefox will modernize the web browser interface, reflecting the power, simplicity and customizability of the world's most popular browser. Ensuring that the application feels like a natural part of the user's desktop, web life, and task flow are key goals.
The new theme for Firefox will modernize the web browser interface, reflecting the power, simplicity and customizability of the world's most popular browser. Ensuring that the application feels like a natural part of the user's desktop, web life, and task flow are key goals.


= Goals =
= Goals =
Line 31: Line 28:
* '''Project Members:''' Unfocused, Boriss, Mossop
* '''Project Members:''' Unfocused, Boriss, Mossop
* '''Status Summary:''' <onlyinclude>Redoing wiki, taking care of some edge cases, specifying how jetpack/extensions and personas/themes work together</onlyinclude>  
* '''Status Summary:''' <onlyinclude>Redoing wiki, taking care of some edge cases, specifying how jetpack/extensions and personas/themes work together</onlyinclude>  


= Design =
= Design =
* [[Firefox/Projects/New Theme/Windows|Windows]]
* [[Firefox/Projects/Extension_Manager_Redesign/design|design]]
* [[Firefox/Projects/New Theme/Linux|Linux]]
* [[Firefox/Projects/New Theme/Mac|Mac]]


 
= Timeline / Milestones = (not accurate)
= Timeline / Milestones =
* 2010/01 - <span style="color: #7e7e7e">'''[Complete]'''</span> Mockups for main browser window interface with N tabs
* 2010/01 - <span style="color: #7e7e7e">'''[Complete]'''</span> Mockups for main browser window interface with N tabs
* 2010/02 - <span style="color: #7e7e7e">'''[Complete]'''</span> Begin implementation work on graphic elements and code changes
* 2010/02 - <span style="color: #7e7e7e">'''[Complete]'''</span> Begin implementation work on graphic elements and code changes
Line 48: Line 41:
* 2010/?? - <span style="color: #567da8">'''[FINAL]'''</span> All work complete
* 2010/?? - <span style="color: #567da8">'''[FINAL]'''</span> All work complete


 
= Delivery Requirements =(not accurate)
= Delivery Requirements =
* Requires an add-on compatibility changing application version increment
* Requires an add-on compatibility changing application version increment
* Requires full alpha and beta testing  with over 50,000 users on all platforms
* Requires full alpha and beta testing  with over 50,000 users on all platforms


 
= Constraints = (not accurate)
= Constraints =
* Designs completed and accepted for Windows (XP, Vista and Windows 7, in Classic and with Windows themes applied), OSX (10.5 and later) and Linux (Ubuntu 9.10 and later)
* Designs completed and accepted for Windows (XP, Vista and Windows 7, in Classic and with Windows themes applied), OSX (10.5 and later) and Linux (Ubuntu 9.10 and later)
* No impact to Ts or TXul metrics
* No impact to Ts or TXul metrics


 
= Dependencies = (not accurate)
= Dependencies =
* Ability to draw in title bar of window on all operating systems (Core::Widget) {{bug|513157}}
* Ability to draw in title bar of window on all operating systems (Core::Widget) {{bug|513157}}
* Re-implement tab strip as toolbar (Toolkit::Tabbed Browser) {{bug|347930}}
* Re-implement tab strip as toolbar (Toolkit::Tabbed Browser) {{bug|347930}}


 
= Testing = (not accurate)
= Testing =
* <span style="color: #7e7e7e">'''[Perf]'''</span> Ts and TXUL should be monitored closely as code lands
* <span style="color: #7e7e7e">'''[Perf]'''</span> Ts and TXUL should be monitored closely as code lands
* <span style="color: #7e7e7e">'''[Compatibility]'''</span> Test with OS alternate themes (ie: Classic, Tan, Aqua)
* <span style="color: #7e7e7e">'''[Compatibility]'''</span> Test with OS alternate themes (ie: Classic, Tan, Aqua)
* <span style="color: #7e7e7e">'''[Security]'''</span> No security review required
* <span style="color: #7e7e7e">'''[Security]'''</span> No security review required


 
= Related Projects = (not accurate)
= Related Projects =
* App Button/App Menu + Menu Cleanup
* App Button/App Menu + Menu Cleanup
* [[Firefox/Projects/Home Tab|Home Tab]]
* [[Firefox/Projects/Home Tab|Home Tab]]
Line 82: Line 70:




******


== Status Summary (transcluded) ==


<onlyinclude>Redoing wiki, taking care of some edge cases, specifying how jetpack/extensions and personas/themes work together</onlyinclude>


== Background  ==
This wiki will serve as a planning page for a redesign of the Add-ons Manager for Firefox 3.7.
=== Past work  ===
::''Main article: [[Extension Manager:UI Update oldversion#Past_work|Past Work]]''
Madhava worked on redesigning the add-ons manager in 2007, and posted his work [https://wiki.mozilla.org/Firefox:Add-ons_Manager_UI here]. He also [https://wiki.mozilla.org/Firefox:Add-ons_Manager_UI_interim_rev2 designed much of the current add-ons manager] for Firefox 3, which is largely unchanged today.


http://people.mozilla.com/~madhava/files/addons/manager/2007-08-21/am1.png  
http://people.mozilla.com/~madhava/files/addons/manager/2007-08-21/am1.png  
Line 138: Line 114:
|}
|}


== Design  ==


For the purposes of development, this wiki is explicitly separating the visual design of the add-ons manager with the interaction design.  The visual design section will have the most up-to-date mockups of how the add-ons manager will look, and the interaction design section will have the most up-to-date mockups of how the add-ons manager will behave.  The reason for this separation is so that smaller changes to the design will not require re-doing all of the interaction design mockups.  It can be assumed that the interaction mockups are up-to-date insofar as the highlighted behavior is effected.


=== Visual Design ===
----
 
The default Add-ons Manager view will be in a two-panel basic hierarchy view within the content area of the browser. Add-on categories will be in the left panel, and expanded view will be on the right.
 
The following are not pixel-perfect finals graphics, but mockups for placement.  Graphics and colors should be assumed to be placeholders.
 
An add-on can be viewed in three ways in the right panel:
 
==== Digest View ====
 
Digest view shows a small amount of information, similar to what the current add-ons manager shows, which is visible when add-ons are viewed in a list.  In this view, the following are visible for an installed add-on:
 
*Add-on Name
*Author name with link to AMO Profile
*Partial add-on Description
*Disable and Remove Buttons
*Date last updated
*Rating
*Link to Expanded Digest View
 
[[File:Digest_view_from_biggerleftcolumn_324.png]]
 
==== Expanded Digest View ====
 
Expanded digest view gives the full add-on description, with links to the add-on's homepage, AMO profile, badness score, and Contribute link.
 
[[File:Expanded_view_32432.png]]
 
==== Detail View ====
 
Details view shows one add-on in the full content area.  The following are visible for an installed add-on:
 
*Add-on Name
*Author name with link to AMO Profile
*Add-on Description
*Disable and Remove Buttons
*Date last updated
*Contribute link
*Link to AMO Profile and developer's own add-on page
*Rating
*Add-on Preferences
 
[[File:Detail_view_32423.png]]
 
==== Themes and Personas View ====
 
((coming soon))
 
=== Interaction design ===
 
==== Main Functionality ====
 
====Searching, Downloading, and Installing Add-ons Within the Manager=====
 
[[File:From within manager make this horizontal.png|800px]]
 
====Downloading and Installing Add-ons from AMO====
 
[[File:Download_install_amo.png|800px]]
 
==== Edge Cases ====
 
== Team  ==


;Sprint lead&nbsp;  
;Sprint lead&nbsp;  
Line 245: Line 157:


::''Main article: [[Extension Manager:UI Update oldversion#Extra_Images|Not Current Images &amp; Wireframes]]''
::''Main article: [[Extension Manager:UI Update oldversion#Extra_Images|Not Current Images &amp; Wireframes]]''
=== Past work  ===
::''Main article: [[Extension Manager:UI Update oldversion#Past_work|Past Work]]''
Madhava worked on redesigning the add-ons manager in 2007, and posted his work [https://wiki.mozilla.org/Firefox:Add-ons_Manager_UI here]. He also [https://wiki.mozilla.org/Firefox:Add-ons_Manager_UI_interim_rev2 designed much of the current add-ons manager] for Firefox 3, which is largely unchanged today.
Jboriss
Confirmed users
954

edits

Retrieved from "https://wiki.allizom.org/Special:MobileDiff/205943"

Navigation menu