Eleken's designer joins Vector0's team to create UI/UX for cybersecurity project

Such an advanced solution usually requires high-end UI and UX. Being a small startup, Vector0 were trying to do most of the work themselves. But having just one UI developer working on the UI and the back-end, they quickly understood it was not enough.

Vector0 planned to launch their DarkWave product in 6 months, and hoped to have a full-functioning MVP completed by that time. So, they were looking for a designer experienced in cybersecurity solutions to help with the UI and create the UX from scratch.

Having worked on cybersecurity projects such as Great Power Influence, and Cylynx, Eleken was the right fit. This is why Vector0 decided to pick us for the collaboration.

Others did not understand the cybersecurity or SaaS space as in-depth as Eleken did, which removed more vendors from our selection criteria. In the end, Eleken provided an affordable, easy-to-follow cost structure for small startups, excellent support, a dedicated engineer, and experience in our vertical.

Quentin Rhoads-Herrera, CEO /

Using sidebars to make the pages look simple yet informative

Most of the DarkWave pages represent simple charts that contain all the essential information:

If you need to find more about a certain detail – like vulnerabilities for a certain IP address in this case – you can click on the IP to open the sidebar containing additional data. You can also expand the sidebar for more detailed information.

The expanding sidebar feature allows to retain the simple and straightforward look of the DarkWave while granting users easy access to additional information.

Designing metrics to contain all the important data without looking overwhelming

As DarkWave shows a lot of different data on vulnerabilities, we had to present this data in a simple and straightforward way, making it easy for the users to distinguish one chart from another and understand them even after a brief glance.

To achieve this, the client reached out to DarkWave users and asked them to share the feedback on how they want the metrics to look, what they like already, and what could be improved. After gathering feedback, we created two versions of one chart and showed it to users. After several iterations, we came up with this design for the chart:

The chart shows the existing vulnerabilities and whether they are past their due date or not. All the vulnerabilities are divided into four categories depending on their severity: critical, high, medium, and low. Each category has its own color to quickly distinguish the overall severity level in the chart.

As this design approach got approved, we used it as a reference for visualizing other complex metrics in the project. For instance, the Exemptions metrics was designed in a similar way:

Here’s how the metrics look altogether on a screen:

Viewing and editing vulnerabilities in a simple way

The main function of DarkWave is to spot and display vulnerabilities. To do that, it uses data collected from various sources, such as Rapid7, Tenable, and others.

Here’s how it looks at first glance:

Our designer added the Severity filter option to allow users to spot most threatening issues first. Severity is determined using the globally recognized Common Vulnerability Scoring System (CVSS). Users can also track the reporting source and access a concise chart summarizing vulnerability count and severity at the screen’s top. This provides essential insights on a single screen, streamlining information consumption.

And if you need more details, such as what exactly is the vulnerability and how to solve it, you can just click on the vulnerability and see its description, the solution, the source informing about the vulnerability, and other things:

The expanding layout allows users to preview data in the way they prefer to. You don’t necessarily need to see all the information about the vulnerability if you don’t need it (for instance, if it seems low-risk and therefore less significant), but you are always able to find out more about it in just one click.

Merging vulnerability records from different cybersecurity providers

DarkWave uses the data from different sources to record vulnerabilities. This is great for cybersecurity reasons, as the more sources, the better. Furthermore, different sources can provide various information on one and the same vulnerability. But at the same time, it might be confusing to see so many similar records in one list.

To fix that, we decided to add the merging feature to DarkWave. Now users can

• Merge these records into one or unmerge when necessary
• Choose a source from a drop-down list and easily switch between them

Exporting, updating, and editing vulnerabilities

While Eleken mostly focused on simplifying the data presentation in DarkWave, we also wanted to give more flexibility to those users who already feel familiar with the data. That’s why we created various features that allow to operate with vulnerabilities.

• You can easily export all vulnerabilities or several of them.
• Pick the type of report of the vulnerability you want to export and the file format.
• Add custom vulnerabilities.
• Add notes to vulnerabilities or edit them.

Eleken created the full-functioning MVP for Vector0 by their full launch in January 2023

Vector0 had a great concept that initially lacked UI/UX expertise. Our designer helped them create a cybersecurity solution that can be used by both beginners and experienced users. And though DarkWave is a data-heavy platform, it doesn’t look intimidating. Most of the essential information looks like simple charts with expanding sidebars providing additional data in one click.

As a result, our client received a full-functioning MVP by the deadline. We provided the Figma data, videos explaining the design, and the UI kit to help the developers integrate new design into their platform. The client was extremely satisfied by the outcome.

Here’s what Vector0 says about our collaboration:

We have presented the new UX design created by Eleken next to the UX we threw together with no UX experience, and the overall feedback was terrific. Every advisor, investor, and the customer loved the new design.

Quentin Rhoads-Herrera, CEO /