A dropdown list (or combobox) should already be a clear indication that you need to select an item from there, so wasting the first item by telling someone this is redundant and a poor idea.
The only times that I would recommend having some other text in the dropdown are:
when it is not essential to select an item
when you want effectively to select all ...
Some sites have "near miss" matches after their exact matches.
If a user has exhausted everything precisely matching their criteria but is still looking, there's a clear line and an explanation that this is the end of the results, then "near misses" sorted by how close to matching they are.
"Unspecified" would rank higher in this formula than "specified ...
By definition, a filter is a tool that help users narrow down to a subset of results that is most interesting to them. Consequently, when a filter is active, the results displayed should be less than the total number of original results.
For this reason, I find option B not intuitive enough. If I'm not mistaken, option B treats the icons using an additive ...
In the original GUI guidelines from the Lisa/Macintosh, Xerox Star, and Microsoft Windows, check boxes are, as the name implies, something you can mark (with a check-mark) if you wish to select or mark it - or clear if you wish to deselect it. Each checkbox choice is independent of each other, in terms of their activation.
Radio buttons, on the other hand, ...
Nested blocks in a vertical layout
This pattern tested very well with our users. It uses common language to explain what you are looking for and allows any level of complex grouping where individual blocks can be moved around, changed from AND to OR, or deleted.
This level of clarity does take up quite a bit of space but not too much for most simple ...
A few things about your question and some next steps:
User Experience Experts are just people that swallow their pride & know to ask their users / customers. I'd like to think my experience gives me a solid base for presenting better-than-average first-shots, but I know that users ultimately control the direction of my work.
I wouldn't necessarily take ...
That depends on technical aspects of the system,
as a thumb rule, it's always a good idea to provide facets results immediately, and by doing that also eliminate non-relevant results,
but, if the filtering takes a moment, use the button, so the user won't have to wait every time he adds a new filter to the search.
For most decisions about whether to put an interactive element (filter control, comments box, etc.) above or below an element it usually comes down to which you want the user to read and engage first.
In this case you likely don't want the user to read each of the fonts before choosing to filter them, so I would put it at top. This allows the user to ...
You could make the labels of the checkboxes negative (e.g. Pork-free or No Pork). I would change the checkboxes to toggles as it makes it more clear whether you tick something to be excluded or to be included.
This a very similar problem when you exclude means of transport when searching for a route. You might find some more inspiration there.
If the filter is mandatory, choose the most frequent search as the default.
You can try a scoped search dropdown before the search input field. This way the search button is Active from the beginning.
Lead with what your metrics show that the majority of users will want to search by, and don't make them pause to choose a filter.
If you have ...
In Best Practices for Designing Faceted Search Filters Greg Nudelman talks about "drill-down" versus "parallel" selection:
A link is the simplest mode of filter selection. By clicking a link, a customer can either select a single value for a specific filter or drill down a level in a taxonomy, like a category or department hierarchy.
I remember GitHub had something like what Mike M suggested for their search. I just noticed that it's changed, and what they do now is make the selection a part of their autocomplete-like menu:
I imagine the default selection at the top is what they believe to be the most common, which makes sense to search in the current repo by default. An advantage I ...
Does creating the filter in this way break consistency with other filters you are using? If so it would be better to find a way to create a filter using consistent logic by rephrasing the query.
The first option below (on the left) has all options in the list preselected, so the user can unselect specific foods as per their requirements.
The second option (...
This is really a problem of linguistics. In some languages, for example, there's no difference between green and blue. There is some research done by Brent Berlin and Paul Kay, which suggests a natural evolution of colours within languages (see here). I would use this as some guidance towards which are the most 'important' colours. The following diagram ...
Avoiding the dilemma
There's an possible solution without falling into this dilemma:
Give users the choice, just by adding a checkbox below the search/filter input which specifies "Search in hidden columns too" or some similar text.
download bmml source – Wireframes created with Balsamiq Mockups
If for some reason that's not enough I'd choose 4 (...
From a technical point of view the two are basically the same (i.e. excluding elements from a list, based on some criterias)
From a user point of view, it's very different:
Search is done as a first step to get some data
Filtering is applied on top of the search, after the search, never before
moreover, filtering is usually performed using boolean flags ...
I think adding a progress-tracker would be a good way to guide the user to complete the 3 step process.
Check out the mockup below.
When the page loads up all the steps in the progress tracker would be grey. But as the user selects an option under each list, the selected value can be displayed right above the list with some sort of indication that it's the ...
The filter method you suggest usually works pretty well. We're using a variant of it in one of our products:
This way we still have a heading row at the top which you can use for ordering data. This also ensures that you know which column contains what even if a value has been filled in the filter.
Disclaimer: this is a web-app for which the users are ...
No. For the user to actively specify a color, then see colors which do not match their specification risks confusion and a lack of confidence in the accuracy of the tool.
An alternative would be to add a sub-category of "Unspecified".
If you want to do something really interesting, crowd-source the data in the Unspecified category and ask users to say what ...
If you need complex filter consider creating a separate section. Perhaps a "actions" section on top of the table where users can not just filter but perform other actions to interact or modify the table.
Here is how Airtable does filter for complex spreadsheets. Some visual design improvements could be done, though.
Here is another example, from Toggl. ...
You could use the token-field design pattern for displaying and selecting the multiple options. This has the advantage of letting the user see all the items they have already selected while they select more, not just the options that match the current filter.
Some token-field implementations also implement the type-ahead filter design pattern you have.
You are facing a problem that Google has already solved and extensively tested, so copy them. In essence it is:
Use a query language that is appropriate for your audience - Lucene is a decent choice for this. Query languages are faster for advanced users to use, and is what most search engines allow.
Offer an "Advanced search" link/tab/button that shows a ...
How should I visually represent multiple three-state flags? The
complication is that each flag has three possible states
Means there are only two states "on/off" for the component, but component itself can be disabled or enabled. So it is enough to have two state switch.
Having that understanding it is possible to throw switch ...
I suggest not making the change at all. Here's why:
The affordance you are trying to provide could cause more confusion than help. Since you have small number of filters, giving the repeat users more help to "not have to" set the filters to their liking every time is a nice thought, but weigh this against this user data:
• how long does setting the filters ...
It is almost always better to both (a) cut out unnecessary steps, and (b) immediately show the user results of an action. Automatically filtering results when the user clicks a check box does both of these things, and having a "Filter" button does not, so the first design is better. Of course, it should also be easy for the user to undo or change the ...
For questions like this, especially around customer experience in e-commerce, I sometimes try to imagine the situation as it might occur in the brick-and-mortar world.
In an actual shop, would you ask your customers to stare at a wall until they told you what they were looking for? Of course not.
Customers want to browse.
Use a tabbed container for the filters
A common and acceptable way to separate filter options, is to user tabs (or versions of tabs) This can often be seen on travel websites, where users can search for several different services.
With this method, it's only possible to submit one set of search criteria at one time.
Put each set of filters in an ...