An advanced training platform for developers and DevOps engineers
SecureFlag helps developers and DevOps engineers master new skills with hands-on exercises and real-world scenarios in real development environments. Users have access to a continuously updated library of labs based on real-world vulnerabilities.
Northell is staffed with exceptionally talented professionals who are committed to delivering projects on time
Andrea Scaduto | Co-Founder & Director, SecureFlag
An advanced training platform that helps developers and DevOps engineers enhance their professional expertise
SecureFlag needed a redesign and optimization of their platform. The deadlines for all tasks were pretty short and we had to save almost everything by changing the visual part of the product.
Based on the concept of the application and its designs, we prepared a roadmap to start the development in an agile manner.
The main target audience of Secure Flag are companies that buy in-app subscriptions and create training programs for their employees, namely for developers.
Our team worked on the user persona. A user is a person who is being trained to improve skills in safe and secure programming.
Here is the user flow:
Secure Flag had its own design system. Our task was to modernize it and make it attractive for users. We worked on basic elements such as Text, Buttons, Forms/Inputs, Cards, Header, Footer, Colors and Icons. The main colors we used were blue and its shades. To make accents, we used bright colors such as red, green and orange. We made each element of the system design in one style to make everything look organic.
In the onboarding section, users answer certain questions so that we can customize the experience. Then they move on to interactive onboarding where they can see how the platform works.
This is the essential part of the platform where all statistics, information about active tournaments, exercises, level of progress, etc., are collected. From here, the user can go to other sections of the platform. The most crucial goal of the dashboard is to show users their most important statistics and results.
On this page, users get a list of exercises to perform. They can also view detailed documentation on these exercises.
In this section, users choose which programming language they want to learn. They can choose courses of any level (beginner, intermediate and advanced) and read more about them or watch videos.
Here users can see a list of active tournaments and a list of completed tournaments. In the active tournament, the user sees all the information about it and the leaderboard.
In addition to statistics, users can see all their awards, certificates, and best results in this section.
On this page, users see all the actions that take place in the team, who is in what place, who has done how many exercises, who has how many points. Also, here are team metrics.
This is a help center where all important information is divided into blocks. Here the user can ask any question about the platform.
We worked on the frontend part of this platform. Secure Flag came to us with a ready backend and we only had to do the layout. We have turned the entire platform into a full-fledged product that meets the needs of the client.
Our software developers wrote code for the components using the documentation and architecture from previous steps the Northell team worked on. The SecureFlag project’s tasks were divided between the team members according to their area of specialization. Our front-end developers were responsible for the client side of the SecureFlag platform.
Our QA engineers worked on testing all delivered code and wrote automated tests for developed components.
After the development and testing stages, there was a production deployment and integration. We delivered the tested version of the platform to the users for beta testing. Our team collected feedback from the users, and fixed all the bugs, and implemented some improvements. As a result, we have turned the entire platform into a full-fledged product that meets the client's needs.
After the deployment of a SecureFlag product on the production environment, if any issue comes up and needs to be fixed or any improvements are to be done is taken care of by the Northell development team.
Northell team managed to improve the appearance of the platform, simplify it, and also upgrade. Thus, the platform has become better and more user-friendly. After creating the design, developers worked on the platform and turned the design into a full-fledged product.
Become a part of a community with more than
2000 Entrepreneurs who want to create
valuable products.
