Multi-Select Filtering for a record With or Without a particular flag

Question

I'm developing a search tool for our web application. The search tool has many different filters and options, such as product category, product price, etc. We have the ability to add zero or more flags to each product. One requirement put to our team is to be able to search for products using this flag. For example:

Find items with flags "big" and "green" and "flat" 
and without flags "fuzzy" and "soft" and "warm".

I have extensive back-end development experience so the SQL queries to find such items are trivial to me, but I'm at a loss on how the front-end for this should appear. At the moment, I'm using a combination of two dxTagBox items from devextreme that allow the user to select all of the flags they wish to include and exclude separately. We've also had prototypes where every flag was listed with a three-way switch (options of "include" "ignore" and "exclude"), but it was incredibly slow and far too large due to the thousands of flags available. Our management team is not liking this layout, but has no idea of how they wish this to look. Any suggestions would be welcome.

Here is the current idea:

Here is the devextreme control when it is open:

Answer 1

I have seen the pattern where an filter uses "field = value" and "field ≠ value". Perhaps that might be a solution?

I think the X being used for anything other than remove or clear might be a very hard pattern for users to learn.

Answer 2

I would definitely go for a single line filtering, as "include" and "exclude" may be handled in one. "Ignore", on the other hand, should be a default, as far as I understand. Additionally labels With and Without.. look similar, which adds cognitive strain on the user.

This is a complicated filtering that is easily done in console, however for a regular user it tricky. Clicking the state would be more familiar in this case.

My suggestion wireframed below is a multicombo box like yours but the tokens are completely different.

• Their default state after pressing Enter is "Include", like on the example 2.
• Clicking X turns it into "Exclude", and the green checkmark fades to grey
• Clicking on the label clears it, making it an "Ignore" again
• Clicking on an already active state button (like X for "Ignore") does nothing

Answer 3

Have you considered using not ?

I'm looking for socks which are red, striped, not wool, long, etc.