Douglas Nonato | Cálculo Jurídico Dashboard

DATE —
Sept_2018

ROLE —
UX Designer

KIND —
SaaS Dashboard

Overview

Social security calculations, especially in Brazil, are extremely complex and can take a few days, due to the hundreds of rules and the specific situations of each case, so lawyers usually need the help of a professional accountant in the area to perform these calculations.

Cálculo Jurídico is an online tool that allows the lawyer himself to be able to perform social security calculations without the need to hire a third party.

The first version of the system was developed using Bootstrap as support for the UI. It worked well for a while,however as the tool evolved and new features were added, the usability got more complex, so the user started to have a hard time trying to complete some tasks within the platform. This situation brought up the need for an UX approach, and the creation of a custom UI.

The process

I was responsible for conducting the redesign process, and as a first step, we have tracked all possible paths within the system, discovered the journeys to perform a given task, and then suggested improvements. With a wide variety of combinations for each calculation, it was not clear how each parameter affected the following screens or the final results, which was on a separate screen. As an improvement, we decided to anticipate some information and create real-time feedbacks, to avoid the need to go back and forth between screens to test a new parameter.

Cálculo Jurídico Fluxogram — [fluxogram]

Some of the structural changes were the transposition of the main menu (1) and the calculations menu (2). The main menu at the header, besides being unusual, didn't allow the addition of more items. The internal calculations menu, on the other hand, didn't seem very connected with the content, in addition to having sub-items that repeated themselves and confused the users, which were later incorporated into the calculation screens.

Cálculo Jurídico dashboard — [old]

[new]

In terms of content, due to the complexity of the tasks, it was common to see multiple questions at the same time. To make it simpler, we have decided to bring only one question at a time in the most crucial tasks, as in the calculation wizard.

Design System

As it was a temporary job, my strategy was to develop a simple component library, so the development team could implement new features in the future with greater consistency.

Outcome

Microinteractions

One of the problems was that, due to the complexity of performing the calculation in the manual method, new users were suspicious about the veracity of the calculation, since the system presented the result instantly. To tackle that we have chosen to create animations during the calculations, telling that the computer was processing and would soon present the data.