UX/UI

Filter Component Redesign

Overview

The “Global Controller” is a primary component of the product. It allows the user to filter the data displayed on each page throughout the portal.

The Problem

The controller has many important inputs, but its original design took up important real estate to display all the options so it was hidden by default and had to be expanded and then collapsed once settings were applied. The connection between the data displayed on the page and the filters set was not clear and easily lost when hidden, this made for a poor user experience.

Original Design
The New Global Controller

The Solution

Repackage the Global Controller in a condensed form factor that gives the user a persistent view of their settings without losing functionality. This also reduced the number of clicks required and made clear the link between what filters are set and what data is displayed below. Inspiration was taken from travel booking website where all results are dictated by the dates and filters set prior to searching.

Traffic Source Selector
Date & Time Selector
NQL Selector
Additional Options