0

Customer specification require us to show a list of items (let's say they are a list of fruits), where only some of them are able to display a details section when the user clicks.

I'm looking for a visual asset that would make the user notice that out of all fruits, those with that visual aid can be clicked to go to a details section.

2

I would suggest a visual indicator that the element is clickable, for example a different font color or background and for example a "+" sign to expand a section for more details.

enter image description here

  • This approach is pretty common practice, but keep in mind the "plus" icon could be interpreted as an "add" or "zoom" action if it is used in that context elsewhere. I would personally recommend using an angle/arrow/caret icon as seen in Lucas M.'s answer, as these icons typically mean that more information or content is available. A pretty good reference for this can be found in this article – Grant Mooney Mar 30 '18 at 16:05
4

You could either have an icon that represents "more info", ie:

enter image description here

or you could have a slightly set apart list item that is just subtle enough for the user to notice:

enter image description here

0

Lets say your list of items is a collection of objects which could be represented by an icon, for instance if it is a list of fruits, they can all be displayed with a respective fruit icon. Now for fruits which can be expanded to view details, say Mango, display a variant version of the mango icon when it is hover over. (May be a bunch of mangoes, or sliced mangoes,....)

So imagine a list of fruits represented by fruit icons and as you hover over, the ones with more information to detail show a change in their display icon which gives a subtle hint to the user that there is more to this item.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.