top of page
OTR.jpg

Case Study:
OTR Application

Timeline: Jan. 2023 - May 2023

Project Overview

This case study focuses on a project undertaken for the Over the Road (OTR) group, a team facing similar challenges to those encountered in the Drayage application project. The OTR group needed to integrate its operations into the system that was under development. Previously, they had been working with software, which the team managed reasonably well despite its lack of user-friendliness.

 

The group's primary requirement was a workflow similar to their existing one but with updated components compatible with the system. The users needed a system that allowed them to work efficiently and swiftly. One of the key challenges they faced was the manual input and creation of multiple shipments, a process they wanted to be more intuitive.

 

The overarching goal was to consolidate all their work into a single system. This consolidation aimed to enhance user efficiency and reduce operational costs for the business in the long run.

Screen Shot 2023-06-02 at 10.08.12 AM.png

Journey Map Workshop and Discovery

To gain a deeper understanding of the users' daily tasks, interactions, pain points, and areas for improvement, we conducted a journey mapping workshop with the OTR group. This workshop was designed to delve into the users' needs and desires throughout their workflow, from receiving shipment information to managing shipments and processing payments.

 

The workshop was conducted over two one-hour sessions. This interactive process allowed us to map the workflow and pinpoint the users' essential needs for the Minimum Viable Product (MVP) and future iterations.

 

This journey mapping workshop was a valuable tool for understanding the users' perspective and a platform for exploring potential solutions. It enabled us to make informed suggestions for the application's design, ensuring that the final product would align with the users' needs and enhance their overall experience.

wireframes.jpg

A significant portion of our efforts for this project was dedicated to wireframing. We faced the challenge of designing an intuitive, user-friendly application that would meet the users' expectations based on their experience with the previous software. This included displaying all necessary information on the screen without requiring scrolling, improving the flow for shipment pickups and stops, and introducing new features such as ad hoc shipments during a pickup.

Our team employed design thinking methodologies to navigate this complex task. We went through six rounds of wireframe iterations, each time refining the design based on feedback and insights from the previous round. This iterative process allowed us to continually improve the design, ensuring that it met the users' needs and expectations.

The wireframing phase culminated in a design that received final approval from the stakeholders, paving the way for us to commence the visual UI design work. This process underscored the value of iterative design and user feedback in creating a user-friendly and efficient product.

Wireframe Exploration

Screen Shot 2023-06-02 at 11.22.47 AM.png

Visual Design Exploration

Our team embarked on three rounds of visual design iterations before arriving at a solution that best suited the client's needs. While we maintained a semblance of the look and feel of the previously designed Drayage system, certain modifications were necessary to accommodate this new interface.

 

The client desired a cleaner, more modern aesthetic for this design, deviating from the gaming aesthetic of the Drayage system. Consequently, while many elements remained consistent, some underwent changes, particularly regarding sizing. This necessitated the creation of a new style guide and design system.

 

These visual design explorations allowed us to strike a balance between maintaining brand consistency and introducing a fresh, modern look tailored to the specific needs of the Over the Road Application. The iterative process ensured that the final design was visually appealing and aligned with the client's vision and user expectations.

Screen Shot 2023-06-02 at 11.33.37 AM.png

Creation of Style Guide and Design System

The specific requirements of the OTR application necessitated the development of a new style guide and design system. Unlike the Drayage system, the OTR application required elements to be more compact on a single page. These elements needed to be smaller and adaptable for mobile use while adhering to the Drayage system's style guide.

 

We collaborated closely with the engineering team to create a design system tailored specifically for the OTR application. We introduced smaller styles, incorporated new colors, and expanded the iconography. Despite these changes, we maintained the overall look and feel of the Drayage system.

 

We developed smaller versions of the same components and included this information in the style guide. We linked both style guides to ensure clarity between design and development, specifying which components were used for each system. This approach ensured consistency across platforms while accommodating the unique needs of the OTR application.

OTR.jpg

The Final Design

UX is research driven
and we can often
measure the value of
good design.

Key Takeaways

UX brings consultative value to projects, and sometimes that means pushing back on what we think we know and what the stakeholder thinks they know.

UX is research-driven, and we can often measure the value of good design.

Design is an iterative process to get to a finished product. We should never settle for our first design.

There will always be a push and pull between what schedules allow and the value we can provide. Don’t be afraid to push boundaries and show the art of the possible. In future projects, I’d like to see more testing with users and more understanding through journey mapping at the beginning of the project.

bottom of page