Shipwell
Shipping and Logistics Product
Role: Senior Product Designer
DEC 2019 - CURRENT
Being a Product Designer for Shipwell requires "full-stack" design chops working across multiple teams, each solving complex and unique shipping and logistics problems. This requires that all designs follow a process of research, creating user personas, wire-framing, creating the UI, live prototyping and animating the UI, documenting the expected user behavior and collaborating with developers. We work closely with frontend engineers, backend engineers and product managers to ensure that our designs are built to the correct specifications and with visual consistency.
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.
Pricing Intel
The Pricing Intel tool is the companies largest initiative in using state of the art machine learning and data science to show not only historical pricing information on lanes that our customers have run in the past but also expose future predictive pricing on lanes.
The predictive pricing is using algorithms to compile pricing from multiple sources to allow users to be as informed as possible on how much it should cost to book shipments wherever it needs to go.
Dock
Scheduling
A tool created to ensure that our users like dock workers, managers and carriers can schedule, plan and organize all of their docking needs. This complex workflow handles many different use cases that allow for scheduling, rescheduling, cancelling, and most importantly managing all of their busy schedules.
It was important to be able to surface and view multiple levels of data and dissiminate what shipments needed the most attention and make certain that their shipments flowed through the delivery process with ease.
Compass
The Compass Dashboard is an exception management tool that pinpoints shipping anomalies that arise throughout the day, and points the user in the right direction to mitigate those obstacles. Depending on the alert type that gets raised, there are differing solutions that get presented to the user to help remove or remedy those obstructions.
There are many types of personas that will use this dashboard and an obstacle for tackling this project was to make sure the solution was scalable for all types of users.
Workflows, wireframes and initial designs for Compass
The Compass dashboard shortcuts to the most pertinent workflows and information visible in one pane of glass so less context switching and digging for our users.
For the Compass dashboard to work properly and show the right information 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 thresholds for each alert to notify the user when issues arise on their shipments.
Shipments
The bread and butter of our product is our shipment dashboard and our shipment details pages.
The dashboard being one of the most important pages as it was the hub to manage and view all of their shipments at once and to be able to apply many differing filters to narrow down results and take action depending on the users persona.
The filtering for the shipment dashboard is robust in that the user can not only narrow down results to what they want to see, but also be able to reorder columns and also be able to save filters for ease of use later.
The secondary page that splits off from the main dashboard is viewing the shipment details. This page is the main source for all information pertaining to the shipment's life cycle and allows the user to accomplish a multitude of tasks. In the example screen shown here you can see the timeline designs showing the shipments changes throughout the process of creation to completion of a shipment. It is valuable for the user to be able to view multiple sources of data while navigating and viewing other sections of the shipment details page. By creating different sections that can be opened, closed, collapsed and moved around we were able to allow the user to move around with ease.
Shipwell Component Library
The Shipwell component library is something that as a designer I am incredibly passionate about. Without a consistent and well-curated component library a product can lack visual consistency and polish.
One of my first large initiative at Shipwell was auditing and improving the component library to be as organized, aligned and accessible to all users.
To have a successful component library, it needs to be designed as efficient and scalable as possible. Creating components at an atomic level ensures that they can be reused in lots of areas of the product and for multiple use cases.
