Load Board Responsive Redesign

The former Loadboard was not 100% responsive.

Google analytics showed that 30% of our users access our desktop application via a mobile device.

User feedback and Fullstory video recordings indicated that users got frustrated when trying to book a load on a mobile device. The current responsive load board listing obscured the information they needed to see to make a decision. It also was full of visual bugs and was difficult to navigate.

Who are the users? What do they need? Why?

The Ship.Cars load board has two types of users: Dispatchers and Owner-Operators.

Dispatchers are the people behind the scenes who work for car hauling carriers to ensure that truck drivers have vehicles to haul and stick to their appointed arrival times and destinations.

An owner-operator is a small business owner. They drive their own trucks while typically also running the day-to-day operations of the company.

Quantitative Data

To kick things off, We set up an in-app popup survey to learn who accesses our load board via a mobile device. We let the survey run for a couple of weeks.

Here are a few of the questions asked.

• What is your role? (Dispatcher or Owner-Operator)
• Have you ever accessed the load board from a mobile device?
• How often do you access the load board on a mobile device per week?
• Were you able to find loads easily using the load board search?
• Was it easy to book a load?
• Were you able to navigate yourself around the load board easily?
• On a scale of 1 to 5, rate your experience using the load board on a mobile device.
• Can we reach out to you by phone to learn how we can better the load board?

Qualitative Data

To confirm some of the assumptions, we interviewed multiple owner-operators by phone and in-person. This helped us paint a clear picture of who they are and why they are having these problems.

These owner-operators are always looking for loads between pickup and deliveries. They are sitting in their truck or at a coffee shop accessing the load boards via their phone 90% of the time.

We reached out to a  few none-Ship.Cars fans. We asked them to pull out their favorite software. It was usually our biggest competitor. These guys tend to be brand loyal. We asked them to show us everything that they loved and hated about it. One driver said he would switch to Ship.Cars if we added a few features; like maps and bookmarking.

The product owner and UX team agreed that we need to take a mobile-first design approach to make the application 100% responsive.

What is Responsive Design?

Responsive web design is a web design method that enables web to fit the screens of different devices automatically, displaying the content in a way that people feel comfortable.

This greatly reduces users’ operations like panning, zooming and scrolling when browsing the web.

Why Mobile First?

When you start with the desktop platform, you tend to want to take advantage of everything that the platform has to offer. You build an amazing product that leverages lots of great technology, only to realize that none of it scales well down to mobile.

Progressive Enhancement

Here we’re starting with a project that is both super lean and quite impressive. You’ve taken all of that starting energy and put it into creating a product that looks and functions well despite the many restraints that you faced.