Integrating old UI software into a modern SaaS email solution that allows customers in the maritime industry to understand the details of cargo history in one glimpse.
My role and Impact
My Role
UX Researcher, UX & UI Designer, Product Designer
Time
Saving 1h every day by removing the need to download or upload documents
Money
Increase in ARR (Annual Recurring Revenue)
How did I measure the UX?
Mixpanel
Track user actions against segmented user base
Zoom
Collect qualitative feedback speaking directly with users
Overview
Context
Picture this... You work in the shipping industry and receive thousands of emails every day, but you really need to focus only on dozens of messages. Sedna will cut through the email noise with its powerful search function.
Problem
Great, but I work with other software too... You are now stuck in a time-consuming manual process of cross referencing, copying and downloading data from your email into CargoWise.
Solution
What if there was a way to do this in a few clicks without leaving your email? You can now grasp the shipment data directly from your email and push it to CargoWise without downloading, uploading, copying and pastying data.
This saved users 1 hour of their daily work and generated more revenue by allowing them to focus on more business opportunities.
How do people Use CargoWise?
Product Requirement Document
Team brainstorming...
By setting up meetings with the Product Manager on the project, I was able to start building a skeleton of PRD and map out user flows.
Understanding the integration
Analysing patterns...
Studying CargoWise patterns that can be reused for a seamless user experience within email.
Research Insights
Main user needs extracted from research:
Display data (i.e. Departure, Loading, etc)
View info for multiple shipments at once
Update shipment milestones from email
Upload attachments from email to CargoWise
Bringing Ideas to the Team!
Engineering risks
FtontEnd
Edge case scenarios (truncation, system errors, breakpoint considerations)
BackEnd
Mapping possible interaction problems with endopoint failure
Edge cases
Considering Data Points structure, format and maximum width due to horizontal space limitations and truncation scenarios.
Shipment
Dates
Milestones
Mapping the Information Architecture for the integration
Scan Cards to summarise shipments - Interactions and Variants
Panel mocks to view and manage details and documents
Going the extra mile - Reply mode!
Considering the low development effort, we introduced a Reply Mode, which allows users to quickly add the shipment information by clicking one button.
Checking with Developers - Bugs
As new design iterations were being discussed for the next phase, the engineers, product manager and I reviewed the build progress by inspecting the code in Testing Environments. I tried to break the feature and spotted functional and visual bugs that were resolved along the way.
Middle Ground with PM and Devs
A crucial need for users was to upload message attachments into CargoWise directly from Sedna. After some exploration and discussion with developers, the design shifted to a single upload.
The middle ground to provide good UX was:
Provide feedback once attachment is added by changing button state
Complete the selection once the "Done" or "X" button is clicked
Shipped! How is it being used? Let the Mixpanel data speak!
Highlights from Mixpanel events:
200 documents uploaded in the last 30 days across 30 users
80% of clicks to expand the integration panel resulted in an action (parsing data, copying or downloading from CargoWise via the API)
User research post launch showed that out of 5 customers 4 confirmed the integration saved them at least 1h of their daily tasks
Conclusion
Delivered a feature within the Customer Commitment timeline
The feature is usable and valuable, as shown by Mixpanel and feedback
Hurdles on the road still made possible to prioritise Customer Experience and have a big picture design for the future versions
As a designer, I gained greater understanding of Integration Software and engineering obstacles
