DSV IoT Platform

DSV is a huge international shipping company from Denmark, operating shipments worldwide. Especially in Africa, shipments are being hijacked and stolen, a lot of goods are damaged due to too high temperature, humidity or exposure to light. Shipments especially from pharmaceutical and technology companies such as Apple have a high demand of monitoring their goods during transportation.

CAPABILITIES

Interface Design, User Experience

TOOLS

Figma

The project accommodates the demand by monitoring shipments with the use of sensors that constantly report the current state of the following parameters:

Inside the platform it is possible to create notifications for each kind of parameters listed above. The users are DSV employees with a need for tracking specific goods for customers.
Key features are: creating a plan (template), setting up customized tracking metrics, and sending alarms on email and API.

Iterations and more iterations

Plan creation was the section that had most design iterations (and it will continue to have while user feedback is received).
Initially, the user had a choice of 8 parameters to choose from, these parameters were all grouped inside a drop-down menu.

Iterations of the parameters selection UI

My first thought was to take these parameters and make them more visible, displaying them all together as radio buttons. That way users can scan and select the options faster, instead of having to click to open the menu.

As a rule, if there are less than 5 options it is recommended to display them as radio buttons rather than in drop-down menus. Additionaly, icons were designed in order to make it even easier to visually identify them. Since 4 of the parameters were regarding Geofence, I grouped them into one item called Geofence, that once selected, shows the additional 4 options to be chosen. This pattern is called Progressive Disclosure:

“Initially, show users only a few of the most important options. Offer a larger set of specialized options upon request. Disclose these secondary features only if a user asks for them (…)”
Jakob Nielsen

Mockups

Plan creation interface — adding a geofence route parameter
Create notification modal

In the create notification modal we got user feedback on the add email(s) interaction. Although I had added email placeholders in the input field, one user did not know how to finish adding the email. In order to address this problem, an instruction copy was added, guiding the user on how to add one or several emails.

Shipment detail page. All data generated from the devices (sensors) are displayed here in graphs
Device selection interaction

Takeaways

Shipping jargon

In the beginning of the project I had to get familiar with the jargons used in the shipping industry. There were some points where it did not make sense for me the way something was being called, however it was important to keep the same language that users in this industry are familiar to.

Style consistency

DSV has different kind of services and products where customers need to interact with a digital interface. Their corporate brand identity is expressed in these channels, and for the IoT platform shouldn’t be different. The UI had to follow DSV’s overall style.

⟵ Back to Cases