Make tab management a better user experience
As part of a holistic design of the portal customization features, this design proposes a new interaction to managing tabs.
Design
Mockups
Tab Management Options
Tab management options (edit, delete, move) will appear on the active tab. If the active tab locked, a locked indicator will display instead. For creating new tabs, an Add Tab link is available on the tab bar.
Add New Tab
The add new tab link is available on the tab bar. Hover/focus feedback indicates and invites interaction.
Clicking the add tab link creates a new tab and makes that tab active. The tab name is made editable and is given focus so the user can name the tab as desired.
The blank page displays a prompt to customize the page. This prompt content remains until content has been added to the page, at which point the prompt is automatically removed.
Interaction
Managing Tabs/Pages
(not in scope for BYU)
Portal tabs will need to be added/removed, named, and ordered. Inline edit is recommended for naming. List drag and drop is recommended for ordering.
Considerations
- Differentiation between intention of click-to-reorder and click-to-name.
Design Patterns