Mobile sort and/or filtering patterns for long lists

16 Dec 2011 - 9:21am
3 years ago
3 replies
4544 reads
MPawson
2010

I need to review examples of how other mobile apps have dealt with long lists of items. Specifically what interface is offered for sorting the list or filtering the list. Ours is a mobile web application - not an IPAD, Android, BB specific app- and it is possible for the customer to have a long list of items. The list displays the item name and a number attribute representing depth. Many customers will have less than 10 items but some could have pages of items and will need a way to either sort by Name or Depth, or filter to find a specific Name. I am short on real estate on the screen but could push the list down and have a text filter field across the top. I am not sure where or how to offer sort.

Any ideas, patterns or examples on the web I could review would be much appreciated.

Comments

16 Dec 2011 - 10:22am
davidmead
2011

There's a couple of really good mobile pattern resources on the web.

Check out:

Without knowing too much about your project I would think filters that can be shown/hidden above the results may be a good starting point.  The trigger for the filters appearing could be the amount of items listed.

Hope this helps.
Dave

 

16 Dec 2011 - 10:35am
kimbieler
2007

Standard pattern for sorting tables is to click on the column heading to sort by alpha or chronological. Click again to reverse the order. Would it take up too much real estate to put a small sort area at the top of the table?

For filtering -- if users are just trying to find a single item, you could paginate your list and let them swipe between pages. Most of the time, that's probably going to be faster than typing since the brain is optimized for scanning. If it makes sense for your app, you could also keep a list of favorites -- either user-defined or chosen by frequency of use. If you do decide to add a search UI, I would make it dynamic, so that results start appearing underneath as soon as you type the first letter (in other words, do not require the user to hit a "go" button for search to start taking place).

21 Dec 2011 - 11:39am
MPawson
2010

Thanks Kim and David,

We do not have column headings on the list because it is unnecessary and real estate issues.  Our customers are Oil and Gas Professionals and they know that the Name represents the well name and Depth is the how deep the well has drilled to. The issue with pagination is well names can be long and complicated ex> Foxtrot  Kaybob HZ 10-12 46-W5 . Scanning a  list of such names that can have various combinations of the above on a small screen is not easy.

However I really like the filter suggestions of not showing the control unless you have more than one page of  wells and then making it dynamic while you type would be very doable.

Syndicate content Get the feed