The Drivers section allows users to manage their company’s drivers. This section includes:


1. Drivers List

Drivers List on Invision

The drivers list contains a Data Table that displays a list of the company’s drivers, along with basic contact information about the drivers.

The Data Table includes the following columns:

  • Driver

    • Has Avatar and Name

  • Phone

  • Email

  • Status

    • Active; or

    • Inactive

“Pending” status is not for MVP

  • On Mobile

    • Green light; or

    • Red Light

  • Delete Button

    • Delete Driver
      If the user clicks the Delete Driver button, there should be a modal that asks the user to confirm the deletion. This is similar to the logic in the Users & Roles section.

CSV Options

CSV Templates

This table also has a button for CSV options. When the user clicks on the button, there is a dropdown with the following options:

  • Export Drivers List

    • This downloads a CSV spreadsheet with the data from the driver’s list currently on Carrier TMS

  • Download CSV Template

    • This downloads an empty driver’s list template that the user can fill out and upload to propagate the drivers list

  • Upload Drivers List from CSV

    • This pops up an upload modal

    • The user can upload the filled out CSV template

      • There should be validation that the file is the correct template and that the information was entered properly when the user uploads the file

      • If the template was properly completed, the data should propagate as the driver list

      • If the file is not the right file, or the data was not input correctly, the user should see a modal that says:

        • Title: Could not upload template

        • Text: “There was a problem uploading your CSV. Please ensure that you used the CSV template provided by Zuum and that all fields have been filled out. If you continue to experience this problem, please contact customer support.”

2. Add a Driver

Add Driver on Invision

Driver Added Snackbar on Invision

A user can add a new driver by clicking on the “Add Driver” button in the Data Table Toolbar.

When this action is initiated, the Data Entry Component slides out, and the user can add a new driver by inputting data into the form. The form includes the following fields:

  • First Name

  • Last Name

  • Mobile

  • Email

All fields are required except email.

Once all required fields are completed, the “Add Driver” button becomes active, and the user can click it to add the driver.

The Driver’s mobile number will serve as his login key via the mobile driver app.

All of the general Data Entry Component rules apply here, including:

  • Closing rules (without changes, after changes, etc.)

  • Snackbar

3. View Driver

When a user clicks on a driver’s row in the Data Table, they can view the driver’s information. Driver view has three sections, Profile, Load History, and Safety.

These sections are represented by a Horizontal Navigation Menu.


Profile on Invision

The Profile section allows the user to view and edit information about the driver.

At the top right of this page there are two buttons:

  • Update

    • This button is disabled by default

    • This button becomes active when any changes are made to the data on this page

  • Delete

    • This button deletes the Driver

Save Changes
If the user makes changes to the data on this page, and attempts to navigate away from this page without clicking on the “Update” button, there should be a modal that asks the user if they want to “Save Changes.”

Delete Driver
If the user clicks the Delete Driver button, there should be a modal that asks the user to confirm the deletion.

This section includes the following four subsections:

Profile Picture with Status Bar

This is a profile picture of the driver. The user can click the “update profile picture” button in order to change the profile picture. This should bring up the upload image modal that has been used in previous pages.

Below the profile picture, there is a “location” indicator, which displays the last location of the driver that was retrieved from the driver app.

  • There should be a second line underneath the says:

    • Updated on {Date + Time}

      • This should show the date and time that the location data was last updated

The Status Bar reflects whether the driver’s status is set to active or not active.

If the driver’s status is set to:

  • Active - Status bar is blue

  • Not Active - Status bar is gray - Example

Status Switch

The Status Switch is how the user can indicate whether the Driver is active or not active. Status changes should be reflected on the user’s Status Bar and in the Drivers List.

Default Driver Rate

The Default Driver Rate menu allows the user to set a default rate type and amount for the driver. These default settings will propagate by default when the user assigns the driver to a load. They should still be editable.

Just as in the Assign Driver menu, this form includes the following fields:

  • Rate

    • Flat Rate

    • Hourly

    • Per Mile

    • % Load (the user sets a commission percentage based on the total income from a load that the driver is assigned to)

  • Amount (Currency format - $0.00)

Assigned Equipment

The Assigned Equipment menu allows the user to assign to the driver a

  • Truck, and

  • Trailer

Like the Driver Rate, the assigned equipment will propagate by default when the user assigns a driver to a load, and should be editable within the load details page.

Data Form

On the right side of the screen, there is a form with the Driver’s data.

This form has four sections:

  • Contact Information

    • This section includes the driver’s basic contact information, including

      • First Name

      • Last Name

      • Mobile

      • Email

      • Address

  • License Information

    • This section includes information about the Driver’s commercial driver’s license, including

      • CDL #

      • State of Issuance (dropdown)

      • Expiration Date

When the driver’s license is 90 days away from expiration, please place an Alert icon next to the expiration date field.

  • Designation

    • This section allows the user to select whether the Driver is an employee of the company, or a contractor. There should be a Radio Button selection with the following options:

      • Employee

      • Contractor

  • Emergency Contact

    • This section allows the user to designate an emergency contact for the Driver. There are two fields:

      • First and Last Name

      • Phone Number

    • There is a button at the bottom of this section that allows the user to add another emergency contact. Clicking this button adds another row with the same fields as above, including the “Add another contact” button.

      • The user can add as many emergency contacts as desired.

Load History

Load History on Invision

The load history section is a Data Table that allows the user to view all of the loads to which the selected Driver has been assigned.

The Data Table Toolbar includes a dropdown on the right side, instead of a button. This dropdown allows the user to quickly select another Driver. The options should be a list of all of the company’s Drivers.

The Data Table includes the following columns:

  • Load ID

  • Pickup

  • Dropoff

  • Distance (Miles)

  • Date Completed

This data comes from the company’s database of Loads, filtered by the selected driver.


Safety on Invision

The Safety section is generally used by Carriers to maintain records relating to their legal requirements with respect to their drivers. This includes maintaining signatures on necessary documents, records of drug tests, and any other documents related to their drivers.

Data Table
This section is made up of a Data Table with the following columns:

  • Name

    • This column displays the name of the item/document

  • Complete

    • This column indicates whether the requirements of the item has been complete

      • For the Required Safety Items, there is a checkbox to indicate completion

      • For Drug Tests, there is a Status Chip that indicates “Passed” or “Failed”

      • For any other record, this field is left blank

  • Date

    • Indicates the date the item was completed (manually input by user when creating a record or checking a box)

  • Document

    • A button to view the corresponding document

Data Table Toolbar
The data table toolbar has:

  • A dropdown to quickly switch driver (just as in the load history section)

  • A button to “Add Record”

Record Types
There are three types of records:

  • Required Safety Items (Invision)

    • The law requires all carriers to make sure their drivers perform these 4 items

    • These items should be pre-loaded by default for each driver

      • Initially, they should be unchecked, and the date and attachment columns should be blank

    • When the user checks the checkbox on an item, a modal should popup where the user can input:

      • Date completed (required)

      • Upload Image (optional)

        • The button to “Mark Complete” is disabled until the user enters a date

    • When the user completes the modal, the checkbox should be checked, and the table should be updated with the input information.

      • Snackbar - “Record has been updated.”

  • Drug Tests / Other (Invision)

    • Drivers are subject to periodic drug testing.

    • When a carrier clicks the “Add Record” button in the Data Table Toolbar, a modal pops up for entering a new record

    • This modal has the following inputs

      • Record Type (dropdown)

        • Drug Test

          • If the user selects this option

            • A “Date Completed” input appears below the dropdown

            • Two radio buttons appear below the date input
              - Pass
              - Fail

            • Upload Image (optional)

        • Other

          • If this user selects this option, the following inputs appear:

            • Record Name

            • Date (optional)

            • Upload Image (optional)

Remember the add a snackbar!

“New record added.”

When a drug test record is added, the complete column should display the pass/fail status. (Invision).

Required Safety Items

Mark Complete Modal

Add Record Modal

New Record Added

We use cookies in order to give you the best possible experience on our website. By continuing to use this site, you agree to our use of cookies.
Privacy Policy