DFN Freight Dashboard Design

Project Overview

Create a streamlined, easy-to-use process for shippers and carriers to (a) negotiate and confirm shipment orders and (b) monitor shipment status.

My Contributions

I worked together with my team of 2 other UX students throughout the entire phase of the product’s development cycle which includes user research, mockups, prototyping, and user testing.

Tools Used: Figma

Duration: 1 month (internship) 

Discovery Phase

The Problem

DFN Freight needs a dashboard for carriers who can post bids for their shipments. The dashboard should allow carriers to place bids, confirm bids, and monitor orders. They currently have an existing dashboard designed for the shippers side. We are tasked with creating only the carrier side of the dashboard. There are also two users for this product: the carriers and the shippers.

Findings

After speaking with the client, there were several key findings we discovered that could be added to the design of the software.

  • Introducing a notification center for receiving real-time updates on orders can prove to be a valuable solution for carriers and shippers to stay informed about the latest developments.

  • Adding a filtering option for bids will help shippers find bids that are most fitted for them that they can barter for.

  • Incorporating a reporting feature will help monitor shipments effectively. Accidents and delays can happen on the road, so it would be an important feature to inform carriers about any unexpected issues.

  • Bids happen very quickly in a matter of seconds. They want us to develop a way for users to quickly place bids.

Overall Findings:

  • All platforms connect carriers and shippers

  • All platforms fulfill shipments from start to finish

  • All platforms had a reporting section

Research

Competitive Analysis

We performed competitive analysis on 5 softwares (Truxweb, Convoy, Evotrux, Freightera, Zuum) that allow their users to place bids and monitor shipments. From these similarities between these platforms, we needed to find out what features on their software help establish trust in the consumer. For example, Freigthera, Evotrux, Zuum offer free quote pricing on their website so that potential users can test their platform first-hand.

TruxWeb: There is a slideout that allows users to leave notes. It doesn’t take up a lot of space and users can view other shipments at the same time. 

Evotrux and Truxweb has a filter option so users can quickly search for bids

Key Findings

TruxWeb: Homescreen has different tabs for shipments (active requests, in review, confirmed, rejected) - makes it easy to navigate between shipments and to keep track of ones that have been confirmed/rejected

Convoy has a half menu slide out page that lets users place bids

HOW MIGHT WE?

We developed three questions to help us understand the problem of our users:

How might we implement a way to place bids quickly without taking too much time? 

How might we make it easier for the user to find bids that are more suited to their preferences? 

How might we effectively implement a notification system to alert users when actions need to be taken?

Design Phase

Solutions

Create a notification tab on the main dashboard where users can easily look it up. Have notifications pop up in real time as well as reminders for actions that need to be taken (ex: sign documents).

  1. Design a slideout bid modal where users can quickly place bids on shipment while also viewing out bids. 

  2. Design a new section on the dashboard that will gather all the order data (when the bid has been placed) and keep track of it

  3. Create a form to report issues with an upload image feature

User Flow

Style Guide

User Testing

MVP

Our client had a style guide already. They provided their logo, colors, and fonts. From there, we just built upon that guide with the new buttons and icons we used.

Create New Shipment User Flow

Find New Shipment User Flow

HiFi Screens

Previous Calculator Design

After creating the user flows and understanding what were the priorities, we started designing the dashboard of the carrier side. DFN Freight already had a shipper side built out and needed something that was similar to what they already had but different features that’s more catered towards carriers - placing bids, reviewing orders, viewing order status, notifications, etc.

We conducted user testing on 5 participants 2 of whom were in the trucker industry and 3 were UX designers. We also went through several rounds of iterations when reviewing with industry experts on the DFN Freight team. Our overall feedback was great. The dashboard was straightforward and easy to use.We also got feedback that it was clean and the modern look was nice. They mentioned that other software they used still had an archaic look to it.

  • It would be better to show related graphs that would be directly applicable to the users. Current graphs are mostly for long term reporting

  • How many more shipments need to be done? What shipments still need to be picked up? Drop-off?

  • Future research: Need to research further what graphs would be helpful for drivers

Viewing Shipments and Making a bid

  • When making a bid, the calculator section covers up a lot of information. Would it be better to minimize the calculator section and allow users to click and open it up?

  • One of our user testers stated that bidding actually happens more than once. It would be great to see a bidding history.

  • The current platform we designed only does one counter offer. Further research needs to be done on how to implement multiple offers.

Dashboard graphs were confusing

Design Iterations

Previous Report Issue Design

Updated Design: Added button for update status and report an issue

  • Users were confuse how to update status when viewing shipment details page. Can that only be done on the home screen? Or is there a better place to put it?

  • We added another button on the shipment details page so users can now easily update statuses through a dropdown

Updated Design: Added minimizing feature and more intuitive calculating functionality

Reporting an Issue and Updating Status

Next Steps

Lessons Learned

Further research and testing will need to be conducted. Our next steps would be to consider:

  • adding a bidding history and allow users to bid more than once.

  • We also want to look further into the notifications system and see if we can add more features to make the process of updating status quicker and easier.

The client also really liked the design of the carrier dashboard that they wanted to rebuild their shipper dashboard design to be similar to ours. Unfortunately, due to the time constraint of this internship, we were unable to build the shipment side of the dashboard.

This internship has been an incredible experience. We worked with the developers and stakeholders to build the dashboard side for the carrier. There were a few challenges we encountered regarding user testing. Our stakeholders had a hard time understanding why user testing was necessary for our design. Although they had an industry expert in their team, we had to explain multiple times that gathering insight from other truckers themselves would be extremely helpful in building the dashboard. New insights and ideas could come up that we didn’t think if before. After they understood the importance of user testing and gave us some contacts to reach out to, everything else flowed smoothly.

Other Projects