DAS

Project language

english, german

Client

MailbornWolff, university project

Year

10.2021 – 02.2022

In a nutshell

DAS (Detect weak points, Analyze risks, Secure the system) is a software application developed for the cyber security firm MailbornWolff by "Das Hexagon", a team comprised of six computer science students and one communication design student (me) from Hochschule Mannheim, as part of the SEP (software engineering project).

Background

MaibornWolff is a globally operating IT firm with a wide spectrum of specialities all centering around software engineering and IT-consulting, which include IT- and agile consulting, software-, web- and mobile engineering as well as test management, cyber security, design thinking, digital transformation consulting and -engineering, salesforce, IoT, Blockchain, DevOps, cloud-native development, machine learning, XR and UCD.

The cybersecurity field of MailbornWolff advises and creates risk analyses of customer's IT system architecture. These advisors lose a lot of time because of the effort to create a new risk analysis from scratch in Excel for every customer. That’s why MailbornWolff needs a software, that simplifies the whole process.

Problem

So the request to us was a web program that let you easily visualize a customer's IT system architecture with icons that should be able to be connected and edited with different parameters and values. Several other must-have and can-have features were listed.

Due to this specific case, the usual research phase of UX design has been altered.

Process

Analysis & Research

First of all, we had to understand the whole risk analysis process. This happened after lectures by MailbornWolff and summaries and analyses of the learned.

Then I specifically planned out the UX and regular design through analyses of competing programs already on the market. I studied their design, UX and noted down pros and cons of the respective program.

I even looked at Super Mario Maker because the firm proposed a drag and drop bar for the icons.

image
image
image
image

Unique Selling Point

Our unique selling point is the inclusion of the "4x6-Methode", a method specifically developed by the company that consists of 6 potential points of attacks and 4 types of attackers.

User Story Map

After all the lectures by MailbornWolff we defined a user story map that covers all necessary functions and features of the needed program. Due to the growing complexity, this took several tries to finally nail and truthfully understand.

image

Design Sketches

The first sketches of the surface and interface used drag and drop bars to place the icons on the canvas. This was later removed in favor of a radial menu.

image image

Prototyping

The design process started out with prototyping in Figma. The overall design is kept in a simple, minimalistic but still easy to understand way that also follows MailbornWolff’s corporate design.

All interactive elements are rounded and/or grayish to distinguish themselves from the black and sharp non-interactive elements.

The growing complexity of the whole program with the steady feedback through tests led to ever-changing pages throughout the whole designing phase.

image

Result

image

Retrospective

The biggest thing I’ve learned through this experience was how it would be to work with computer scientists as a single designer. Truly a humbling and educational experience. Other useful things were bringing my Figma skills to a whole new level, finding out about useful websites like getbootstrap.com and of course working with a big client.