preloader

Project overview

Due to a strict Non-Disclosure Agreement (NDA), specific details, proprietary workflows, and granular data regarding my contributions to Kaiko Systems are restricted. The following overview highlights my strategic approach and high-level impact while respecting the project’s confidential nature.

Project overview mockups

The product

A dual-platform maritime intelligence ecosystem. It integrates a mobile-first inspection tool for offshore crews with a powerful analytics dashboard for onshore management. This end-to-end solution transforms manual ship inspections into actionable data, providing real-time visibility into global fleet health.

Responsibilities

Joining post-MVP, I was tasked with maturing the product’s design foundation. I architected and optimized a comprehensive Design System tailored to the Spectre CSS framework, ensuring technical alignment while elevating the UI. My role involved rapid prototyping and iterative testing of multiple design explorations to streamline complex maritime workflows.

The problem

The initial MVP lacked the structural flexibility to scale beyond its niche. While highly functional for maritime shipping, the platform’s design framework couldn't easily adapt to adjacent markets. My objective was to re-architect the experience to support multi-sector fleet management—such as logistics and trucking—unlocking new revenue streams and user segments.

The goal

Our objective was to develop a highly flexible data input system capable of adapting to diverse industrial requirements. By designing a customizable framework for data entry, we aimed to empower Kaiko Systems to scale beyond maritime shipping into any machinery-heavy sector, ensuring the platform remains industry-agnostic and fully tailorable to specific client needs.

My role

I was responsible for professionalizing the product’s visual and functional foundations. I architected a scalable Design System from the ground up—integrated with the Spectre CSS framework—and led the end-to-end UX strategy to transition the platform from a niche maritime tool into a versatile industrial ecosystem.

Project duration

I worked on this project from December 2020 till July 2022. Over these 19 months, I guided the product's design evolution from its post-MVP stage to a mature, multi-industry platform. My long-term commitment allowed me to not only architect the initial Design System but also to iterate on complex data-entry workflows based on real-world feedback from offshore crews.

Getting to know the user

User research summary

Most of the user research data came from crew members interviews and usability tests done with the MVP solution onboard. The rest of the requirements were proposed by stakeholders and project managers.

Pain points

Lack of flexibility

It's hard to deploy the existent solutions on other machinery sector or even on other ship fleets with specific characteristics.

Different flows to complete surveys

Every survey has a different flow and specific way to be completed in order to review ship component's health. Crew members do not feel cohesion when using the mobile app.

Problem statement #1

Existing solutions provided by Kaiko Systems lack flexibility, so it is hard to customize and deploy them for the growing number of customers with different specifications.

Problem statement #2

Ships have several sections and components that need to be periodically reviewed. Crew members use surveys to collect the info about those components' health status, but those surveys are different for each section or component. The mobile app used onboard has a hard learning curve due to this inconsistency.

Hypothesis

Both problems can be addressed by one approach. A flexible data input can be designed to solve the system flexibility and adaptability to a broad range of scenarios, at the same time this will serve to form consistent surveys that will make Kaiko's apps grow in usability and users engagement.

Flexible data input

Definition

The first step was defining a system that allows creating surveys by pieces to increase scalability; this gives Kaiko Systems the possibility of creating all kind of surveys to apply them in changing scenarios. Also having in mind this system needs to be flexible, so it will be easy to add new rules to it.

Media type objects

One of the data collected from the mobile app are pictures, video or sound. This will allow creating this kind of objects to form surveys in where some steps need it.

List selection objects

Surveys ofter have several options to select the state of ship component. This kind of object cover the creation of any kind of list.

Text input objects

The most common and versatile object type are inputs. They allow entering more specific information.

Insights

These conceptual models defined the roadmap to develop a flexible system that covers several scenarios due to how configurable it is. Even if some other kind of data appears, it will be easily added to the system. As the mobile app is web-based, the surveys can be designed using this model and presented to users without big effort.

Starting the design

Exploration

Paper wireframes exploration

The goal here was to find a way to form surveys using objects defined in the flexible data input model as steps. Following the main goal which is to allow creating a broader kind of surveys using those objects as pieces (steps).

Paper wireframes exploration

The goal here was to find a way to form surveys using objects defined in the flexible data input model as steps. Following the main goal which is to allow creating a broader kind of surveys using those objects as pieces (steps).

Low-fidelity prototype

The flow is simple, from Home page it is possible to reach an app detailed view, filtering and going to Developer view.

Refining the design

Survey flow before iterations

High-fidelity prototype after iterations

Testing on-site

Test sessions onboard

Crew members were end users, so final test sesions where made directly onboard with them.

Test sessions onshore

Kaiko System also has a desktop dashboard app to manage all insight gathered from mobile app on ships. Here we can see a test to try out the new way of collecting data.

Usability study findings

The Flexible Data Input system was implemented on a new branch, so the old app was kept to make A/B test rounds.

1Crew members could complete the test survey keeping track of the step they were.

2Surveys look like part of a system, as they should, so users felt coherence.

3It was easier to correct certain steps just by selecting them using the numbered progress line.

4Surveys can be longer in some cases, so inspections can take more time. Some users (crew members) complained about it.

Going forward

Takeaways

Impact

The research for creating a Flexible Data Input and its implementation widen Kaiko Systems' market opportunities. Kaiko Systems became more flexible and changes made to mobile app surveys took less time. End users could complete surveys straightforwardly. Vessel tracking deficiencies could be analyzed efficiently and with better records.

What I learned

This project was challenging because it covers shipping industry, something new for me. It took me out of my comfort zone and gave me a precious experience. In addition, my worked completely remote during times of COVID which furthered my communication skills with stakeholders. It helped me to consolidate my role as Product Designer as well as my knowledge of Design Systems Optimization.

Next steps

1During the first version of the Flexible Data Input case, it was tedious for end users when survey were too long, so in further updates one of the goals will be iterate on this to optimize this flow.

2The mobile app is not friendly for novice users, so next roadmap will include a full revision of both apps, mobile and desktop to include an onboarding feature for new user to familiarize with them.

Check other works