preloader

Project overview

This project is bound by a strict Non-Disclosure Agreement. For this reason, I was unable to go deeper into all my contributions.

Project overview mockups

The product

Kaiko Systems consist of two applications; the first one is optimized for mobiles and used by crews onboard to carry out periodic reviews of the ship's components through surveys and upload the insights to servers onshore, where the data is analyzed from a second application to obtain valuable information about fleets’ health status.

Responsibilities

I was hired after MVP development, so I had to create a Design System and optimize it, taking into account Spectre CSS framework, used at the very beginning of the project. Also prototyping and testing several explorations.

The problem

Mainly, scalability, the existing solutions of Kaiko Systems had not the necessary characteristics to be used in a sector other than maritime shipping even when there are potential customers with other kinds of fleet, truck fleets for instance.

The goal

Develop a flexible data input system adaptable to customers needs with the objective of personalizing it depending on the kind of data to be collected. The goal is to allow Kaiko Systems to be usable on all kind of ship fleets and other machinery sectors.

My role

UX/UI Designer, Design System Designer.

Project duration

I have been working on this project from December 2020 till now.

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