InLog Logistics Solutions Website Redesign
In-Log Logistics Solutions, established in 2002, is a 3PL company committed to crafting international logistics solutions, with a focus on ground transportation within the USMCA region. Recently, the company embarked on a comprehensive website redesign initiative, encompassing UI elements, color palette, and overall layout. Additionally, they aim to infuse AI into the website/user experience, aiming to enhance operational efficiency, cut costs, and deliver improved services to their customers.
If you want to see the prototype, please click the button below to access the Figma file.
Project Overview
Team
3 UX Designer
2 UI Designer
1 lead Product Designer
My Role
UX Researcher
UI Designer
Duration
Discovery & Research: 2 week
Design & testing: 2 week
Tools
Miro
Figma
Trello
Google suites
Zoom
InVision
My Contribution
User Research
Market Research
Persona Development
Wireframing
Prototyping
User Testing
Iterative Design
Problem
Finding a reliable logistics partner is a common challenge in the industry.
Users dealing with multiple clients and shipping companies face communication issues.
The absence of 24/7 customer support has consistently posed a significant challenge for users.
How might we streamline the logistics process by securing reliable partners, enhancing communication channels among various clients and shippers, and providing round-the-clock customer support to tackle industry-wide challenges?
Solution
By redesigning the website, we aim to enhance the user experience and drive KPIs such as higher conversion rates, improved customer retention, and stronger brand positioning to set InLog Logistics Solutions apart from competitors and attract more customers.
Enhance Partner Matching Algorithm:
Develop an intelligent logistics partner matching algorithm that assesses reliability, performance, and user reviews to simplify the process of finding a trustworthy partner.Integrated Communication Platform:
Implement a unified communication platform within the logistics system, fostering seamless interaction among users, clients, and shipping companies to address communication challenges effectively.
24/7 Customer Support Integration:
Integrate a robust 24/7 customer support system, incorporating live chat and AI-driven assistance, to provide users with immediate solutions and support whenever needed.
Please check out the live website: https://in-log.net/
Using the double diamond approach for project development
We used the double diamond approach based on Design Thinking. We didn't follow a straight path and switched between stages as the project moved forward.
User interviews could bring us closer to finding the solution
We conducted user research to identify challenges on logistics websites and address users' pain points. To achieve this, we interviewed 10 logistics experts to understand stakeholders' concerns, including:
Improving communication.
Streamlining information management.
Reducing user expenses and resources.
Shortening the time users spend on tasks.
This helped us identify objectives such as:
Making shipping processes easier and more efficient for businesses and customers.
Motivating users to visit and use the website more often.
Leveraging AI to enhance and simplify the user experience on a logistics website.
How can data from user interviews help us understand users' pain points and preferences?
I utilized the affinity diagram method post-interviews to systematically organize and categorize user insights. This visual representation helped me in synthesizing user challenges, prioritizing key issues, and refining user personas for enhanced understanding and targeted solutions.
Using open communication to make an 'I Like, I Wish, What If' diagram and refine the final product with helpful feedback
I gathered a group of people with project insights for an 'I Like, I Wish, What If' session. After explaining the purpose and the three categories, I asked participants to share their thoughts. I recorded their feedback on sticky notes and organized similar responses to find common themes. We grouped and prioritized the feedback, discussed the key points, and decided which to act on.
What's our next step?
We used the input to create a 'Feature Prioritization Matrix,' which guided our meetings with stakeholders. It facilitated focused discussions on priorities and served as a visual aid to align the team on the most crucial features.
Who is the user of the InLog Logistics Solutions website?
We created a persona after gaining insights from user research and developing a clear picture of who our target user would be. A user persona will assist us in making better design decisions that will meet the needs of the user in our process
Combining user personas with user journey maps, to a more empathetic, user-focused design approach
I mapped out the user journey to streamline their path toward achieving key goals with the product. This process helped us identify user frustrations and opportunities to address their pain points, as well as understand how they interact with and perceive the service.
How do users think the website should be organized?
I conducted a card sorting exercise where participants organized items into groups. This revealed patterns in users' thought processes and preferences, helping me design a more intuitive information architecture for the website.
How the structure and organization of the website have been redesigned?
I began creating the sitemap by first understanding the users' goals and needs. I analyzed the existing site to identify areas for improvement and streamlined the navigation structure. I then organized content logically and grouped related pages together, ensuring a smooth, intuitive flow for users. By visualizing the entire website structure, I was able to spot redundancies and gaps, ultimately creating a clear, user-friendly map that guided the redesign process.
We created user flows to streamline tasks and remove unnecessary steps, improving the design process. By mapping out flows for reviewing services, requesting quotes, and accessing customer support, we stayed organized and clear about our approach
Task 1: Review Services
James recently has received a high priority project from this company. They want him to review new logistics companies to partner with in order to streamline their logistics side by reducing their overall costs. He comes across the website while searching and reviews their services.
Task 2: Request a Quote
James has been tasked with a challenge at work. His goal requires to find an affordable price to ship cargo as soon as possible. He decides to head back over to the website to see if he is able to request a quote.
Task 3: Get Customer Support
James has ran into an issue. His shipping tracking numbers are sending him to the already delivered cargo. It is critical to his project to able to monitor his shipments arrival time. He visits the website in order to contact their customer support.
Streamlined the design process for better outcomes by crafting user flow
Interview Takeaways
High Fidelity Design & Iteration
Mid-Fi Wireframe
We began by creating mid-fi wireframes based on our research. This allowed us to conduct initial usability tests and gather user feedback. With that input, we will design high-fidelity wireframes.
Improving Design: The original website was outdated and needed a redesign for better navigation and customer attraction.
Utilizing AI Technology: InLog focuses on automating processes to reduce logistical workload.
Integrating Services: Initially, InLog's services were fragmented across different platforms. The redesign aims to seamlessly integrate these services for optimized logistics.
Integrating service features now allows users to choose their desired platform when logging in. Before, users couldn't easily find other platforms on the InLog website. Now, it's simple to locate and access all services.
We present InLog service details in clickable cards for easy learning. The navigation bar also includes options for two other services.
A notable addition to the InLog Logistics Solutions' redesigned website is the incorporation of an AI chatbot. This feature is designed to assist users with any questions or concerns they may have regarding InLog's services.
We kept the testimonials section from the previous version of the website as stakeholders wanted them on the homepage. They boost user trust and engagement, leading to more conversions.
Initial usability test to address low-fi wireframe design issues
TASK 1: Review available services
“I found InLog services in the navigation bar but struggled to return home by clicking the logo.”
TASK 3: Locate customer support
“Initially, I assumed it was the message icon and clicked on it, later noticed the ‘Support’ link in the navigation bar.”
Footer includes contact info, company details, and links to key pages like About Us and Services for easy navigation. This helps users access important info, navigate better, and trust the company.
Each platform has its own custom login page that can be accessed from the InLog website.
We organized the data needed for requesting a quote into contact and quote information categories. This helps users by automating processes, reducing logistical workload, and speeding up the process.
TASK 2: Request a quote
“I clicked ‘Request a Quote’ in the navigation bar, and liked the clear questions in the form.”
TASK 4: Log in to your preferred service provider
“I successfully completed the task, exploring both login pages and noticing differences between the platforms.”
Hi-Fi Wireframe
After conducting usability tests and identifying areas for improvement, we designed high-fidelity wireframes.
Taking into account the results of the usability tests, our final iteration will involve:
Adjusted "customer support" in navigation bar
Modified style on "Request a Quote" CTA button
Added a confirmation message on quote page
Redesigned quote page for increased lead capture and to reduce form fields
Check out the Figma file to see the complete design.
The InLog homepage is where users land when they search for InLog. They can access all services, request a quote, and schedule a personalized demo, a new addition in this iteration.
InLog provides a demo to help users confidently choose the services they need. We included it in the final iteration.
After clicking on Log in button, users can choose their preferred platform to log in with.
This 'About Us' page provides information on InLog's services, mission, and values.
Requesting a quote enhances user experience by offering clarity, aiding planning, and building trust in InLog's services. We refined the form in the final iteration by adding more fields to better understand user needs and respond more effectively to requests.
We used each platform's color palette and design system for a consistent experience, allowing users to recognize the differences.
Each integrated service has its own pages providing details and login options for users. We used their color palettes and design systems to match their websites, so users can easily identify them as distinct services beyond InLog.
Usability Test (phase 2)
Usability test phase 2 showed users prefer clear page layouts. They easily navigated InLog's services, requested quotes, and accessed platforms. One user had trouble finding customer support, but others completed tasks well. This suggests phase 1 was helpful and may speed up final product delivery to stakeholders.
What could be next step?
Throughout our redesign process some great ideas came to my mind for future iterations.
First, to develop a mobile application so users can have quick and easy access to visualize and manage their supply chain on the go.
Second, to develop the platform for InLog's new service for managing finances called Trade Management.
Third, redesign InLog's dashboard which is visible to users when they Login, where they can visualize their information and keep track of their logistics.
Thank you for reading my case study!
Interested in collaborating? Don't hesitate to reach out!