Frame 689.png
Logo.png

Top X filtering system in Scan List

UX/UI,

Creating a new filtering system for Perception Point dashboard.

WHAT WE DID

Built a new, modern, and easy-to-use filtering system that enables the admin users to see the most attacked criteria in the organization - quickly and effectively. The filter is designed to be fully customized to serve the customer's specific values and needs.

MY ROLE

As the project's designer, my goal was to create a straightforward and easy-to-use design that is simple enough to use, modern, and clean.

THE CHALLENGE & GOAL 

Perception Point’s solution is built for the knowledgeable cybersecurity user. As such, the solution requires high visibility of information and full functionality. On the one hand, it allows the user to fully control and understand the security posture of the organization at any given time, and to take action upon it. On the other hand – it makes the dashboard crowded and full of information.

 

Before the introduction of the new capability, to see the specific results of a certain case or filter by a particular subject, users had to go through multiple stages. This included going to the Advanced Filter option - which is extremely complicated, detailed, and includes many additional filters. In addition, the length of the filter created a situation in which users who use the most common screen resolution - 720p (1280x720 pixels) -  would even have to scroll down a fold to see the relevant filter, making the user experience even more complicated.

Based on a review we made with our customers, we understood that some users have never tried the built-in filters and weren’t aware of this functionality. Other users – who knew this feature is available - found that filtering by attribute data was especially cumbersome as they had to:

  • Open an expand-collapse modal

  • Scroll down until they found the category they originally needed 

  • Search for or type the desired value

  • Scroll down until they saw the Apply button

 

Based on our findings, we decided to add new functionality: a filtered view of the Top X Attacks – based on the specific needs of the user.

filters.png
RESEARCH

We checked the users’ background, roles, how and what they use our system for, what they are interested in, and what they miss in the existing filtering system. Based on an analysis of this information, and discussions with selected customers, we established new insights into what the users are looking for. The result is that we decided to show only a few top results. After the first review, the users said that they want/need even more. Accordingly, we thought of a way to expand the categories to see even more attacks. 

 

Based on the analysis, we agreed that the following categories are the most desired by Perception Point’s customers:

  • Organization

  • Subject

  • Layer

  • Engine

  • Sender Address

  • Malicious URL

WORKING PROCESS

Following the research process, we moved to the design stage. However, before designing the component itself, we had to decide how to present each value. This is what we decided:

  • Each component will show 3 values at first sight. For each, we would show a name and count out of a 100% total.

  • Each value will be clickable.

  • An option will be available to expand up to see more values.

  • We will allow having a different presentation in view and another in hover (see Chrome store for example). This way we can make the view nicer and cleaner - while the hover option will allow it to be easier to work with.

  • We will consider having different views for different components to make it not too routine.

  • The order needs to be customizable at the customer’s discretion.

 

We decided that the filter will be a second level to the main filters on the top of the screen, and not directly at the top - in order not to compete with the main filters that the users use and use often.

THE DESIGN

We chose a minimalist and clear design because most of our screens show a lot of information at once. 

In addition, in the coloration of the component, we want to convey a certain hierarchy.

  • Consider having different views for different components to make it not too routine.

  • The order needs to be customizable for the customer's needs.

 

We wanted the filter to be the second level to the main filters on the top of the screen.

 

In the design, we wanted to do something minimalist and clear because most of our screens show a lot of information all at once. Also, in the coloration of the component, we want to convey a certain hierarchy.

We added a collapsible option to the filtering system in order to save space and prevent sensory overload at times.

2.png
2.png
Top X in Scan filter.png
Top X in Scan filter-1.png
Top X in Scan filter expand.png
SUMMARY

Our customers asked for an easy-to-use, customized additional filtering system that will show them the top attacked values in a few categories but won’t replace the everyday filters that they are already using.

The main reason was to avoid opening the Advanced Filters every time they need to look for a specific value.

We did the research and found out their needs. We designed a solution according to what they wanted, in a modern minimalistic way - and made the design customizable. 

 

The feedback we got from our customers is fantastic. Now, when they want to check their company's top attack, they don’t need to go to the Advanced search. So our solution did make their life much easier.  

Other Projects

PP Scan History

Scan-history.jpg

Perception Point

Screen Shot 2021-02-09 at 11.35.27 AM.png