Lead: Shani Laendler (Unlicensed)
| Status | ||||
|---|---|---|---|---|
|
...
The users' knowledge and expected behaviorbehaviour: do they know the full name of the item? how familiar they are with the list terminology and content?
The list content and design: does it include complex items (e.g. agents names?)? does it have a complex design (e.g. a combination of numbers and strings)?
The more complex the list is, and the less knowledge the user have, tend to choose the “contain” approach to provide more flexibility to the user.
Results Presentation
The searched string will be highlighted within the text.
The results are displayed in the list area according to the existing sort method.
In case the list area is arranged in an hierarchical view the search results may be presented in either the same hierarchical view or as a simple list. See 'Best Practices' section for guidelines on selecting the appropriate approach. Example for hierarchical view in the search results:
...
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.
...
The list will include up to 8 items
Each item will be accompanied with an icon
The list will include recent searches and/or popular/trending searches.
Recents Recent item are items that the specific user searched for in the past. They will be presented only after conducting at list one search . They and will include the most recent searches only.
Popular items are items that are being searched by many users in many occasions (make sure to collect this information from the relevant database. For example, include searches that were conducted on the specific project only)
Trending item are items that are being searched by many users in many occasions, on a recent defined time frame.
The number of recent and popular/trending items should be equal. If there’s not enough data to provide an equal amount of both types the list may be divided unequally.
Recent items will be placed above popular/trending items
...
Each item will be accompanied with an icon, indicating the type of suggestion (recent or popular)
Use the suggestion list 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 on lists of 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 |  |
|
Enter first letter |  |
|
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 Answer 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).
...