Usability/interaction improvements for list rows, cards, and nodes including ones with multiple select areas
Our interface often presents complicated interaction patterns such as rows and cards that include multiple highlight areas linking to multiple places or summoning up a variety of information.
Good examples are issue board cards, merge request list rows, and pipeline graph nodes.
We currently do not offer any hierarchy feedback or click area designation for interacting with these UI patterns. In the following screenshot, you see the screen space taken up by interaction active areas compared to the whole space the item takes up. The primary action for opening up the item is small and variable, introducing additional friction for interacting with the element.
Interaction looks like this:
In contrast, Trello offers whole card highlighting regardless of where you hover over a card. In the same fashion the most prominent user interaction with a card is tied to that as well (opening the card). Interactions which are less frequent are still possible but have smaller interaction areas within the card.
- Introduce whole item highlighting for primary interactions
Larger element click areas will represent primary element interactions reducing friction for interacting with elements and add a clearer IA.