The current interface for my application has two drop downs, the first has the columns that you can sort by, the second has the direction which can be either ascending or descending. While the user can sort by column/direction, the data is shown as a richly formatted list, rather than a straightforward table with column headings. Here's an example of what it looks like:
I've been tasked with replacing them with up and down arrows but I am unsure of which scenario is best for users to make it more obvious or intuitive as to what is happening now and what change they can make.
Just for clarity:
- Descending = down arrow
- Ascending = up arrow
These are the options I have:
- Show both the up down arrows, but 'disable' the current direction
- On page load, show the descending arrow (default direction), clicking on it changes the order of the data to ascending as well as hiding the descending arrow and showing the ascending arrow
- On page load, show the ascending arrow (option available direction), clicking on it changes the order of the data to ascending as well as hiding the ascending arrow and showing the descending arrow
So option 2 shows you your current selection, which falls in line with how the drop downs would work. Option 3 shows you the option available to you.
Personally, I think option 3 is better in theory but when executed I feel it doesn't work as well.
Having looked around the web for examples, it's hard to find anyone using this style of ordering. It seems that:
- Price: low to high
- Price: hight to low
are the more common way of solving this issue, and this would be great, but that would mean doubling the number of options in the first column making that would just introduce way too many options for the user (14 now, maybe more than 20 in the future).
Suggestions as to what the most common scenario is or what user preferences are would be great.
Edit I thought a 4th option would be to only ever give the option to order descending, but this is not a viable option for our application