Shipwell
Shipping and Logistics Product
Role: Product Designer
DEC 2019 - CURRENT
As a Product Designer at Shipwell, I leverage my design expertise to collaborate across multiple teams, each addressing complex challenges in shipping and logistics. My approach includes thorough research, developing user flows and personas, wireframing, producing user interfaces, live prototypes, and meticulously documenting expected user behaviors. I work closely with frontend and backend engineers, as well as product managers, and leadership to ensure that our designs are not only implemented to precise specifications but also maintain visual consistency throughout.
Native iOS and Android Shipwell Application
The Shipwell App for mobile users of the product. The design initiative was to create a unique native experience for our mobile users, especially drivers who would need new functionality and experiences while on the go.
There was a full design refresh of our design elements and styling ensuring that the mobile product was in-line with our web product.
The examples shown here are showing a few examples of our Dock Scheduling, adding and adjusting financials onto a shipment, and also full workflows and how they connect with all the parts of the app.
Documentation is also key for ensuring our designs are developed exactly to our specifications.
Dock
Scheduling
The Dock Scheduling tool was developed to empower users– dock workers, managers, and carriers, to efficiently schedule, plan, and organize all docking operations. Designed to handle a variety of complex workflows, it supports tasks such as scheduling, rescheduling, canceling, and managing busy schedules.
A critical aspect of the tool is its ability to surface and display multiple layers of data, enabling users to prioritize shipments that require the most attention and ensure a smooth delivery process.
Compass
Workflows, wireframes and initial designs for Compass
The Compass Dashboard serves as an advanced exception management tool designed to identify and address shipping anomalies in real time, guiding users toward effective mitigation strategies. Depending on the specific alert raised, the system presents tailored solutions to help users resolve or remedy the issues encountered.
Given the diverse range of user personas interacting with this dashboard, a key challenge in developing this solution was ensuring its scalability and effectiveness across all user types.
For the Compass dashboard to operate and display the right thresholds for each company using it we needed a solution to allow companies to configure their own alerts.
This page houses all the alert types and allows the user to manipulate the settings for each alert to notify the user when issues arise on their shipments.
The mobile design of the Compass Dashboard was crafted with mobile-first principles, the tool is optimized for quick, intuitive interactions, enabling users to identify and address issues with minimal taps and gestures. Alerts are designed to be immediately actionable, presenting tailored solutions that guide users through resolving or mitigating problems directly from their mobile devices.
Given the diverse range of Compass alert types, the design process emphasized scalability and consistency, ensuring that the interface adapts to different usage contexts. Key mobile design principles such as touch-friendly controls, simplified navigation, and clear visual hierarchies were critical in creating a responsive and efficient user experience for all types of users.
Shipments
The shipment dashboard and shipment details pages are the cornerstone of our product. The dashboard serves as a central hub, allowing users to manage and view all shipments simultaneously, with the flexibility to apply various filters and take action according to their specific roles.
The dashboard's advanced filtering capabilities enable users to precisely narrow down results, reorder columns, and save custom filters for streamlined use in future sessions.
Shipment Details Page
Objective: Redesign the Shipment Details Page to improve usability, flexibility, and data accessibility, addressing user frustrations with the previous version.
1. Complete Overhaul of UI/UX:
-
Redesigned the outdated and cumbersome interface to enhance user experience and align with modern design standards.
-
Streamlined the layout to make critical information more accessible and easier to manage.
2. Flexibility Based on Shipment Type and Customer:
-
Introduced dynamic content that adapts based on the type of shipment and customer requirements.
-
Customizable fields and sections that adjust to different use cases, providing a tailored experience for diverse user needs.
3. Scroll Spy Navigation:
-
Integrated a scroll spy feature to improve page navigation, allowing users to quickly locate specific sections within the page.
-
Ensures users can easily track their progress and remain oriented, even on data-heavy pages.
4. Enhanced Data Visibility and Tracking:
-
Added more comprehensive data displays, giving users a clearer and more detailed view of shipment information.
-
Improved tracking features to offer real-time updates and more accurate shipment monitoring.
5. Reduction of Cognitive Load:
-
Implemented conditional visibility of fields, hiding non-essential items to focus users' attention on required actions.
-
Clear visual cues for mandatory fields to streamline the completion process and reduce user errors.
Outcome:
The redesigned Shipment Details Page significantly enhances user satisfaction by offering a more intuitive, flexible, and efficient tool for managing complex shipments.
Pricing Intel
The Pricing Intel tool represents the company's most ambitious initiative to date, leveraging cutting-edge machine learning and data science to provide comprehensive pricing insights. This tool not only displays historical pricing data for lanes previously utilized by our customers but also introduces predictive pricing capabilities for future shipments.
The predictive pricing feature employs sophisticated algorithms that aggregate data from multiple sources, enabling users to make well-informed decisions about the expected costs of booking shipments across various routes. By offering both retrospective and forward-looking pricing intelligence, the Pricing Intel tool empowers our customers to optimize their shipping strategies with greater accuracy and confidence.
Shipwell Component Library
The Shipwell component library is a key focus of my design efforts, reflecting my dedication to achieving visual consistency and product refinement. A well-organized and curated component library is essential for delivering a polished and cohesive user experience.
One of my initial major initiatives at Shipwell involved auditing and enhancing the component library to ensure it was well-structured, aligned with design standards, and accessible to all team members. This included incorporating accessibility considerations to ensure components are usable by a diverse range of users.
In addition to managing the component library, I also lead the UI Guild, a dedicated team of designers and developers focused on updating and creating new components. This role involves coordinating efforts to ensure that the library evolves with the product’s needs while maintaining efficiency, scalability, and adherence to best practices. By developing components at an atomic level, we ensure their versatility and reuse across various areas of the product, supporting diverse use cases and fostering a streamlined design process.
