Input
Keyboard navigation indication
Dropdown
Matching characters
Item meta data
Item shortcuts
The shortcut options will change dynamically based on the available options for the result item in-focus.
The Dynamic Search should only be use to search across multiple, separate sets of data. These data sets can exist in separate tabs or separate pages. To search a single set of data, use a Picklist or a Control Bar with a search field.
Ensure the search input is easy to locate and stands out on the UI to encourage users to utilize the feature. The search should be displayed as a "box" using a input as opposed to a link or button. ¹Ensure the search input is easy to locate and stands out on the UI to encourage users to utilize the feature. The search should be displayed as a "box" using a input as opposed to a link or button. ¹
Do
Don't
When used as an app-wide search, the input should be displayed in the App Header and should be accessible from every page. The Dynamic Search should be used to search across a wide range of app content. ³
Do
Use Sections and Dividers to group related results into categories to help users quickly scan the results. ²
Do
Don't
Placeholder text in the form input field should inform the users about what they can search for. Include examples if necessary.³
Do
Don't
Use an empty state if the search returns no results. See Empty State. Example:
Do
