Security management platform
SaaS application for teams of developers to track and resolve security issues
Table of Contents
Project Roadmap
This project is a startup, so new requirements appear as soon as the client gets new feedback from their users. Our approach is flexible, so we select the most suitable methods to provide value and quality on each stage of the project.
Getting
to know the system
Security teams often get frustrated from trying to keep up with endless lists of bugs. That’s why the clients decided to launch their own startup and improve the security workflow.
The clients came to us after working with another design team. They started with an MVP and wanted to continue working on new features. Our task was to create UX and UI design for the new requirements, while maintaining the established design system.
Project Challenges
Flexible startup approach
Start with MVP and work with new requirements as they appear
Developer perspective
Work in close collaboration with developers and provide quick support
Advanced users
Provide shortcuts and optimize repeated actions for experienced users
UX and UI design
After we gather enough information about the requirements, we proceed with wireframing and prototyping. We use Figma to build all the screens and link them into a clickable prototype. We take advantage of responsive auto layouts, reusable components and variants, to make design flexible and easy to implement.
UI Language
We chose a font Rubik for this project because this font goes is a sans serif with slightly rounded corners and this font is well readable both large size and small size.
Fonts
Colors
Primary
@BlueBrand
#5073f6
rgb(207, 21, 45)
Shades of Gray
Alerts dashboard
Security teams receive hundreds of vulnerabilities from automated tracking software, but most of them are very similar and bring no additional value to the user. Filtering the important vulnerabilities manually takes a lot of time and effort.
The application uses sets of pre-defined rules to group vulnerabilities into actionable alerts, which are easier to manage. As a result, users can focus on important security risks instead of filtering vulnerabilities manually. Our task was to show the value of this feature on the dashboard. We used a funnel chart to show the large input of vulnerabilities compared to the small output of alerts.
Alerting policy creation
Users can create their own sets of rules to define alerts. This process is highly customizable and includes many different steps. Our task was to make the layout simple and user-friendly, while keeping all the advanced features.
We built a step-by-step flow, which allows users to create their own alerting policy. The users can see all the steps and navigate between them. We also introduced shortcuts, such as templates and auto selections, to eliminate unnecessary repeated actions.
Elements (E00.00)
Elements are simple entities, they consist of bases. Not independent and often found in different cases and modules. They do not carry the semantic load by themselves. Are more technical entities.
Components (C00.00)
Components are intermediate entities between patterns and elements. If you divide the pattern into entities, you get a component.
If you combine elements into some entity, but it is not completely independent, as a pattern, it is a component.
As a result
$3.1M received from investors to proceed with development
Incredibly happy with the quality of work delivered by the team. They really do deeply care about making us successful and I can see that in the amount of research and thinking they do before designing something for us. The whole team is very good to work with, deliver things on time and always stay on top of their work.
Our perfect team
Yevheniia Klysha
Lead UX Designer
Olesya Vdovenko
Senior UX Designer
Eugeniya Zhuravlyova
UI Designer
Oleksandr Belkin
Project Manager
Olha Kirdiaieva
UX Designer
We're
all ears
Fill out the form to start the conversation — we’ll get right back to you
Amazing!
Thank you so much!
See you soon