HistoryAtState / hsg-shell

Source code for the history.state.gov website
https://history.state.gov
8 stars 13 forks source link

Q: UI best practices for applying filters to results #316

Open joewiz opened 6 years ago

joewiz commented 6 years ago

@tuurma @plutonik-a Do you have any ideas for ways to improve the process of "applying filters" once they have been selected? I worry that users may not realize they have to scroll to and find the "submit" button in order for newly checked checkboxes or date fields to be applied. (Back in https://github.com/HistoryAtState/hsg-shell/issues/284#issuecomment-342491239, @plutonik-a showed a mockup of an "apply date" button.) Even the "sort by" dropdown feels (to me) like it should auto-submit once a selection is made, or there should be some "apply" button.

Should we have an "Apply filter" button beneath each filter? Pair each of these with a "Reset filter" button that applies just to that filter, as opposed to the single "Reset filters" (plural) button that's there at present? Or might it be more intuitive if some selection actions (like checkboxes, drop downs, and radio buttons) trigger an auto-submit, while only date fields require an "apply filter" button? I'm just not sure what the UI best practices here.

joewiz commented 6 years ago

One more observation: Even the current "Reset filters" button doesn't trigger a submit. I'm not sure that a user would realize that they have to find and click on a "Submit" button after clicking on the "Reset filters" button.

tuurma commented 6 years ago

@joewiz I think it is a question of do we see the results page as 1. 'advanced search' or 2. purely results filtering. Current behaviour atm suggests 1 to me, and in that it is pretty clear and consistent, although filtering the list of volumes down to ones containing hits for current selection would fall into 2. For 1, I would expect only hitting the 'search' or 'return' to submit the query, while for 2 it does make sense to have it tied up with any change in filters.

Beyond purely UX considerations, atm we'd need to pay attention to performance and our deadlines too.

tuurma commented 6 years ago

@joewiz I have asked Wolfgang for his opinion, as currently he's taking care of #313 which does affect performance quite strongly. Let's postpone the decision here until after sorting is done.

tuurma commented 6 years ago

One other remark for 'reset filters' button. I have just accidentally pushed it, while what I wanted to achieve was submit the query. I think it would make sense to have 'Search' button appear beneath date/volumes filter in the sidebar.

plutonik-a commented 6 years ago

@joewiz

  1. Sort-by filter

    the "sort by" dropdown feels (to me) like it should auto-submit once a selection is made

I agree, the expected behavior for such a sort button is an immediate action.

  1. Apply filter button

    Should we have an "Apply filter" button beneath each filter? Pair each of these with a "Reset filter" ...

I would recommend only one button "Apply filters" next to "Reset filters". Otherwise we have too many options and clicks to be done in order to filter one simple query.
I agree, that the current placement of the reset filters button is quite out of sight, when all filters are expanded. Maybe we should place the buttons at the top of the sidebar or next to the search button. But I would leave it optional and still provide additional key "enter" to trigger a submit.

Or might it be more intuitive if some selection actions (like checkboxes, drop downs, and radio buttons) trigger an auto-submit

Yes, it is very intuitive to trigger a submit on each input action, but also it slows down the final display of a searched query term and thus derogates the user experience. I would only recommend such a filter pattern on data, where it is crucial to show users an immediate response of their research, like displaying available dates to choose from in a calendar app.