4

Recently I've been designing a mockup for an android app (material designed) where I use a list to show number of entries. And the list is expandable.

Is it always necessary to indicate to the end user that the list is expandable?

I've a count on the parent list item which shows the number of items it'll have if expanded.

I also many other data to be displayed along with it so was searching a work around.

What I tried doing is using a right chevron at the end of the list that transforms 90 degree clock-wise as I expand.

But this along with the count doesn't go much pretty.

Please suggest what should be done instead.

P.S I've already rejected the choice of using the list as shown on google material design page (or to simplify as used in app: Inbox by google.)

  • 1
    That icon is called a chevron. – Midas Apr 5 '16 at 9:08
  • It sounds like you don't want to use a list (single depth, infinite length), but an accordion (deeper hierarchy, expands/contracts) : codyhouse.co/demo/multi-level-accordion-menu/index.html Is this correct? If not, could you show us a mockup of the functionality you want/have? – PixelSnader Apr 5 '16 at 12:27
  • A count isn't enough: imagine having a count of 9 while 8 items show. The one-off condition is unlikely to be noticed. However, you could have a last line "+1 more >>" - essentially a variation of the chevron. – MSalters Apr 5 '16 at 12:33
  • @PixelSnader I'd be needing something like this i.ytimg.com/vi/2_E4ky0uXd8/maxresdefault.jpg, but unlike this I have more information to display. So I needed help if I could skip the chevron. – Parth Apr 5 '16 at 12:37
  • @MSalters I need to skip the chevron and still make the user catch that the list is expandable. The count is just an example of data that I'm displaying. – Parth Apr 5 '16 at 12:38
1

If you don't want to gamble then stick with the norms and the standards as they say. However, you can always break these rules and do some experiments and see if your idea would work well or not. The only key element that you need to remember is try to be consistent on your pattern of events and executions. Users would be able to recognise it quick.

To answer your question, its not always necessary, you can take away the "more" or "chevron" or "..." from your list view and many others have already done this because of the tight space and their preference on visual design. That is by just tapping the header or body of an item would expand or open new window.

enter image description here

0

How are people going to know that the chevron animates once tapped if they don't know the area can be tapped and thus expand? Adding extra list items to something that you are not aware expands just adds extra clunkyness to your design and continued ambiguity for the user. I'm not saying follow googles solution verbatim but they have designed it that way for a reason.

0

I would suggest you to follow the standards since that is what users are expecting from the list. Yet, I would set the chevron at the left of the element and the counter between parenthesis with a secondary color. The chevron is a standard so that would behave as the user expect it, but probably you could explore removing the chevron; since it's for mobile devices, users already expect the list to do something when tapped.

0

As per the standard its always better to show visual indicator on expansion or collapse of the list.

Keep the arrow/chevron indicator on the left whenever the count exist. So that both the icons are visually balanced.

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.