Features/Desktop/Panel Menu

Please use "Edit with form" above to edit this page.

Status

Panel Menu
Stage	Planning
Status	In progress
Release target	`
Health	OK
Status note	`

{{#set:Feature name=Panel Menu

|Feature stage=Planning |Feature status=In progress |Feature version=` |Feature health=OK |Feature status note=` }}

Team

Product manager	Asa Dotzler
Directly Responsible Individual	Stephen Horlander
Lead engineer	`
Security lead	`
Privacy lead	`
Localization lead	`
Accessibility lead	`
QA lead	`
UX lead	Stephen Horlander
Product marketing lead	`
Operations lead	`
Additional members	`

{{#set:Feature product manager=Asa Dotzler

|Feature feature manager=Stephen Horlander |Feature lead engineer=` |Feature security lead=` |Feature privacy lead=` |Feature localization lead=` |Feature accessibility lead=` |Feature qa lead=` |Feature ux lead=Stephen Horlander |Feature product marketing lead=` |Feature operations lead=` |Feature additional members=` }}

Open issues/risks

`

Stage 1: Definition

1. Feature overview

For Firefox 4, we changed the menu to be a single, unified menu. This project is the next step in this evolution, which unifies the concepts of toolbar customization, adds the ability to customize the menu, and makes the 80/20/2 rule have a natural mapping in the UI.

It also provides a path for mapping the same menu structure to mobile devices like phones and tablets, as well as TVs and projection screens.

2. Users & use cases

Simplifying the ability for users to find what they're looking for, increase relative discoverability for the important items, have a predictable and consistent approach to interface customization.

3. Dependencies

`

4. Requirements

`

Non-goals

`

Stage 2: Design

5. Functional specification

`

6. User experience design

Known design requirements:

• Redesigned Panel based Firefox Menu living on the toolbar
• In-Content Customization Tab/Mode
• Icon drag-and-drop including:
  • Dragging from a tools palette to the Menu or a Toolbar
  • Dynamic icon rearrangement and visual placement (i.e. you can see exactly where you are placing your icon not an abstract placement indicator)
  • Visual indicators for acceptable drag areas
• Customization Mode Appearance including:
  • Additional browser padding
  • Toolbar and/or Window textures
  • De-emphasis of non-relevant areas of UI
• Contextual Options menu for:
  • Small Icons
  • "Reset to Default"
• Reduce toolbar item redundancy and complexity by eliminating "magical" button merging behavior

Potential requirements:

• Direct manipulation of items in addition to drag-and-drop:
  • Direct selection
  • Buttons for Add/Remove
• Layout options
  • Small Icons
  • "Reset to Default"

Potential design variations:

• Icon and Grid based menu vs. traditional single column menu

Panel Menu

Customization Tab Mode

Dragging Icon to Toolbar

Dragging Icon to Toolbar or Menu

TBD and Alternative Ideas

TBD: Direct Item Manipulation

Potential Alternative: One Column List Menu

Stage 3: Planning

7. Implementation plan

`

8. Reviews

Security review

`

Privacy review

`

Localization review

`

Accessibility

`

Quality Assurance review

`

Operations review

`

Stage 4: Development

9. Implementation

`

Stage 5: Release

10. Landing criteria

` {{#set:Feature open issues and risks=` |Feature overview=For Firefox 4, we changed the menu to be a single, unified menu. This project is the next step in this evolution, which unifies the concepts of toolbar customization, adds the ability to customize the menu, and makes the 80/20/2 rule have a natural mapping in the UI.

It also provides a path for mapping the same menu structure to mobile devices like phones and tablets, as well as TVs and projection screens. |Feature users and use cases=Simplifying the ability for users to find what they're looking for, increase relative discoverability for the important items, have a predictable and consistent approach to interface customization. |Feature dependencies=` |Feature requirements=` |Feature non-goals=` |Feature functional spec=` |Feature ux design=Known design requirements:

• Redesigned Panel based Firefox Menu living on the toolbar
• In-Content Customization Tab/Mode
• Icon drag-and-drop including:
  • Dragging from a tools palette to the Menu or a Toolbar
  • Dynamic icon rearrangement and visual placement (i.e. you can see exactly where you are placing your icon not an abstract placement indicator)
  • Visual indicators for acceptable drag areas
• Customization Mode Appearance including:
  • Additional browser padding
  • Toolbar and/or Window textures
  • De-emphasis of non-relevant areas of UI
• Contextual Options menu for:
  • Small Icons
  • "Reset to Default"
• Reduce toolbar item redundancy and complexity by eliminating "magical" button merging behavior

Potential requirements:

• Direct manipulation of items in addition to drag-and-drop:
  • Direct selection
  • Buttons for Add/Remove
• Layout options
  • Small Icons
  • "Reset to Default"

Potential design variations:

• Icon and Grid based menu vs. traditional single column menu

Panel Menu

Customization Tab Mode

Dragging Icon to Toolbar

Dragging Icon to Toolbar or Menu

TBD and Alternative Ideas

TBD: Direct Item Manipulation

Potential Alternative: One Column List Menu

|Feature implementation plan=` |Feature security review=` |Feature privacy review=` |Feature localization review=` |Feature accessibility review=` |Feature qa review=` |Feature operations review=` |Feature implementation notes=` |Feature landing criteria=` }}

Feature details

Priority	P1
Rank	999
Theme / Goal	Experience
Roadmap	User Experience
Secondary roadmap	Firefox Desktop
Feature list	Desktop
Project	`
Engineering team	Desktop front-end

{{#set:Feature priority=P1

|Feature rank=999 |Feature theme=Experience |Feature roadmap=User Experience |Feature secondary roadmap=Firefox Desktop |Feature list=Desktop |Feature project=` |Feature engineering team=Desktop front-end }}

Team status notes

	status	notes
Products	`	`
Engineering	`	`
Security	`	`
Privacy	`	`
Localization	`	`
Accessibility	`	`
Quality assurance	`	`
User experience	`	`
Product marketing	`	`
Operations	`	`

{{#set:Feature products status=`

|Feature products notes=` |Feature engineering status=` |Feature engineering notes=` |Feature security status=` |Feature security health=` |Feature security notes=` |Feature privacy status=` |Feature privacy notes=` |Feature localization status=` |Feature localization notes=` |Feature accessibility status=` |Feature accessibility notes=` |Feature qa status=` |Feature qa notes=` |Feature ux status=` |Feature ux notes=` |Feature product marketing status=` |Feature product marketing notes=` |Feature operations status=` |Feature operations notes=` }}