Masternaut Connect
Masternaut Connect
Masternaut Connect
Redesigning a legacy platform for fleet management and vehicle tracking tool in real-time.
Redesigning a legacy platform for fleet management and vehicle tracking tool in real-time.
Redesigning a legacy platform for fleet management and vehicle tracking tool in real-time.
Made for LittleVoice
Made for LittleVoice
Made for LittleVoice
My role & responsibilities
My role & responsibilities
Information Architecture
Information Architecture
User Flows
User Flows
Wireframing
Wireframing
UI Design
UI Design
Design Systems
Design Systems
Handoff
Handoff
Overview
Overview
Masternaut (Michelin Group) specializes in fleet and asset management and is a part of the world's biggest telematics corporate group.
The company was founded in 1996 and benefited from minor to no competition in its field for a long time.
That changed in recent years with the rise of a startup scene in the telematics industry. The task was to help Michelin transform legacy software into a competitive SaaS product.
Masternaut (Michelin Group) specializes in fleet and asset management and is a part of the world's biggest telematics corporate group.
The company was founded in 1996 and benefited from minor to no competition in its field for a long time.
That changed in recent years with the rise of a startup scene in the telematics industry. The task was to help Michelin transform legacy software into a competitive SaaS product.
Masternaut (Michelin Group) specializes in fleet and asset management and is a part of the world's biggest telematics corporate group.
The company was founded in 1996 and benefited from minor to no competition in its field for a long time.
That changed in recent years with the rise of a startup scene in the telematics industry. The task was to help Michelin transform legacy software into a competitive SaaS product.
Problem statement
Problem statement
The main challenge was to keep feature parity with the software in development for more than 20 years and still make user friendly and ensure its seamless future evolution. As a bonus, he helped the company switch from a pure development mindset to a user-first approach.
The main challenge was to keep feature parity with the software in development for more than 20 years and still make user friendly and ensure its seamless future evolution. As a bonus, he helped the company switch from a pure development mindset to a user-first approach.
The main challenge was to keep feature parity with the software in development for more than 20 years and still make user friendly and ensure its seamless future evolution. As a bonus, he helped the company switch from a pure development mindset to a user-first approach.
Approach
Approach
After conducting several workshops and brainstorming sessions with the client and their engineering team, it was decided to divide the platform redesign process into several key stages.
After conducting several workshops and brainstorming sessions with the client and their engineering team, it was decided to divide the platform redesign process into several key stages.
After conducting several workshops and brainstorming sessions with the client and their engineering team, it was decided to divide the platform redesign process into several key stages.
At this stage, I worked on defining the core user flows and structuring the MVP features based on user needs and business goals.
At this stage, I worked on defining the core user flows and structuring the MVP features based on user needs and business goals.
At this stage, I worked on defining the core user flows and structuring the MVP features based on user needs and business goals.
Improvement of Global Navigation
Improvement of Global Navigation
Improvement of Global Navigation
The platform’s architecture and navigation were completely rethought.
Redesign of the Map and Search Filters
Redesign of the Map and Search Filters
Redesign of the Map and Search Filters
The map and filters were optimized to enhance search and interaction for administrators and drivers.
03. Redesign of the Profile Cards
03. Redesign of the Profile Cards
03. Redesign of the Profile Cards
The driver and vehicle profiles were improved for better presentation and prioritization of essential data.
Solution
Solution
In collaboration with the design team, we reimagined the legacy platform from the ground up—simplifying structure and navigation while laying a solid foundation for future scalability.
In collaboration with the design team, we reimagined the legacy platform from the ground up—simplifying structure and navigation while laying a solid foundation for future scalability.
Phase 1:
Navigation
Phase 1:
Navigation
We decided to use a vertical menu instead of a horizontal one to save space on the main workspace, making navigation more intuitive and accessible across various resolutions and sizes.
A component system was developed for all styles and states, considering all usage scenarios on different platforms, including mobile.
We decided to use a vertical menu instead of a horizontal one to save space on the main workspace, making navigation more intuitive and accessible across various resolutions and sizes.
A component system was developed for all styles and states, considering all usage scenarios on different platforms, including mobile.
Phase 2:
Full map redesign
Phase 2:
Full map redesign
In the next phase, we focused on improving the map and vehicle search filter, the main and most crucial management tool for managers:
• Enhanced map visualization
• Developed a clear pin system with all states
• Simplified search bar with preset options for grouping vehicles, allowing customization
• Developed a clear system for errors and warnings
In the next phase, we focused on improving the map and vehicle search filter, the main and most crucial management tool for managers:
• Enhanced map visualization
• Developed a clear pin system with all states
• Simplified search bar with preset options for grouping vehicles, allowing customization
• Developed a clear system for errors and warnings
Phase 3:
Driver & Vehicle profile update
Phase 3:
Driver & Vehicle profile update
The final but equally important phase was the redesign of the driver and vehicle card. Based on the updated structure and layout, we reviewed and prioritized all necessary data and features.
Special attention was given to developing dedicated routes, road incidents, and the history of vehicle stops and downtime with visualization.
The final but equally important phase was the redesign of the driver and vehicle card. Based on the updated structure and layout, we reviewed and prioritized all necessary data and features.
Special attention was given to developing dedicated routes, road incidents, and the history of vehicle stops and downtime with visualization.
Additional screens
Additional screens
I also designed key edge cases, error states, and empty screens to ensure a consistent and resilient user experience.
I also designed key edge cases, error states, and empty screens to ensure a consistent and resilient user experience.
Outcome
Outcome
I was involved in the project for a telematics company that develops a support platform for vehicle tracking.
I was involved in the project for a telematics company that develops a support platform for vehicle tracking.
My challenges were to re-think and update navigation structure, onboarding process, and login, create a design system, and design guidelines based on Vuetify.
Also, I took part in redesigning a core of legacy platform - fleet view, search, and vehicles/driver passports.
My challenges were to re-think and update navigation structure, onboarding process, and login, create a design system, and design guidelines based on Vuetify.
Also, I took part in redesigning a core of legacy platform - fleet view, search, and vehicles/driver passports.
Let’s make something great together
Let’s make something great together