[meta] Usability improvements for Project Browser

During #3312892: Drupal Usability Meeting 2022-10-07 we have discussed Project Browser for the first time. The aforementioned issue will have a link to the recording soon. The attendees at the usability meeting were @AaronMcHale, @benjifisher, @narendraR, @rkoller, @shaal, @simohell, @srishtiiee, @Utkarsh_33, and @worldlinemine.

At the end of the meeting there was a consensus to create this meta issue to collect all usability related issues. All topics that were created before are labeled with (-), while topics that were brought up during the usability meeting are referenced with (1) (future meetings should be added to that list numbered sequentially (->(2),(3),…) and labeled accordingly):

(-) Already existing usability related issues in the Project Browser queue
(1) #3312892: Drupal Usability Meeting 2022-10-07

Problem/Motivation

(-) #3239865: Front end design review and discussion: The general review and discussion of the Project Browser front end design (direct link to the Figma design)

Extend tabs
(-) #3300397: Consider unifying all the extend tabs into a single tab: There is the consideration to unify all the tabs on /admin/extend into a single tab.

Project source tabs
(1) #3313292: Change layout to make plugin-specific content more clear The position of the project source tabs should be more clear and prominent by moving their position.

Categories
(-) #3240313: Decide on re-categorization of modules for Drupal.org: The revision of module categories for Drupal.org and Project Browser - the main work currently happens in #3311475: Review Category Proposal.
(-) #3293907: Provide brief summaries about each category: Adds a brief category summary in a visually hidden span after each category in the sidebar. Right before the search results the title/s and summar/ies of the selected categor/ies should be displayed.
(-) #3310893: Enhance category filter to allow AND / OR selection: Adds an option and clarifies if it is an exclusive or an inclusive search based on the selected categories.
(-) #3310893: Enhance category filter to allow AND / OR selection - comment #8: The title of the categories sidebar makes it not clear that the categories are filters and that they are related to the filter component.

Search-field component
There are currently no related issues.

Filter component
(1) #3314210: Re-arrange radio-buttons for better usability: The available filter options are cognitively hard to process. Ideally it should be changed from a row based to a column based display.
(-) #3314728: Add a filter type for the module install state: Add a filter type for the different install states.
(1) #3315864: Add a filter type for the release status: Add a filter type for the different release statuses.
(1) #3315867: Change the label for the sort by option Project Usage: Change the microcopy of the sort by option Project Usage.
(1) #3315866: Add the option Recently Updated to Sort by-select list: Add the option Recently Updated to the Sort by: select list.
(1) #3315865: Add a threshold for the minimum number of installs to the filter component: Add the ability to set threshold for the minimum number of installs.
(-) #3310896: Improve UI of results count: The results count currently located in the filter component should be improved.
(-) #3282163: Improve iconography usability by adding a legend: A legend should be added to the icons inside the filters component.
(-) #3293909: Security and maintained icons need to communicate correct information: An alt text should be added to the icons inside the filters component, but the use of the title attribute should be avoided.
(1) #3315862: Add an explanation for the terms used in the filter section: Add a description or explanation about the terminology used in the filter component.

Cards
(1) #3315854: Improve the readability of module cards in grid view: Cards in the grid view use centered text in contrast to the cards in list view using left aligned text. Centered text is harder to read and process. Left aligned, and right aligned for rtl, should be preferred.
(1) #3315859: Communicate the status/state of a project in the button accesibly: The status/state of the module (added or installed) should be signified for example in upper corner of a card (described in #15.2 and overlaps with the button label topic).
(1) #3316039: Add the ability to deliberately hide certain modules to show up in future results: Add the ability to hide modules, you as a user, don’t want that they show up in any of your future search results.
(-) #3300350: Improve the installed and download buttons on the module cards: The styling of the button should better support the meaning by employing primary button, button, secondary button or action link styling (overlaps and has to be aligned with #15.2).
(-) #3310877: Consider adding "active installs" to Card view: Add the number of active installs to the cards in grid view.
(-) #3310879: Consider refactor of the "Install" button behavior: After adding the ability to add a module to the filesystem and or Drupal, it is discussed to add the ability to remove a module.
(-) #3310906: Expose paging options: Number of search results per page. Should it be kept as is, should the number be increased or should a select box be added where users are able to choose from different options.

”Download/Install instructions”-modal (relevant until #3312289: Svelte UI for install controllers has landed)
(1) #3315853: Don’t rely on Drush in the instructional modal for adding and installing a module: You have to keep in mind that not everyone has Drush installed or even knows what Drush is. The issue is about adding an action button to the extend page instead of adding the link in line plus discuss the option of removing the the drush pm code block or adding instructions how to install Drush instead.
(1) #3315858: Make the micro copy for adding and installing modules consistent with the general plan for Drupal Core: Adjust the terminology and use Add instead of Download to be in line with #2888657: [meta] Less confusing and more consistent wording needed in module/theme add/install/update.

”Succeeded and failed process”-modals (with #3312289: Svelte UI for install controllers applied)
(1) #3310893: Enhance category filter to allow AND / OR selection - comment #15.2: The default option should not be View Command, which opens the ”Download/Install instructions”-modal”, instead use either +Add (not in the filesystem) or Install (not installed in Drupal yet) (to be in line with #2888657: [meta] Less confusing and more consistent wording needed in module/theme add/install/update).

Project Browser project pages
(1) #3315860: Change the position of the Browse tab in the local task order: The order of available local tasks (list, update, browse, uninstall) should be discussed.
(1) #3300090: Improve the navigation on individual module pages: The Project Browser specific breadcrumb isn’t following the common Drupal interface pattern. Option d) replacing the breadcrumb with a “back button” functionality looks like a direction to follow.
(-) #3300093: Improve the readability on individual module pages by limiting the line length: The readability on individual project pages could be improved by limiting the line length.
(-) #3311002: DrupalCon Europe BoF: d.o / PB project pages: The order of content components on a Project Browser project page was discussed and revised in a priority guide (see the following comment).
(-) #3230734: Improve project descriptions by using a template suggestion for the body field For the body field component, and to improve the project description, a template is worked on.

Remaining tasks