Log In
Back to Designs page

Table of Contents

Related Research

No research entries have been linked to this design.

Resources

Platform Level Search
Figma

Additional tags

# field 5 # form 6 # landing page 5 # search 1 # table 5

Platform Level Search

Tina Yip avatar

Author: Tina Yip | Last edit: April 02, 2024 | Design type: Empty state, Error state, Tables | Product area: Ansible

Platform Level Search

Since the services of AAP are all separate, there is currently no way for a user to find specific content between them. With the consolidation work of the platform, we wanted to create search functionality that would span across the different services within AAP.

There are two ways a user can utilize the platform level search, from the search icon on the masthead or the Search section on the navigation.

Masthead:

Navigation:

Search from the masthead

If the user decides to enter the search capability from the masthead, the user will click on the Search icon and begin typing. Once something is entered in the field, the search will begin and a dropdown will appear with search results. The search results will always surface the last three modified items of whatever the user is searching, then by the sections of the navigation, and the top 5 results of that specific section. 

There are two options of how we can show this dropdown.

Option 1:

  • Showing a full list that is scrollable of the search results with the same limitations as above
Option 1 of search results dropdown - full list and scrollable

Option 2:

  • Showing each section of the navigation as a tabbed view that the user can click on to see more results with the same limitations as above
Option 2 of search results dropdown as a tabbed view by navigation section

From here, the user can either select the specific resource, which would take them to that resource's details page or they can click “View more” or “View full results” which would land them on the full search results page, either on that respective section or on Last modified, as that is the first area of the search results page.

Search from the navigation

If the user decides to enter the search capability from the navigation, the user will click on the Search section on the side navigation and will land on an empty search page.

Empty search results page from navigation

The user can then type in the search bar to populate some results. The left side of the search results will populate with Last modified first which houses all of the related resources based on when it was last modified, as a filtered view of all the search results. Then, each area of the navigation would appear in the same order as it is in the navigation. If nested sections from within the navigation area produce search results, those would appear as nested sections in the dropdown of the main navigation section.

Full search results page with nested sections in dropdown

If there is only one search result for that main navigation section there would be no dropdown. Clicking it would have the same interaction as clicking into a nested section. The relevant resources would appear on the right hand side and from there the user can click into a specific resource and be taken to details page.