Mobile Design Pattern: Sorting
Article Metadata
This design pattern is part of the Mobile Design Patterns series.
Contents |
Description
A means of re-ordering a list based on a chosen parameter.
Advantages
- Increases findability of distinct items within long lists.
Disadvantages
- Providing an easily discoverable and intuitive sort command can be tricky on small screens.
Use when
- When a list contains a large number of items.
- When list items contain complex data and/or multiple associated metadata.
Use how
Provide users with a contextual series of sorting options. On mobile, these are most often presented in the following way:
- A drop-down menu or toggle located at the top of a table column (primarily used in HTML).
Figure: Nokia Messaging provides a drop down menu enabling mail sorting by date, subject and sender (open menu not shown). The above list is sorted chronologically by Date.
- A ‘Sort’ or 'Sort by' command within the Options menu.
Figure: The S60 sort command is available within the Options menu. The active sort method is indicated using a
submenu indicator.
Design Tips
- Where possible, provide an indication of the active sort method. This indicator should ideally be on-screen however this may not always be possible due to limited screen real estate. In S60, the active sort parameter is commonly indicated using a sub-menu indicator.
- Provide the user with an easily discoverable means to revert the list to its default sort order.


03 Sep
2009
The article demonstrates a deep understanding of Mobile Design Patterns : Sorting, the examples and diagrams provided reflect well the authors thoughts. This article is recommended for reading by everyone who wants to implement this design pattern. The advantages, disadvantages, when and how to use has been explained properly. It also mentions some design tips which could be handy when designing.