Timeline
2024 03-05
2024 03-05
2024 03-05
Role
Product Designer
Product Designer
Product Designer
Service
Web Design
User Experience Design
& Research
User Interface Design
Web Design
User Experience Design
& Research
User Interface Design
Web Design
User Experience Design
& Research
User Interface Design
Team
3 Designers (Me)
1 Developer
1 Product Manager
3 Designers (Me)
1 Developer
1 Product Manager
3 Designers (Me)
1 Developer
1 Product Manager
DrayEasy
DrayEasy
DrayEasy
Enable the freight forwarders to search for the best FTL/LTL rates and easily place order in DrayEasy web plaform.
View Site
View Site
View Site
Project Brief
The project goal was to transition the FTL & LTL route search and booking process from one-on-one email-based service to DrayEasy’s web platform.
At the time, both Full Truckload (FTL) and Less-than-Truckload (LTL) services relied on 1-on-1 email-based manual support for price inquiries and bookings. As the business scaled, this process became increasingly inefficient—staff were overwhelmed, and users reported frequent form errors, slow response times, low pricing transparency, and limited flexibility in quote requests.
What DrayEasy Does?
DrayEasy’s Services Include
DrayEasy’s Services Include
DrayEasy’s Services Include
Full-truckload (FTL)
Shipping where an entire truck is used exclusively for one shipment.
Shipping where an entire truck is used exclusively for one shipment.
Shipping where an entire truck is used exclusively for one shipment.
Less-than-truckload (LTL)
Shipping where multiple shipments share space on the same truck.
Shipping where multiple shipments share space on the same truck.
Shipping where multiple shipments share space on the same truck.
Drayage
Short-distance transport of goods, typically between ports, warehouses, or distribution centers.
Short-distance transport of goods, typically between ports, warehouses, or distribution centers.
Short-distance transport of goods, typically between ports, warehouses, or distribution centers.
Result – The First Month of Launch
Result – The First Month of Launch
67%
67%
67%
Increased Order Value
Increased Order Value
Increased Order Value
70%
70%
70%
Reducing in email orders
Reducing in email orders
Reducing in email orders
1.2K
1.2K
1.2K
Attracted New Users
Attracted New Users
Attracted New Users
User Research
& Pain Points
User Research & Pain Points
User Research
& Pain Points
In this project, we conducted unstructured interviews with 6 current clients and 4 potential clients to gain open-ended insights and understand their needs and pain points. The feedback highlighted four major issues and three key expectations:
Issues:
In this project, we conducted unstructured interviews with 6 current clients and 4 potential clients to gain open-ended insights and understand their needs and pain points. The feedback highlighted four major issues and three key expectations:
Issues:
In this project, we conducted unstructured interviews with 6 current clients and 4 potential clients to gain open-ended insights and understand their needs and pain points. The feedback highlighted four major issues and three key expectations:
Issues:
1.
1.
1.
Long timeline for inquiries and waiting for responses.
Long timeline for inquiries and waiting for responses.
Long timeline for inquiries and waiting for responses.
2.
2.
2.
Complicated booking process.
Complicated booking process.
Complicated booking process.
3.
3.
3.
Easy to make mistakes when filling information.
Easy to make mistakes when filling information.
Easy to make mistakes when filling information.
4.
4.
4.
Lack of transparency in freight pricing due to fluctuations, hidden fees, or unexpected charges.
Lack of transparency in freight pricing due to fluctuations, hidden fees, or unexpected charges.
Lack of transparency in freight pricing due to fluctuations, hidden fees, or unexpected charges.
Expectations:
Expectations:
Expectations:
1.
1.
1.
Transparent and comparable pricing.
Transparent and comparable pricing.
Transparent and comparable pricing.
2.
2.
2.
Simplified information input process.
Simplified information input process.
Simplified information input process.
3.
3.
3.
Clear control over booking status and payments.
Clear control over booking status and payments.
Clear control over booking status and payments.
These insights reveal the gap between existing product services and user expectations, guiding and supporting the focus of our design.
These insights reveal the gap between existing product services and user expectations, guiding and supporting the focus of our design.
These insights reveal the gap between existing product services and user expectations, guiding and supporting the focus of our design.
Current Product
Problem
Current Product Problem
We conducted an internal review of the existing Drayage module’s Searching and Booking design.
Searching:
Unclear hierarchy, poor readability, and low screen efficiency.
Booking:
The step-by-step order process makes it difficult for users to get an overview of all required information. They have to complete the current step before previewing what comes next.
However, in freight booking scenarios, users often need to collect complex shipping details before filling out the form — unlike filling out familiar personal information. Without a full view of the required fields, users are forced to constantly switch between different tools to gather the necessary information, which can be frustrating and slows down the workflow.
We conducted an internal review of the existing Drayage module’s Searching and Booking design.
Searching:
Unclear hierarchy, poor readability, and low screen efficiency.
Booking:
The step-by-step order process makes it difficult for users to get an overview of all required information. They have to complete the current step before previewing what comes next.
However, in freight booking scenarios, users often need to collect complex shipping details before filling out the form — unlike filling out familiar personal information. Without a full view of the required fields, users are forced to constantly switch between different tools to gather the necessary information, which can be frustrating and slows down the workflow.
We conducted an internal review of the existing Drayage module’s Searching and Booking design.
Searching:
Unclear hierarchy, poor readability, and low screen efficiency.
Booking:
The step-by-step order process makes it difficult for users to get an overview of all required information. They have to complete the current step before previewing what comes next.
However, in freight booking scenarios, users often need to collect complex shipping details before filling out the form — unlike filling out familiar personal information. Without a full view of the required fields, users are forced to constantly switch between different tools to gather the necessary information, which can be frustrating and slows down the workflow.
Competitive Analysis
Current Product Problem
Then, we analyzed five web platforms offering similar services to to gain insights and opportunities.
Identify the key issues need to be addressed in this update
Key Challenges to Address
Key Challenges to Address
Through user research, current product critique, and competitive analysis, we collaborated with the product manager to define four key design objectives for this project.
1.
1.
1.
Present complex information input modules for LTL services efficiently.
Present complex information input modules for LTL services efficiently.
Present complex information input modules for LTL services efficiently.
2.
2.
2.
Improve the order flow to enhance the sense of control and reduce drop-off rates.
Improve the order flow to enhance the sense of control and reduce drop-off rates.
Improve the order flow to enhance the sense of control and reduce drop-off rates.
3.
3.
3.
A well-structured and informative search result display.
A well-structured and informative search result display.
A well-structured and informative search result display.
4.
4.
4.
Provide clear guidance during the form-filling process reduces users’ cognitive load and error rate, as they no longer need to search or calculate on their own.
Provide clear guidance during the form-filling process reduces users’ cognitive load and error rate, as they no longer need to search or calculate on their own.
Provide clear guidance during the form-filling process reduces users’ cognitive load and error rate, as they no longer need to search or calculate on their own.
Brainstorming
Brainstorming
Brainstorming
During the brainstorming session, we rapidly gathered ideas—regardless of their feasibility or practicality.
We formulated...
How might we streamline the booking process?
How might we effectively display information to help users select the ideal quotes?
How might we help users find reliable trucks/carriers?
How might we increase the transparency of freight pricing? (fluctuation / additional / unexpected fees)
During the brainstorming session, we rapidly gathered ideas—regardless of their feasibility or practicality.
We formulated...
How might we streamline the booking process?
How might we effectively display information to help users select the ideal quotes?
How might we help users find reliable trucks/carriers?
How might we increase the transparency of freight pricing? (fluctuation / additional / unexpected fees)
During the brainstorming session, we rapidly gathered ideas—regardless of their feasibility or practicality.
We formulated...
How might we streamline the booking process?
How might we effectively display information to help users select the ideal quotes?
How might we help users find reliable trucks/carriers?
How might we increase the transparency of freight pricing? (fluctuation / additional / unexpected fees)
Design Solution
Design Solution
Design Solution
Optimize the less-than-truckload (LTL) search layout: Reassess the layout of the LTL search while ensure consistency
Revamp the input process: Change the step-by-step filling to a scrollable layout and reorganize the information modules
Highlight price details: Emphasize price details and insurance information, and allow users to double-check
Add assistance features: Add AI Auto-fill, Pallet Calculator, Item Book, and Address Book as support features
Optimize the less-than-truckload (LTL) search layout: Reassess the layout of the LTL search while ensure consistency
Revamp the input process: Change the step-by-step filling to a scrollable layout and reorganize the information modules
Highlight price details: Emphasize price details and insurance information, and allow users to double-check
Add assistance features: Add AI Auto-fill, Pallet Calculator, Item Book, and Address Book as support features
Optimize the less-than-truckload (LTL) search layout: Reassess the layout of the LTL search while ensure consistency
Revamp the input process: Change the step-by-step filling to a scrollable layout and reorganize the information modules
Highlight price details: Emphasize price details and insurance information, and allow users to double-check
Add assistance features: Add AI Auto-fill, Pallet Calculator, Item Book, and Address Book as support features
User Flow
User Flow
User Flow
To better address the issues, we started by focusing on the interaction and designed a new user flows for FTL and LTL functionalities.
To better address the issues, we started by focusing on the interaction and designed a new user flows for FTL and LTL functionalities.
To better address the issues, we started by focusing on the interaction and designed a new user flows for FTL and LTL functionalities.
Design Decision
Design Decision
Reevaluate the Layout of Search
Reevaluate the Layout of Search
Design Decision
Design Decision
Redesign Quote History Panel
Redesign Quote History Panel
Redesign Quote History Panel
User interviews revealed two key issues:
Low value of hot route recommendations
Most clients follow relatively fixed shipping routes on a regular basis, so dynamic “hot route” suggestions provide little added value.Insufficient location precision in history records
In typical user scenarios, it's common to ship within the same city but to different warehouses. Therefore, saving history only at the city level is insufficient to support efficient user selection.
Design Decision
Design Decision
Redesign Information Structure of Search Results
Redesign Information Structure of Search Results
Design Decision
Design Decision
Redesign Booking Process
Redesign Booking Process
Highlight Features
Highlight Features
Highlight Features
Instant quote comparison
Instant quote comparison
Instant quote comparison
Just enter pickup and delivery locations to get time-insensitive price and price fluctuations over a 2 week period
Just enter pickup and delivery locations to get time-insensitive price and price fluctuations over a 2 week period
Just enter pickup and delivery locations to get time-insensitive price and price fluctuations over a 2 week period
Order Information Auto-fill
Order Information Auto-fill
Order Information Auto-fill
This feature was designed to help traditional users (those used to booking via email and uninterested in online booking) transition smoothly to the web platform. Users can upload their previously completed form files, which are then auto-filled into the system.
This feature was designed to help traditional users (those used to booking via email and uninterested in online booking) transition smoothly to the web platform. Users can upload their previously completed form files, which are then auto-filled into the system.
This feature was designed to help traditional users (those used to booking via email and uninterested in online booking) transition smoothly to the web platform. Users can upload their previously completed form files, which are then auto-filled into the system.
Pallet Calculator
Pallet Calculator
Pallet Calculator
The Pallet Calculator helps users quickly estimate commodity information, offering a one-stop, efficient filling process that reduces errors
The Pallet Calculator helps users quickly estimate commodity information, offering a one-stop, efficient filling process that reduces errors
The Pallet Calculator helps users quickly estimate commodity information, offering a one-stop, efficient filling process that reduces errors
Item Book
Item Book
Item Book
Interviews revealed that most clients ship the same types of goods regularly. The Item Book feature helps reduce the hassle of re-entering the same item details each time.
Interviews revealed that most clients ship the same types of goods regularly. The Item Book feature helps reduce the hassle of re-entering the same item details each time.
Interviews revealed that most clients ship the same types of goods regularly. The Item Book feature helps reduce the hassle of re-entering the same item details each time.
LTL booking process
LTL booking process
LTL booking process
Simple and clear information entry steps
Simple and clear information entry steps
Simple and clear information entry steps
Order confirmation
Order confirmation
Order confirmation
Information review and acknowledgment
Information review and acknowledgment
Information review and acknowledgment
Next Steps
Next Steps
Next Steps
Continuously track post-launch data
Continuously collecting and analyzing user feedback to make ongoing improvements based on user experience and needs.
Continuously track post-launch data
Continuously collecting and analyzing user feedback to make ongoing improvements based on user experience and needs.
Continuously track post-launch data
Continuously collecting and analyzing user feedback to make ongoing improvements based on user experience and needs.
Takeaways
Takeaways
Takeaways
Faced with diverse demands, take a holistic approach to prioritize effectively
When receiving a large volume of diverse requests from stakeholders—including users, product, engineering, and business teams—it's critical to take a holistic approach. This involves evaluating each request for alignment with key objectives and feasibility under current constraints, enabling effective prioritization and distill the core design goals.
Faced with diverse demands, take a holistic approach to prioritize effectively
When receiving a large volume of diverse requests from stakeholders—including users, product, engineering, and business teams—it's critical to take a holistic approach. This involves evaluating each request for alignment with key objectives and feasibility under current constraints, enabling effective prioritization and distill the core design goals.
Faced with diverse demands, take a holistic approach to prioritize effectively
When receiving a large volume of diverse requests from stakeholders—including users, product, engineering, and business teams—it's critical to take a holistic approach. This involves evaluating each request for alignment with key objectives and feasibility under current constraints, enabling effective prioritization and distill the core design goals.
Professionalism and process-driven UX in B2B products
B2B platforms prioritize efficiency, scalability, and process integration. Compared to consumer-facing B2C platforms, they place greater emphasis on professionalism, stability, and system coordination.
Professionalism and process-driven UX in B2B products
B2B platforms prioritize efficiency, scalability, and process integration. Compared to consumer-facing B2C platforms, they place greater emphasis on professionalism, stability, and system coordination.
Professionalism and process-driven UX in B2B products
B2B platforms prioritize efficiency, scalability, and process integration. Compared to consumer-facing B2C platforms, they place greater emphasis on professionalism, stability, and system coordination.