In designing the dashboard, we wanted to allow the consumption of as much information as possible at different levels, in a way that would be clear and fast. At the top of the page there is an overview - how many training sessions there were, how many red and blue teams, etc.

Below you can see the general level of readiness of all the teams in the company, the distribution of training can be seen visually in a Cascade Pai, so you can see the ratio of the amount of training to a group at the first level, and at the second level, you can see the loss-success ratio.

In addition, there is a linear graph that shows two parallel data information - time and points accumulated.

At the bottom of the page, you can see the timeline with a summary of information about the event that took places such as rating and time. You can visually see which training has already ended, what the active training is, and what the future training is.

Above all floats, is a panel showing the number of trainings and users currently in the arena.

Events Overview

A screen showing the company events currently running in the system. The members of the company's cyber team play on a separate platform - the event is a game that takes X time, in which they solve cyber problems. The screen shown here is the side of the team leader, who oversees and manages the events.

The screen first loads in an empty state, which occurs when there are no team members inside the running event, or while the data is loading.

Once the data appears, an overview of the various teams is given - rating, team members, target duration, help/refresh options.

In addition, the status of the individual team members is displayed, and an option to remind them to connect.

Design system

The designs were made in XD and there I created a design system that contains all the components, fonts, colors, and rules.

In addition, I created a style guide for the future use of the company's design team, to help maintain consistency and ensure a valid transfer to development.