Consider a change in highlight for hover and selection graphic
I figured this would be the best place to submit this idea:
The current highlight graphics we have have a number of problems that I think we could solve. Some of the problems are:
- Little space for text highlight
- Text highlight contrast is too strong against the text
- Gallery item controls or operator buttons overlap with item icon
- Control button is too faint to be clearly understood
- Highlight only covers the item name label and not the entire selection
- Item gallery margins are not well aligned to the container
I think we could follow some current conventions on this taking a page from mobile and web.
In this graphic, the bottom 2 items are the proposal. Item one is the focused, or selected state and the one on the right is the hover state.
Characteristics:
- Faint color used for background graphic
- Additional controls are placed at the top right of the selection graphic. This clears the main icon from being overlapped with additional controls.
- Selection ring makes it very clear about what is selected
- The graphic covers item icon and all the text in the name label up to 3 lines of wrapped text
- Highlight graphic is consistent in size with the rest of the selections
- Highlight graphic can make gallery item margins more consistent with the container
- Larger graphic identifying selection makes it more recognizable and easier to work with
Thank you