Portolan. Skyscanner for container freight.
A web and iPhone app for importers. Compare every shipping line’s full price to your door, book from one invoice, and know when your container lands. We designed the brand, the product, its design system and the site.
- ClientPortolan (concept)
- We madeBrand · Product · System · Web + iOS · Site
- PlanOne Oneband subscription
Who it’s for
Import teams at mid-size retailers. Our persona, Sara, books a few containers a month for a home store in Jeddah.
The big idea
Compare freight the way you compare flights: every shipping line, the full price, on one screen.
What we made
A logo and brand, a design system, 22 screens for web and iPhone in light and dark, and a marketing site.
Shipping a container still means emailing four freight agents, waiting two days for quotes in four formats, and finding out the real price when the invoice arrives.
From a 15-minute call to a board in one day.
- 1A 15-minute call
The founder explains the idea. We check it’s a fit before anyone pays.
- 2Starter · $250
A review of their quote flow plus one quick fix, in 3 business days. Credited to the first month.
- 3Subscribe
One plan, from $999 a month. One active request at a time. Pause any time.
- 4The board
A Trello board on day one. Something real lands every 2 business days.
Two teams, one board.
No account managers and no hand-offs. The person you talk to is the person who designs.
Everything on one board.
Portolan adds requests to the backlog. We take one at a time, post updates on the card, and move it to Approved when they say yes. Swipe the board to see every column.
Start here 3
Backlog 4
Current 1
One request at a time, so each one gets full attention.
Approved 13
Two-tone icons and flat drawingsRound 5
A darker dark modeRound 4
New logo from the founder’s markRound 3Five notes from the founder, five changes.
We played the client on this concept. These are the real notes from each round, and what we changed.
- 1
“The Manifest look is good. The colour is not.”
We tried five palettes on the same real screen. Signal Blue won.
- 2
“It feels like one long series. Add illustrations and icons to break it.”
We drew 48 icons and 8 drawings, and added full-colour bands between sections.
- 3
“I love this logo I made. Make it Portolan.”
The biggest turn. We redrew the founder’s mark as clean vectors, set the name in Alliance No.2, and made a new moodboard with three colour directions. Harbour Green won, and the whole product was reskinned.
- 4
“Dark mode must feel darker, so it’s easy on the eyes.”
A near-black green canvas, softer text, and lime only on the main action.
- 5
“The style has changed, so change the icons and artwork too.”
Rounded two-tone icons and flat drawings with lime tops, to match the soft arrows of the mark.
Four arrows, one box.
Every shipping line’s price points at your container, on one screen. Deep harbour green for trust, one lime signal for the next step.
Top: our first logo, and the new one built on the founder’s mark. Bottom: app icon, dark version, and the mark on lime.
Colour, one typeface in three weights, two-tone icons, and the arrow pattern.
Four ideas for importers.
The cheapest week, at a glance.
Each column is a week, with its cheapest full price. Here, shipping one week later saves $380.
Look at the green week: $2,840, the cheapest of the six.
The price is the price.
Shipping, extra charges, port fees, customs and the truck to your door add up to one number, with every line open.
Left: five cost lines that add up to $2,840. Right: how often this ship arrived on time.
Book with one file.
Drop in your invoice and Portolan fills in the booking. It asks only about the one customs code it isn’t sure of.
Left: the invoice, with each value it read boxed. Right: the booking, filled in. The orange row is the only question left.
Know when it lands.
A date range with a confidence level, a countdown of free days at the port, and a fix with every alert.
Shipments in dark mode, with today’s to-dos on iPhone.
The ship is two days late, so the truck is booked for the wrong day. The fix is one tap.
In your pocket, and on the web.
Left to right: today’s to-dos, a live shipment, approving a quote with Face ID, and scanning a document.
The marketing site sells the same four ideas: search, compare, book, know.
Money and hours, per year.
- Half your shipments can move a week: $380 saved each (the demo route)
- One in four would sit 2 extra days at port: $370 in storage avoided
- About 3 hours of quote emails saved per shipment
Our estimate from the demo numbers, not a result. Change the slider to match your volume.
- Searches that become bookingsAnd how many of those came through the price calendar.
- Invoices that match the quoteShare of invoices with no surprise lines. This should get close to 100%.
- “Where’s my container?” messagesSupport questions per shipment. Honest arrival dates should push this down.
This is a concept, so there are no results yet. These are the numbers we’d track from week one.
Recapo. The launch film.
A 45-second launch film for an AI sales tool. Watch it →
Want this for your product?
One senior designer for your brand, product and site. From $999 a month, pause any time.