Thursday, May 23, 2019

search - How to combine Suggestions with Filtering in a searchbox?



I got a textfield/combobox for typing a search string (or selecting a recent searchstring). The search results are presented in a list below the box.


I also got a textfield for filtering the list.


The following familiar designs illustrate the problem. The upper example is from Outlook where the list is sorted as you type. The bottom example is from Chrome where suggestions are given in a dropdown box.


autocomplete vs filter


How to combine the two? The suggestion area (Chrome) would overlap the list (Outlook).


Does anyone have an example of an application that combines filtering and suggestions in one box, similar to this? Maybe I am way out, because I cannot find any.



Answer



It is possible to combine the two, but you'd need to carefully design the location and size of elements. Google Instant for example provides both suggestions and live filtering, combining the two by judicious spacing, positioning, and sizing. They manage it by having only 4 suggestions on the drop down, and having some non-essential guff take up that minor amount of space between the search box and the first search result.


google instant in action


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...