0

Let's say we have an autocomplete like this.

The autocomplete has thousands of possible results and so we only display the first 20 results. Some of the results are very similar. This leads to two problems:

  1. Users click in the input field, the dropdown opens and they don't understand that they could use the input to filter for more results.
  2. Users actually use the input to filter. Still they just see 20 out of e.g. 500 actual results.

I already thought about those solutions:

  • Load 20 more results when scrolling down. Similar to this autocomplete. I tried this, but still the users still did not get that they could use the input to filter.

  • Display a helptext at the end of the dropdown with some text which indicates that there are x more results but you have to filter for them. I also tried this, but the users did not know the exact term of the result, so they end up not finding the entry they are looking for.

I hoped for some best practice tips for those kinds of autocompletes, I have the feeling I am missing something crucial here.

Thanks in advance!

EDIT

To start back at the source - The autocomplete is part of a form which carries information about a company. The users are looking for business sectors which fit to the company. In this specific case for business sectors in the agriculture sector. Business sectors could be e.g:

  • Cultivation of rice
  • Cultivation of melons
  • ...
  • Keeping of milk cows
  • Cow Transport

Most of the time the users don't know a business area's exact name, so they e.g. just look for "cow" or "cultivation"

2
  • Let's start back at the source, what are people doing and what are they searching for, to achieve what? Jul 19, 2019 at 13:11
  • @DarrylGodden i edited the post :)
    – sevic
    Jul 19, 2019 at 13:33

5 Answers 5

1

The easiest solution is to change the label from "Pick one" to something like "Find your sector", to make it clear it is something they can search or find rather than something to pick out of a list of options. Other options: 1. Don't show the drop-down before something has been typed. 2. Add a magnifying glass on the right side of the input field.

1
  • I changed the placeholder to "Search for your sector". Simple and it seems to work!
    – sevic
    Jul 24, 2019 at 9:15
1

Avoid Scrollbars & Keep the List Manageable

Keep the number of results short so the user doesn't need to scroll

Consider Including Labels & Instructions

Tell the user the results are suggestions

In this article, they explain more about the best patterns for autocomplete.

https://baymard.com/blog/autocomplete-design

1

This is the 3rd appearance for this suggestion of a control that has been submitted to a few other questions, but I think it remains valid for your conundrum, rather than a drop-down, this utilises a type ahead with results refined as the user types, and selection.

This was designed for a medical question that was posted, but hopefully you can see the idea.

This works because it filters on keywords, but the selections are constrained.

enter image description here

0

Search input should be a good solution above the list + information about possibility of using it.

The other options in my mind are using pagination.

The other options is categorize option in category for solution like on screen:enter image description here

You can also opt out of this for a simple search engine - it depends on the context

0

I actually find the auto-complete search boxes on comparison sites really straightforward to use. Attached is an example from confused.com when looking for car insurance. They ask you what your job role is and the spinner indicates it's search.

Maybe something like that would be useful to your users accessing a large database. As they type they can see the machines fetching, then spits back your results, of which I recommend a digestible number of 6, thinking about Hick's Law. (https://lawsofux.com/hicks-law.html)

searching

results

Your Answer

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

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