Improve the freight order management experience
Simplifying order management in freight transportation for a clearer and faster experience
TransFleet is a freight transportation platform that helps freight forwarders move cargo containers to destination with local trucking services. I joined the team to lead the redesign of the order management features. Our goal was to make the experience more user-centric and help users get their work done more efficiently.
Problem
The platform suffered from disorganized information and limited shipment visibility, hard for users to locate key details and get useful insights, resulting in high customer support inquiries and inefficient workflows.
Outcome
I restructured the information architecture and redesigned the interface, delivering high-fidelity mockups that were shipped and led to 28% reduction in support inquiries.
B2B SaaS
TMS
Information architecture
role
Product designer
Team
1 senior designer, 1 product manager, 1 engineer lead
Timeline & Status
3 months, 2023
Problem overview
The disorganized interface slowed down the efficiency
When the project started, the order management experience was difficult. Many customers still relied on customer support to track their freight shipments, and the online interface was hard to use. Through reviewing the interface & our user research, we found the following issues:
  • x   Cluttered layout overwhelmed users with too much data.
  • x   Key details were hidden deeply lead to inefficient workflow.
  • x   Limited shipment visibility was unable to offer useful insights.
Our users
Freight forwarders
Our target customers are freight forwarders—logistics professionals who act as intermediaries between shippers and transportation services. They oversee container movements and handle necessary documents to ensure successful cargo deliveries.
Jump to final Design
Goal
Make order management clearer and faster
01
Reduce time to locate info
Make it easier to find specific information so that users can work faster
02
Reduce support inquiries
Allow users to work independently within the platform
03
Enhance user satisfaction
Ensure users find the new design helpful and willing to use
04
Improve operational efficiency
Help business save money and time on order processing & tracking
Design kick-off
Make something tangible
Soon after reviewing the interface, we started mapping the user journey to build initiate understanding and began sketching different layouts and features. However, some of them got pushback for "not feeling quite right", and new requirements kept coming up. So, we decided to pause and go back to learn the problem and the people we designed for.
Research
process & methods
We conducted research in different ways to understand the problem and the user group. It helped us gain deeper insights to answer the below questions.
01
Competitor Analysis
I analyzed 6 competitors—Flexport, Cargomatic, NTG, Dray Alliance, Uber Freight, TQL—to learn what they were doing well, what the current app was lacking, and common patterns and best practices for products in this domain.
02
Stakeholder Interviews
We interviewed product managers and customer support teams who have deep domain knowledge and customer insights to better understand the product, our users, and the challenges they had.
03
Focus Group Customer Interiview
We interviewed 5 existing customers who oversee containers on a daily base to understand their workflow, tasks, priorities, and identify any unmet needs.
01
User tasks vary by shipment stage
Freight transportation involves multiple key stages—dispatch, arrival, shipping, delivery, and return—where users have different tasks to handle and information they need along the way.
02
Users track shipment to stay on top of things
Users usually track their containers' status to know its location and key dates, so they can take the right actions on time.
03
Users want quick access of information
Although data priorities shift depending on the scenario, users always want to see the information they need at a glance.
04
Orders and containers are interconnected in user workflow
Users need to manage both orders and containers: orders focus on transactional updates in the system, while containers track the movement of cargos.
Results
results & insights
Synthesizing all the findings uncovered qualitative insights of user behaviors and goals in freight operation. This helped us narrow down to the key challenges and inform design decisions later on.
Reframe the problem
Managing orders and containers is a fragmented, disconnected experience for freight forwarders. How might we provide better shipment insights and ensure users can easily access the information they need?
Information challenge
Information wasn’t optimized
Key data was either missing or buried in deeper layers, making it harder to access and use efficiently.
Visual challenge
Cluttered & disorganized
The interface lacked hierarchy, making it overwhelming and difficult for users to find information quickly.
Feature challenge
Lack of shipment visibility
Customers rely on shipment status to take timely actions, but limited visibility forces them to track through customer support.
Design goal
Relevant information
Prioritize key data & features and make them easier to find and use.
Design goal
Clean interface
Group information, declutter the interface, and introduce visual hierarchy.
Design goal
Clear visibility
Make shipment clearer and easier to understand.
Restructure information architecture
In the current interface, many information was crammed onto one page, but the data users saw first weren't the ones they prioritized most.
I started by listing all the data and tasks along the shipment journey based on insights from customers and stakeholders—to see how different pieces connect and find a better way to organize them.
To make data display more relevant, I organized and prioritized key shipping data by shipment stages, ensuring it accommodate user workflow and help them quickly locate the data they need.
To improve sitemap clarity, I separated container data into its own details pages instead of mixing it with order data. This distinguishes the two concepts and brings clarity in navigation.
Layout exploration
& iteration
Provide a dedicated space for managing containers
Our early idea was to keep orders and containers together to preserve their relationship. However, interviews showed that customers mostly track and manage by containers. To better support this, I separated the container listing into its own page, making it easier to view and focus on container-specific data.
Adopt table layout to match user habits
I sketched card layout for the listing page in early exploration, but later realized it couldn’t accommodate all the key data and support quick scanning. Talking to customer support team made me realize that customers are more familiar with spreadsheet-style layouts and often need to monitor lots of containers, so I switched to table layout to better align with user habits and mental modal.
Bring clearer shipment insights
To provide the level of visibility that users need, I used progress bars and timeline for shipment and order activity tracking, helping users see updates and critical milestones. With lots of iteration, I tried to keep the design simple—to help users focus on the information.
Introduce status pills
I designed status pills to help users understand their order and container status without needing to visit the details page. With clear visual cues, users can easily scan and grasp the status at a glance. I reviewed the pills with the PM to ensure it aligned with our product flows.
Declutter the interface
With insights from customers and stakeholders, I organized content by frequency of information needs and progressively disclosed them—to reduce overload and distraction, helping users focus on what matters most.
Visual hierarchy
I focused on highlighting important data, minimizing less important details, grouping similar content, and adjusting whitespace—to make the information clearer and the interface more intuitive.
Final design
Revamp for a user-centric, efficient experience
We introduced order listings and details page to help users see their order information. I iterated these pages to make sure freight forwarders can easily find key data, track shipments, and handle tasks like manage documents and pay invoices, with more efficiency and independency.
Order listing offers the overview of trucking orders to users
Review physical info, identifiers, and shipment status of containers within the same order
Enable users to see container information and rate in one place
Help users quickly find specific containers with sorting and tailored filters
Visible shipment updates
Bring transparency, build trust
The platform now has better tracking experience. We offer clear shipment visibility and messaging to help users see updates and critical milestones—to reduce their confusion and ultimately bring transparency to the shipment journey.
1. Two-level progress tracker enables users to stay informed about both the container movement and order updates
2. Error message helps users understand what went wrong and take actions quickly
We prioritized key data based on user research and tailored them to users' workflow. Using visual elements and table layout, I made the information easy to scan, helping users find the information they need quickly.
Shipment status shows the current state, while key data provides the necessary details users need
Impacts & results
28% reduction in customer support inquiries
The solution gained strong buy-in from key stakeholders and was shipped. Three months post-launch, follow-up data showed users embraced the new design, reducing customer support inquiries by 28%—significantly improving operational efficiency and reducing costs for both the business and the customers.
Retrospective
01
Learn the domain to design better product
Transportation management is a domain I wasn’t familiar with. To build better understanding, I researched similar competitors, talked to stakeholders, learned about the problems, and self-studied by reading a lot of articles. The more I learned, the better I understood why users needed certain features and how the platform play roles in their workflow, which helped me make better design decisions.
02
Don't rush into design
We kicked off brainstorming early, ideating around how the interface should look like. While I quite enjoyed this step, it got kind of rough. Without data to back them up, we got stuck debating what would actually work. Taking the time to research gave me a complete understanding of the context and indeed help me design better ideas. A little research upfront goes a long way.
Back to top
•
Work
•
About
Thanks for stopping by ☻
©2025 Xin Chen.
xchen.rachel@gmail.com