Firefox/Projects/Extension Manager Redesign
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.
Goals
- Allow users to quickly locate the add-on they want to inspect
- Provide simple, usable controls for basic add-on operations such as disabling and uninstalling
- Allow new forms of add-ons, such as jetpacks and personas, to be maintained and configured easily alongside traditional add-ons
- (at best) Provide users with a consistent place to go for a particular add-on's preferences, or (at worst) provide users with a consistent place to go to launch a particular add-on's preferences
- Indicate to the user that updates are available without blocking the startup of Firefox
- Allow the user to choose silent updates if they prefer, and for those updates to happen without interfering with browsing
- Streamlining the install process to as few steps as possible
- Providing the user with a clear indication of the process and what actions are needed, especially in the face of possibly differing install experiences per add-on (restart required vs not)
- Providing a compelling first run experience to new add-ons users, including showing what add-ons can do in a way that makes sense to non-technical users
- Allowing users to search for add-ons from within the Add-ons manager, only requiring a visit to AMO when greater community involvement or information is sought
- Provide a way to rank add-ons by size, RAM, etc to see if disabling one would give a significant performance boost
Non-Goals
Status
- IN FLIGHT
- Started Implementation
- Tracking Bugs:
- Project Members: Unfocused, Boriss, Mossop
- Status Summary: Redoing wiki, taking care of some edge cases, specifying how jetpack/extensions and personas/themes work together
Design
Timeline / Milestones
- 2010/01 - [Complete] Mockups for main browser window interface with N tabs
- 2010/02 - [Complete] Begin implementation work on graphic elements and code changes
- 2010/03 - [A1] Alpha quality implementation of new theme on mozilla-central
- 2010/03 - [DCP] Review with product drivers for feedback/plan alteration
- 2010/05 - [A2] All graphic collateral (icons, image files) complete and reviewed
- 2010/?? - [B1] Beta quality implementation of new theme on mozilla-central
- 2010/?? - [FINAL] All work complete
Delivery Requirements
- Requires an add-on compatibility changing application version increment
- Requires full alpha and beta testing with over 50,000 users on all platforms
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)
- No impact to Ts or TXul metrics
Dependencies
- 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
Testing
- [Perf] Ts and TXUL should be monitored closely as code lands
- [Compatibility] Test with OS alternate themes (ie: Classic, Tan, Aqua)
- [Security] No security review required
Related Projects
- App Button/App Menu + Menu Cleanup
- Home Tab
- App Tabs
- Location Bar
- Browser Notifications (Doorhangers)
- browser.js cleanup
Status Summary (transcluded)
Redoing wiki, taking care of some edge cases, specifying how jetpack/extensions and personas/themes work together
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: Past Work
Madhava worked on redesigning the add-ons manager in 2007, and posted his work here. He also designed much of the current add-ons manager for Firefox 3, which is largely unchanged today.
Current Add-ons Manager
- Main article: Current Add-ons Manager
Goals
- Main article: Prioritized Goals
- Main article: Redesign Themes
There are five main areas of the add-ons manager that this redesign will involve:
- 1. Maintaining and Configuring
- 2. Updating
- 3. Installing
- 4. Discovering
- 5. Troubleshooting
Tier One: |
Tier Two: |
Tier Three: |
1. Maintaining and Configuring | 2. Updating | 4. Discovering |
3. Installing | 5. Troubleshooting |
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
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.
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
Themes and Personas View
((coming soon))
Interaction design
Main Functionality
Searching, Downloading, and Installing Add-ons Within the Manager=
Downloading and Installing Add-ons from AMO
Edge Cases
Team
- Sprint lead
- Boriss
- Development
- Unfocused, Mossop
- AMO liaison
- Nick and Fligtar
- Other contacts
- Jetpack:
- Atul, Aza
- Personas:
- Amy Zehren(?)
- Firebug:
- Firebug team is currently designing a new install/update solution for Firebug extensions. Let me know if anyone is interested in discussing it. jjb
Resources
Past work
- 3/2006: Extension Manager UI Comments from developers on redesign ideas
- 7/2007: Firefox:Add-ons Manager UI: Madhava's two-panel proposed design
- 12/2007 Add-ons Manager UI interim rev2 Scaled back version of above, one panel design, very similar to current
- 1/2010 Older, Expanded version of Add-ons Manager Wiki Scaled back version of above, one panel design, very similar to current
Feedback Received
- Main article: Feedback from Blog Posts
Bugs
- 256509 install without restart
Not Current Images & Wireframes
- Main article: Not Current Images & Wireframes