New context menus experience in SAP Web IDE
The challenges with workspace context menus
Context menus are a familiar and frequently used interaction to launch commands over the project workspace. Right-click the mouse over the files tree, and all commands relevant to that item in the folder hierarchy appear in a menu for you to select from.
Context menu are composed by an algorithm that is calculated on-the-fly. It creates a dynamic structure of submenus and commands that change based on both the selected object and on the project context where that object is found.
Each tool and most plugins insert new commands into the menus. Those commands appear in the context of the selected file, folder, module, or project, or even the entire workspace. As the number of tools and plugins continues to grow, the workspace context menus became cluttered and unruly:
- commands are inserted in odd locations
- commands appear out of context and are irrelevant to the selected items
- too many command groups are being created with unclear grouping rules
- submenus are too deep
- commands names are too long and with inconsistent phrasing
- entrie menus are disabled and should never have appeared
It was time to refactor the context menu rules and structure:
to bring clarity, order, and a smooth experience to this frequent interaction.
So what’s new?
- The top-level context menu has been reorganized to better follow project development.
The reordering of command groups now follows use frequency patterns.
Command groups from top to bottom include:
- Development process commands – Run, Build, Deploy, Preview, have been brought together into a single command group. These high frequency commands now appear on top where users expect to find the most relevant process commands for the selected project resource. Specific tools can add their process submenus such as: Mobile and Debug.
- Tools section – the Git menu is here, and other resource management tools with relevant commands for resources up-and-down the workspace hierarchy.
- The New submenu for resource creation now has well defined command groups for difference levels of the file and folder hierarchy.
- Import and Export of resources – same as before.
- The Edit submenu groups all file and folder edit commands: Cut, Copy, Copy Full Path, Paste, Rename, and Delete.
- The Project menu is a new addition for project management commands.
- Quick Access is a new command that opens the Quick Access dialog to aid users in finding relevant commands using text search.
- Submenu depth has been reduced.
We’ve merged some of the 2nd and 3rd level menus submenus.
You’ll find the same commands with less mouse travel and fewer missed submenus.Here we see how the “Run as >” submenu is now a command group in the Run submenu.
- New item creation has also been reorganized.
Command groups have been defined for different types of created items and contexts:
- Project modules have a unique group and appear for MTA projects.
- Singular file types are grouped together.
- Related file types appear together in their own groups.
- Projects of all types can be created from the workspace context menu.
- Single file context menu is quicker and shorter.
All available editors for that file type are visible, almost all submenus have been merged, and all irrelevant commands removed.Here below, on the left, we see the context menu for an mta.yaml file with two visible editor choices, and all edit commands in direct view. On the right we have the context menu for an *.hdbcalculationview file. The menu includes the process commands group (second from the top) with unique commands for that file type.
- File and folder edit commands have been grouped.
The new submenu Edit now groups all edit commands. This shortens the top-level menu by one third. Edit commands are now contextual: they do not appear for the entire workspace context, and appear inline for single file context.
- Sharper context focus and clear rules for command appearance.
With the new command groups defined:
- You will not encounter out-of-place or out-of-context commands.
- You’ll see disabled commands only if there is a possibility for those commands to be enabled under different circumstances during that project timeline.
And what if…
If you think you’ve found a command out of place, snap your screen and tell us! ?
We’ll put it back in place and pronto!
- We continue to refine the context menu structure and to improve the dynamic performance times of the right-click interaction.
- We’ll also rethink and refactor the content and experience of the top menu bar that shares command groups with the context menus.