CS-Aware Cybersecurity Platform

Duration: 2 months

Skills used: Personas, Wireframing, High fidelity prototyping, Component design

Challenge

From September to October 2022 I worked as a UX/UI design intern at Rheasoft in Tranbjerg. Rheasoft had previously built a demo version of the software, but they weren’t satisfied with the design of their demo. I was tasked with redesigning Rheasofts cybersecurity platform.

The Users

While I wasn’t tasked with conducting UX-research, Rheasoft had some journals that had been published during their European project also named “CS-Aware” where UX-research had been done. I drew upon this research to gain some idea of the potential users.

Two users were identified. The system administrator responsible for the IT-infrastructure and the manager of the department.

Image of persona one, Claus the systems administrator Image of persona two, Eric the IT manager

Wireframing

I started my design by making a set of wireframes for mobile and for desktop in order to get an idea of how i wanted elements to be placed in the screens.

wireframe of the dashboard page for desktop
wireframe of the social media page for desktop
wireframe of the infrastructure map page for desktop
wireframe of the dashboard page for mobile wireframe of the social media page for mobile wireframe of the infrastructure map page for mobile

Atomic design, building with components

I build my design using the atomic design philosophy. This philosophy breaks down design elements in small components called atoms, which can then be combined into larger components called molecules, which then in turn can be combined in to organisms. Following this philosophy ensures consistency and makes it easy to make changes across the entire design at a later stage.

atom components used in the cs-aware project
molecules and organisms used in the cs-aware project

Results

The final design ended up being in total 54 screen designs and 32 overlays across 6 resolutions. I handed over the design to two developers who’s now building the design using bootstrap and jQuery.

Contact me


madsemmertsen@gmail.com