0

I have a scenario, where there are class and section. The user will choose the "class" first and based on the selection, will then choose the "section".

After this the user will search the result whose name starts with "San". For this there is a UI already developed (see below).

enter image description here

I wanted to simplify this with less clicks.

Is there a better approach to do this?

I did like this, please let me know if you have any suggestions.

enter image description here

|improve this question
  • Can you just have the search? Or, depending on how many Class/Section combinations there are, combine them into a single dropdown? What do your users tend to want to find? – Steve Jones Mar 17 '16 at 9:33
  • Is that really a search or rather another filter? – Crissov Mar 17 '16 at 15:10
1

I think there's a lot one could take from E-Commerce websites.

Use Filtering

Present the user with only the Searchbar and let the results include all classes and sections as well. Post displaying results present an option to filter results to the left. Something like this

enter image description here

This way

  1. There are chances users will see the required info even before filtering.

  2. They are not distracted by two separate fields (One for class another for section)

  3. It will take a max of 3 clicks to find the data needed

Additionally if the number of classes and sections are not a lot, you could include "Class" and "Sections" in the search suggestions itself. Amazon for example shows something like this I typed in "San"

enter image description here

My second suggestion would be recommended only if the total number of classes and sections are low.

|improve this answer
1

Oh yes there exists whole lot of options to further optimize the dropdown primarily by including search,checkbox etc. You can refer to the below link for various methods and choose whatever you feel most suits your experience : http://www.jqueryrain.com/demo/jquery-multiselect-plugin/

|improve this answer
  • How does that make the UI simpler? – octern Mar 17 '16 at 9:16
  • What I was thinking here is to make the process of selecting a value in the dropdown more easier.As an example consider a scenario in this design where you want to select Class X and Section Y,the user would have to scroll all the way to get those in the dropdown where as if you use another technique wherein you could just type what you want and the dropdown shrinks for you and you have your chocie right there. – Nirav Chadda Mar 17 '16 at 10:01
  • Consider another scenario where you want to add multiple selections in the same dropdown,this could be achieved via checkboxes. – Nirav Chadda Mar 17 '16 at 10:02
  • Consider an approach where we selected a few tags in a dropdown(item) and you want to remove couple of them,you can use the approach where you have a simple cross sign with each item and just remove that instead of going through the selection and deselcting those all together. – Nirav Chadda Mar 17 '16 at 10:03
  • It’s recommended to paraphrase or quote the main contents of links as they tend to die sooner or later which makes link-only answer useless for future readers. – Crissov Mar 17 '16 at 15:09
0

If they are going to search anyways, why not let them do that first and put class/section in the results?

Unless they know every person in every class/section it will require that they hunt around if they are not sure.

|improve this answer

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.