4

We are building a contest site in which we are displaying a number of videos with a filter by state and filter by store option and a sort by vote (low to high) and date uploaded (past to recent).

Currently, our page layout has the filter option to the upper left of the videos with a dropdown. To the right, we have the sort function that looks like this:

Vote             Date Uploaded  
Low | High       Past | Recent

where the second row text is clickable. Another option I considered was using dropdowns for the sort in addition to the filter (e.g. "Vote: Lowest to Highest") but I'm concerned that users may be confused that such similar looking elements have different functionality.

Is using a dropdown for both filter and sort user-friendly? Or is there another possibility I might not be considering?

|improve this question
  • If we've answered your question, you can select the best solution so that if anyone comes across the same problem in the future, they know the course of action. – dnbrv Feb 7 '12 at 18:35
1

You're right that using dropdown for 2 different functions on the same page is a bad confusing approach. However, in general, dropdown works fine for both filtering and sorting as long as the control is properly labeled.

The only suggestions for your situation I have are 1) to make sure that the current filter is not clickable & is highlighted somehow, in case you haven't implemented this, and 2) to see whether a different filter setup, such as the one below, is easier for users to understand:

    Sort by     Most votes      Newest first
                Least votes     Oldest first

You can also consider adding a "Randomize" link in the same section as the sorting options.

|improve this answer
7

There was a great article about this a couple of years ago that found that filtering/sorting are the same thing to a lot of users. There is a strong mental model of "filtering by sorting".

The Mystery of Filtering by Sorting by Greg Nudelman:

"The ostensible need to visually separate sort controls from filtering controls is a myth."

So I think you could place all of the sorting/filtering options in the same space (on the left or above the listing depending on your design) - and always test, test, test. :)

|improve this answer
  • Thanks for your response. I actually found that same article later in my searches on the issue. It was fascinating and I agree with much he had to say. My only concern regarding this particular situation is that the filter options will be rather narrow (per client) so the user actually may notice a difference between sort and filter. – lousso Jan 24 '12 at 13:35
1

I agree with @dmvrb - label to make it clear what the control does. Changing the type of control to another paradigm might just shift the confusion to other users.

One possibility to prevent user's confusion is to change the wording.

For example: instead of "Filter by" use "Show only", and instead of "Sort by" use "Order by"

|improve this answer
0

A common UI idiom for sorting tables of data is to via clicking on the column headers. There would normally be a small symbol inserted into the column header to indicate the sort (an up/down arrow or an up/down triangle are the usual suspects). Clicking a second time would reverse the sort order.

Do that, and you now don't have two drop downs for different functionality.

|improve this answer
  • 3
    That works only if data is presented in tabular form. My feeling is that OP has tiles or grid. – dnbrv Jan 13 '12 at 5:34
0

Presuming the default state shows all videos, one may FILTER what is on display, that is a user can choose to display sets or groups from all videos - in this case, most votes or least votes. A user may then SORT what is on display, yet what is on display is the same just arranged differently - in this case, Newest first or Oldest first .

From one set or all, a filter abstracts a group from that one set or all. While sorting, affects that current set, but only in the method it is displayed.

Consider the popular jquery plugin http://isotope.metafizzy.co/

  • Jason
|improve this answer
  • The jquery link is interesting, but the text of your question doesn't really answer the question about whether or not it is going to confuse users by using the same type of control for two different purposes, you are just explaining the concept of Sort and Filter. – JonW♦ Jul 2 '13 at 7:56

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.