design system & dashboard
Design system and foundational dashboard for a global fulfilment platform.
Portless helps DTC brands ship inventory worldwide from a single warehouse. I designed the system and built out their core dashboard experience, giving clients real-time visibility into orders, stock levels, and shipments.
- Lead Product Designer
- Design System, UI & Interaction Design
- Dashboard, Orders, Inventory, Products
- Figma, React, Component library
Tracking number
SPX037739199373
Estimated delivery
Fri 4 Oct, 2024
Latest
Order received
Carrier has received the request from the shipper and is about to pick up the shipment.
Order received
Tue 1 Oct, 6:47am
Carrier has received the request from the shipper and is about to pick up the shipment.
In transit
Toronto, CANADA · Wed 2 Oct, 5:47pm
DHL
Carrier has picked up the shipment. The shipment is on the way.
Out for delivery
New York (US), UNITED STATES · Thu 3 Oct, 1:22am
FedEx
Carrier is about to deliver the shipment, or it is ready for pickup.
Delivered
New York (US), UNITED STATES · Fri 4 Oct, 3:29pm
FedEx
The shipment was delivered successfully.
Customer info
Jayvion Simon
nannie.abernathy70@yahoo.com
IP Address: 192.168.1.1
Delivery
Shipping
Payment
Shipment update
SPX037739199373
Overview
A foundational system for global fulfilment.
Portless helps DTC brands ship inventory worldwide from a single warehouse, real-time visibility into orders, stock, and shipments. The dashboard is where that visibility lives, so it had to be dense, legible, and fast.
The system, in parts
Foundations first, then everything on top.
Color, type, and spacing tokens set the language, then buttons, badges, tables, and charts inherit it for free. One vocabulary across eight dashboard views.
Color
Typography
Spacing
Text
Shadow
Color
Elevation
Components
Foundations, applied
The same tokens, composed into the dashboard.
Stat tiles, charts, tables, and banners: each one just the color, type, and spacing tokens assembled a different way. This is the surface clients actually shipped on.
Yearly sales
(+43%) than last year
$16.19k
$35.71k
Sales overview
The system
Color, type, spacing, icons, down to the data tables.
I designed and built the foundational design system from scratch: color, typography, spacing, icons, status badges, data tables, and chart components, powering eight core views with one vocabulary.
Same system, a different surface
From analytics to product & order management.
Forms, selects, chips, toggles, and detail panels: the same tokens and components, now doing the day-to-day work of creating products and managing orders.
Properties
Additional functions and attributes…
Set 0 if out of stock
Gender
Latest
Delivered
The shipment was delivered successfully.
Thu 3 Oct, 10:34am
DHL
Pricing
Price related inputs
Customer info
Jayvion Simon
nannie.abernathy70@yahoo.com
Delivery
Shipping
Payment
The screens
Dashboard & Core Views
Dashboard
The main overview giving clients instant visibility into out-of-stock SKUs, country distribution, shipment trends, and top-selling products.
Orders
Filterable order management with status tabs (Pending, In Fulfilment, Fulfilled, Cancelled, Error), search, and paginated data tables.
Products & Inventory
Product catalogue with stock-level indicators (In Stock, Low Stock, Out of Stock, Unavailable), product detail with warehouse locations and adjustment history, and bundled product management.
Settings
Platform configuration for user management, e-commerce integrations (Shopify, BigCommerce, WooCommerce, Squarespace), and warehouse location tracking with bonded/FTZ/3PL tags.