top of page
Hero v2 just computer.png

Autonomous Vehicle Management

Project type

Desktop application

Industries

Construction & manufacturing

Years

2018 - current

Dealing in a nearly $1 trillion industry, our client had an incredible need for an autonomous system to deliver items to specific locations. With a dwindling labor force, the need for autonomous delivery options was extreme, and speed-to-market was a large driver.

We developed an application that helped employees manage the delivery routes of multiple vehicles in multiple locations at a time.

*Note: project details are confidential, thus only general aspects are being shown.

Mark avatar.png
M avatar.png
Mark Nader

Sole product designer

M Kusold

Lead developer

Mariana avatar.png
Mariana Araujo

Project manager

Multiple stakeholders icon.png
Dev team

7 developers

Multiple stakeholders icon.png
Client

Multiple stakeholders

Construction site issues

tight labor icon.png
Tight labor market

It’s difficult for construction crews to find and retain enough workers. Using autonomous vehicles would remove the need for a driver, potentially halving the number of employees needed.

accuracy icon.png
Reporting accuracy

Most logging is tracked by hand, so gaining insight into what supplies were delivered can be difficult. Workers sometimes embellish the amount of work they actually accomplish as well.

safety icon.png
Safety

Accidents involving heavy machinery can lead to disaster and injury, to both individuals and property.

Our goal.png

Our goal

Create an application that can manage a fleet of autonomous vehicles on a construction site.

The product had been pushed into the market as a prototype and built before the original designer was even done, so it had a lot of usability issues. I was brought in to work with our scrum team and refine the UX of the product (while it was being used by our customers).

Shorter flows, less clicks,
& cleaner code

We originally led users through a step-by-step process to create a mission. After gathering data from the field, however, we realized we overestimated the importance of some elements and underestimated our users’ competence.

We removed the step-by-step guide, deleted some code, and made more of less by only showing what users really cared about in a details panel that they could edit whenever they wanted. No more walking through an entire flow whenever they wanted to edit something.

The initial flow

Map on gray side.png
Step 1.png
Step 2.png
Step 3.png
Step 4.png
4 icon.png
2 icon.png
3 icon.png
Better flow.png
1 icon.png
Preview and confirm all route information
Create a new mission
Enter a name and description
Create a route and view the selection list to the left

Brainstorming a better design...

A better flow

A consolidated user flow more than halved the number of clicks and time taken by users to create missions.

improved flow 1.png
Improved flow 2.png
1 icon.png
Create a new mission
2 icon.png
Enter a name and description.
Create a route and view the selection list to the left.
Preview and confirm all route information (if needed).

Color has meaning

Too much of a good thing is a bad thing. In order for the color in the product to have meaning, we needed to streamline it. Because orange was used as a treatment on buttons and icons, it was difficult to call attention to error states.

We broke down where, how and why we would use color.

v1 icon.png
v2 purple icon.png
Old Colors 1.png
New Colors 1.png

Data organization

The vehicle management page is for the monitoring and diagnostics of vehicles in a fleet. The original design helped users visualize what they needed.

However, as our team gathered a deeper understanding of our users, we reorganized the layout into a table view. This buried a few secondary use cases, and helped users to scan and compare their data a lot easier.

Color table.png
v1 icon.png
Card View 2.png
+ icon.png
Quick access to all action items
- icon.png
Difficult to scan & compare
- icon.png
Not scalable
v2 purple icon.png
Table View 2.png
+ icon.png
Easy to scan & compare
+ icon.png
Filtering & sorting simplifies use with large data sets
+ icon.png
Buries secondary information behind a details button, easing cognitive overload

I wish I could show more...

Due to the confidential nature of this project, I’m limited with what I can display online. I’d be happy to show you more details, however. Feel free to reach out on LinkedIn.

bottom of page