Federated search results page design

End product, Final UI

Overview

Create a search results page for the marketing site that includes results for web pages, articles, shop products, videos, blogs and training. Each result category (page, video, product) had unique requirements like price or date published. Users also need to be able to filter by source and category, change how many results they see, display the results in grid or line form, and view which page of results they are on.

Problem statement

Create a search results page that pulls from multiple databases and displays a variety of link content sources.

Users & audience

Director of Public Safety - IT Director/Assistant Director - Communications/Radio system manager - Radio communications/technician - Police/Fire Chief - Procurement manager/agent - CAD manager

Roles & responsibilities

UX, UI, Digital marketing lead, Search vendor, Commerce tech lead

Scope & constraints

Budget set with the vendor prior to design resulting in limited build flexibility and dev collaboration

Process

Research included review of other industry leaders and business experiences like IBM, 3M, Expedia, Benjamin Moore; as well as competitors like Axon, Harris, Kenmoore.

For a UX baseline, I looked to empathize with users searching our site and the types of information to expect after completing a search and locked in on the concept, scent of information. User’s have an inkling towards the result they are looking for, even the medium. The inkling could be faint or clear but it is definitely present.

“I need to know how to enable this feature on my radio…” - video
“I need to verify the specs for this software are compatible with my network…” - text or chart
“I better make sure this is the right part before I order it…” - image

Grouped search results was an emerging theme that google likely led but was present in the industry and competitive analysis.

Uniform results, wireframe

Grouped results, wireframe

Grouped results use mental models to chunk results by the different result types. The results are formatted to highlight the unique attributes (page results have a longer description; product results has a larger image).

Compared to a universal listing where results are designed similarly to allow for a user to scan quickly and make a decision - all information (Title, image, date, source) is in the same place as the user scrolls.

Outcome & lessons learned

Outside vendors and budget ultimately steered design and business to the uniform results for mvp.