Lead: Shani Laendler (Unlicensed)

Description

Live search (aka "active search", “incremental search” or “search-as-you-type”) is a search type in which each character that the user enters or deletes runs the search query. This type is usually suitable for small-medium databases

...

• Less than 0.1 second: no loader is needed.

• 0.1-5 second:

  • Option 1: loading spinner with the text "Searching <Categories>..."

    

  • Option 2: loader within the field and list area with/out a placeholder for the results (consider Asaf’s use cases where there are several loading areas in the results area, see google example. consider also very long search fields where the load sign may be to far and unnoticeable)

    

• More than 5 seconds: this loading time is too long for “Live Search”. Use Manual Search instead.

...

Both recent and popular queries will be presented only if the user is expected to search for previously searched queries or for popular/trending queries. Otherwise this feature should not be used.

Search with Spaces

• Spaces are included in the search string. For example, when searching “repeated c” the result “repeated calls” may be found.

• When searching for names specifically (e.g. employees, agents), the space may be addressed as a separator between 2 distinct searches. For example, when searching “sh kl” the employee “shiri Klein” may be found.

• Other cases should be dealt with separately.

Interaction

Step	Visual Example	Description
Initial state		Hint text in grey
Hover over the search field		Boarder colour changes
Click on the text field		Search in focus Hint text presented Text mark is flickering Suggestions: recent and/or popular queries are presented (optional)
Enter first letter		Hint text hidden Suggestions are hidden The list is filtered with every entry, from the first letter Searched query is highlighted within the list "X" is presented. will allow to "clear" search in one click.
Enter next letter/s		The list is filtered to show relevant results
Click on item in the list		Focus is moved away from the search field
Clear all		Click on the “x”: (1) clears all characters (2) focus on the text field, so that new search term can be entered. The "x" disappears when the text is cleared (both manually or using the "x" button)

...

• Display results in an hierarchical tree view vs. simple list: the results may be presented in both list types. Use these questions to select the most appropriate type:

  • Is the search expected to produce a single or multiple results? (if single than list is probably good enough)

  • May several results have a similar name? (if yes, tend to choose a tree view)

  • What will help to differentiate between items with similar name? (will it be the root?)

  • Will the root be searched by itself?

  • In case the results are presented in tree view, all roots will be auto-expanded to present the searched item. 

• Use when:

  • The database is small-medium and the results can be filtered immediately (no need to retrieve the data from the back-end)

  • The results area is located below and near the search field

• Don’t use when:

  • When the query is applied on a complex or big database that will cause a long loading time. In such case use Manual Search (with Auto-Suggest).

Future Version (TBD)

• Search on a simple list with multi-select

• Search on a tree view with multi-select