The Shipowners’ Club’s P&I Online service
The portal worked.
But using it on-the-go wasn’t always easy.
We redesigned the experience based on how brokers work, rather than only reflecting the portal structure.
What we did
UX Strategy · Mobile Design · Accessibility Assessment · Design System
The Reality
The right information at the wrong time is not information.
Insurance brokers aren’t always sitting at desks on laptops. They’re travelling, attending conferences, meeting clients, or in high-stakes meetings. They work on the move.
Shipowners’ P&I Online had all of that information. The web portal was functional, technically stable, and complete, but having on-the-go access wasn’t available.
The challenge wasn’t what the system knew. It was how it communicated the information and data through flexible digital touchpoints.
The Shift
The temptation in a project like this is to take the desktop portal and fold it until it fits a phone. That’s not transformation; that’s digital origami. And origami is useless when you’re working in fast-paced environments.
So, we approached this as a product transformation, not a visual redesign.
So, we stopped looking for a compromise as well. We started building a framework.
Three principles guided every decision:
- Behavior before interface: we began by mapping what brokers actually do most often, not just what the system offers.
- Simplify without reducing capability: the information brokers needed was already there. Our job was to surface the right thing at the right moment, not to take anything away.
- Trust through clarity: in the insurance space, an interface that feels uncertain can create doubt. Every design decision had to communicate reliability before it communicated anything else.
Simplifying complexity without reducing capability is harder than building something new. It requires understanding of what actually matters, and the discipline to protect it.
The Build
Discovery & Workflow Analysis
Before any design, we mapped broker behaviors, identifying the actions that happened most often and the moments where the existing portal created friction. This gave us a clear prioritization framework: what to put in front, what to simplify, what to restructure.
Mobile Navigation Architecture
We restructured the experience around a clear navigation model with focused dashboards, simplified member views, and a streamlined document library. The information hierarchy was rebuilt around how brokers move through a working day, not around how the database was organized.
Accessibility as an Anchor
An accessibility assessment was conducted as part of the design process, not added at the end. Contrast ratios were refined, and the primary brand color was adjusted to meet modern accessibility standards. In an industry built on trust, an interface that works for everyone is not optional.
Impact
Brokers can now access policy information, vessel status, member details, and documentation from anywhere.
The web portal is still readily accessible for their desk days.
The platform didn’t change what it knew.
It changed when and how that knowledge became useful.
The Reality Check
The most important decision wasn’t a “design” one. It was a “navigation” one.
The accessibility assessment surfaced something we didn’t expect to be a significant issue: the primary brand color failed contrast requirements at the sizes used throughout the interface. Adjusting it meant a conversation with the client that went beyond design into brand governance territory.
That conversation happened early. Because we made it part of the process rather than a final delivery note, it was received as a recommendation rather than a problem. The color was adjusted. The brand held.
In regulated industries, “minor” details are the ones that cause shipwrecks. Accessibility isn’t a checklist; it’s a signal that you actually care.
If your platform works perfectly on a desktop but your users are never at a desk, we know that feeling. Let's talk.
