An application allowing users to explore, create, annotate, and share extensions of the MITRE ATT&CK® knowledge base. This repository contains an Angular-based web application providing the user interface for the ATT&CK Workbench application.
As a user of ATT&CK Workbench, I want the UI to be responsive to my screen size. When the navigation menu would normally overflow, it instead collapses into a menu under the user identicon.
However, because the user identicon is already there before the menu collapses, it’s unclear that the navigation items are available within the identicon's menu. The user has to decide to click into the identicon to find them. Users may not think to do this:
they might think that when the viewport is narrow they have to go back to the homepage to get to the different object pages.
the identicon already has click behavior defined (the logout button) and it's unclear to users that this behavior is extended when the navigation is collapsed.
The navigation should instead collapse to a separate hamburger menu, added to the left of the identicon. The hamburger icon is very common so users will know to look in there for navigation features when it’s present. Since the hamburger menu icon will be added only when the menu collapses it’ll be apparent to the user that the hamburger menu was added to address that navigation need.
As a user of ATT&CK Workbench, I want the UI to be responsive to my screen size. When the navigation menu would normally overflow, it instead collapses into a menu under the user identicon.
However, because the user identicon is already there before the menu collapses, it’s unclear that the navigation items are available within the identicon's menu. The user has to decide to click into the identicon to find them. Users may not think to do this:
The navigation should instead collapse to a separate hamburger menu, added to the left of the identicon. The hamburger icon is very common so users will know to look in there for navigation features when it’s present. Since the hamburger menu icon will be added only when the menu collapses it’ll be apparent to the user that the hamburger menu was added to address that navigation need.