2

The context

I am currently working on a project in ASP.NET MVC5.2 with Twitter Bootstrap. The user will be experienced in IT as it concerns an internal tool.

The user is able to set different kinds of filters (see screenshot). I implemented a new kind of filter, but I'm having trouble finding a way to display it. The filter consists of on the one hand a specific department and on the other hand a list of all departments except some departments that the user wants to exclude. When adding a filter the user has to choose a specific department, and select (dropdown with checkboxes?) one or more departments from the list which contains all departments that he wants to exclude. There are 35 departments.

Example:

  • Filter 1: FROM "All departments" except "Cardiology", "Endoscopy" and "Gynaecology" TO "Neurology".
  • Filter 2: FROM "Gynaecology" to "All departments" except "Oncology".

Screenshot

This is a screenshot of the UI I use to display other filters. The panel "Afdelingsfilters" displays a list of filters where the FROM(Van) department and TO(Naar) department can either be a specific department or "All departments" The two filters on the right are two simple list with only one value that is displayed.

UI Filters

What needs to be displayed

I want to display these new kind of filters as a list like the other filter. I also wanted to know how I should design the "add filter" form. I wanted to make a form with 35 checkboxes to indicate wether or not the department should be excluded from the "All Departments" list when the user wants to make a new filter, but it is very likely that there will be added more departments in time.

Improve this question
4
  • can you expand on the context further? I don't fully understand the business problem. What is the goal you need users to accomplish?
    – Midas
    Commented Mar 29, 2016 at 13:10
  • @Midas The user needs to be able to add a new filter. This filters consists of 1. a specific department that he can choose out of the list of all departments 2. A list of departments. This list consists of all items (the 35 departments) except the departments that he wishes to exclude. I'm having trouble finding a way to display this because there will be multiple filters so there would be a list in a list. Hope this clarifies things. Thanks for your time
    – ckindt
    Commented Mar 29, 2016 at 13:19
  • Add a new filter to do what? The reason I'm curious is because I don't want to jump to a solution without understanding the problem :)
    – Midas
    Commented Mar 29, 2016 at 13:21
  • 1
    @Midas This is an internal tool to send mails if a patient transfers from department X to department Y. The client wanted the ability to set restrictions. One of these restrictions was: "I want to be able to set that there will be sent mails if the patient travels from department X to All departments except when all departments is department A, B or C. They wanted this for easy of use: Instead of setting the filter from A to A,B,C,Many more, ... they wanted to set a filter from A to all departments except one or two.
    – ckindt
    Commented Mar 29, 2016 at 13:27

1 Answer 1

Reset to default
1

Let me start from "add filter". Checkboxes show quite poor usability when there are more than 5 of them. In your case I suggest the following:

enter image description here

  1. Natural language editing. You structure your UI in such a way that user builds a sentence, like in your example. Then they can clearly see what will happen.
  2. Instead of checkboxes let them add departments by typing their names with autocomplete and keep them as blocks in the edit area. User may delete the blocks by clicking the "x". Block containers may expand down as long as needed.

As for naming these filters, leave it to the user! They create something really custom, which makes sense for them, so they should know how to name it.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.