Lead: Shani Laendler (Unlicensed) ONGOING

Description

Basic Flow

Usage and Behavior

General Guidelines

Internal Logic

Magnifying glass icon

As indication only. Does not operate as button, since the search is conducted live.

Search logic:

• The search is being conducted for any part of the term ("contains" approach). For example, the string "re" may return "revert", "correct" or "before".  

Results:

• The results are displayed in the list area and according to the same sort method.

• The searched string will be highlighted within the text.

• Loading results: 

  • Less than 0.1 second: no loader.

  • 0.1-1 second: TBD.

  • 1-5 seconds: loading spinner with the text "Searching <Categories>..."

  • More than 5 seconds: mmm this search type is probably not the best solution (go with more complex search type that does not filter immediately) 

• Option 2: loader within the field and list area as a placeholder for the results:

List Types

• Hierarchy:

  • The full list may be displayed in hierarchy 

  • In most cases the search results will also be displayed in hierarchical view (Google Settings search as reference):

• In some cases the search results should not be displayed as a flat list, and not in hierarchical view. See 'Best Practices' section for more details.

Automatic focus on search Field

• Auto-focused on the search field allows fast search and reduces clicks.  

• Search will be auto-focused when these 2 conditions occur:

  • The list is the only/ main component presented in the area or section (e.g. in filter panel, in modal window)

  • The list is presented upon request (e.g. click to open filter panel, click to open window).

Example: