Go back

Stratio | Fleet Maintenance App

Redesigning the Overview Dashboard to help fleet maintenance managers to work more efficiently while increasing users’ session time by 40%.

User Research

Data Visualisation

Dashboard

1. Problem and Opportunity

2. Exploring Solutions

3. Validating Solution

4. Production

5. Retrospective:
Areas for Improvement

Overview

Stratio Web App helps fleet managers eliminate the #1 profit killer: unplanned downtime.

With an AI-powered predictive maintenance solution, the platform forecasts component failures before they occur, transforming maintenance from reactive to proactive and delivering measurable cost savings across your fleet.


The dashboard analytics enables rapid data analysis across customers entire fleet, giving them actionable insights without drilling down into individual components.


The Process

1. Understanding the Problem and Opportunity

Strategic Importance of the Overview Page


  1. Centralized Fleet Intelligence
    Single source of truth for fleet health: users can assess status, identify issues, and prioritize actions without navigating fragmented tables.

  2. Primary Entry Point
    The first touchpoint in daily 2-hour sessions: sets expectations and determines overall workflow efficiency.

  3. Visual Decision-Making Hub
    Transforms raw data into actionable insights through visualisation, eliminating cognitive burden of table analysis.


The image below shows the existing dashboard interface prior to the redesign outlined in this use case.

User Research Methodology

To validate our initial observations and build accurate user personas, I developed structured interview scripts and conducted both in-person and remote research sessions with existing customers. The Sales team facilitated access to a representative sample of our user base.


Research Scale:

  • 70+ customers surveyed for quantitative validation

  • 12 in-depth customer interviews for qualitative insights

  • Mix of in-person and remote sessions to capture diverse contexts

Stakeholders' Alignment

To ensure comprehensive problem definition and cross-functional alignment, I facilitated collaborative workshop sessions during the discovery phase. These workshops brought together key stakeholders from Marketing & Brand, Customer Success, and Sales teams to surface diverse perspectives and establish shared understanding.


Stakeholder Goals

  • Marketing & Brand: Create outstanding visual experiences with clear connections between platform overview and deeper feature areas.

  • Customer Success: Design an intuitive entry point that guides users seamlessly into our service while surfacing relevant data.

  • Sales: Enhance user experience, improve key engagement metrics, and increase customer satisfaction.


User Personas

Through behavioural analysis and workshop sessions, we identified that users were utilising our platform for both maintenance management and logistics operations, revealing a more complex user need than initially scoped. This insight prompted deeper persona development to understand the full spectrum of their responsibilities and daily workflows.


Main Persona 'The Fleet Manager':

Fleet Managers are the operational backbone of transportation companies, responsible for ensuring vehicle availability, regulatory compliance, and cost-effective fleet operations.


Key Characteristics:

  • Manages fleets ranging from 50 to 200+ vehicles

  • Oversees both maintenance operations and logistics coordination

  • Balances preventive maintenance with operational uptime demands

  • Type of Organization: In-house Workshop (~60% of users) VS Outsourced Maintenance (~40% of users)


Research Findings

Pain Points

  1. Time Inefficiency & Cognitive Overload
    Fleet Managers spend an average of 2 hours daily navigating through service data tables and manually scrolling to verify fleet status. This inefficient workflow:

    • Consumes time that could be allocated to strategic tasks.

    • Creates uncertainty: users lack confidence they've reviewed all critical information.

    • Forces repetitive checking behaviors due to fear of missing important updates.


      Impact: Lost productivity and persistent doubt about data completeness.


  1. Friction-Heavy Navigation

    Users report excessive clicking and navigation steps to access information they know should be immediately visible. Key frustrations include:

    • Too many interactions required to confirm data they regularly monitor Lack of at-a-glance visual indicators or dashboard widgets.

    • Awareness that competitor tools and modern interfaces provide direct access through visual summaries


      User Quote Insight: "I know you have this information, why do I need to click through five screens to see it?"

      Impact: Decreased efficiency and frustration with outdated interaction patterns.


  1. Decision-Making Anxiety
    The current table-centric interface creates an emotional burden where users feel:

    • Anxious about potentially missing critical fleet issues

    • Responsible for costly oversights due to information buried in tables

    • Fatigued from constant vigilance required to ensure "everything is fine"

    This anxiety drives repetitive checking behaviours and erodes confidence in the platform's ability to surface what matters most.


    Impact: User stress, reduced trust in the platform, and potential business risk from missed maintenance issues.


User Needs


Based on our research findings, Fleet Managers have four critical needs when managing their fleet operations:


a. Confidence: "I need to trust that I haven't missed anything critical."

b. Visibility: "I need to see what matters most at a glance."

c. Simplified Interaction: "I need to get to the information I need with minimal friction."

d. Time Efficiency: "I need to accomplish my daily monitoring in less time."



  1. Exploring Solutions

Opportunities

1. User Experience Improvements: Navigation Optimisation

  • Clear hierarchical structure aligned with user mental models

  • One-click access to primary tasks and frequently used features

  • Multiple pathways supporting different user workflows

  • Visual wayfinding through icons, color, and spatial cues

Goal: Reduce navigation friction and task completion time.


2. Visual Communication: Interface Clarity

  • Typography, color, spacing, and iconography as functional communication tools

  • Innovative layouts that differentiate from competitors while maintaining usability

  • WCAG accessibility compliance as non-negotiable baseline

  • Design system consistency for learnability and efficiency

Goal: Instant information comprehension through visual hierarchy.


3. Data Integration: Purposeful Visualisation:

  • Context-appropriate chart selection (no vanity metrics)

  • Interactive data exploration (hover states, drill-downs, filtering)

  • Progressive disclosure to manage complexity

  • Clear visual indicators for actionable insights vs. monitoring data

Goal: Transform raw data into decision-making tools.



Success Criteria: Reduced time-on-task, decreased cognitive load, increased user confidence in fleet status awareness.



Ideation Process

To complete this exercise I brainstormed together with the PM, examples of exercises were Crazy 8s in order to bring as many possible solutions to the table

How Might We & Crazy 8s


In this step constructing how-might-we questions helped me to generate creative solutions for each of the Dashboard section's widgets, here are some examples:

  • How might we organize content?

  • How might we represent visuals?

  • How might we make users understand more complex data visualizations?

  • How might we show as much possible content without scrolling?



Simplifying the structure


Through the last exercise, 3 sections organized Dashboard allows to:

  1. Better organize the information.

  2. Clear split between content that can be filtered or not

  3. Hide for accounts without access to a specific topic (e.g.: maintenance)


Wireframing

I used and shared with the team the Dashboard Design Methodology by Nicholas Kelly.

Full Wireframe Dashboard View

We identified four critical features for product success: an intuitive interface, a centralized dashboard for key data, seamless navigation between overview and detailed views, and clear data visualization for each chart. Full responsiveness would enable access from any device, anywhere.

At this stage, I brought the engineering team into alignment, sharing the problem we're solving, the strategic rationale, and inviting them to challenge our approach or flag technical constraints early.


Tradeoffs Based on Technical Insights

The primary tradeoff: prioritizing simple, performant charts over complex visualizations. This decision accelerated delivery while reducing cognitive load for daily users. We eliminated fancy visuals that didn't directly support our core objectives: choosing clarity and speed over aesthetic complexity.



  1. Validating Solution

User Interviews

I conducted workshops at two critical phases: Problem definition and Pre-production validation, ensuring alignment before major decisions and development handoff.


Cross-Functional Communication: Maintained open dialogue with all project members throughout the process. Clear, continuous communication across design, product, development, and stakeholders was essential to successful delivery and the smooth launch.


This process helped to achieve validated solutions with complete team alignment and increased confidence in delivery.

Testing and Final Design Decisions

Using Maze as the Usability testing tool I conducted user testing with 4 internal stakeholders and 8 customers.


Here are some of the scenarios that I prompted during the interview:

  • Read the widget data

  • Actions that user will take from a widget

  • Information value and priority


    Prototype

    An Invision prototype was prepared to present all interactions and behaviours for the development team. Also used for usability testing.



Main Findings

Seeing the dashboard in action with users for the first time is great. During the interviews that we conducted, we found some issues regarding the 3 first widgets from the Maintenance section. Users enjoyed the visual improvement and also the colour palette. It was interesting to see that the internal feedback was aligned with the customer's inputs - I iterated the User Interface according to the outcome of this test until we got the final result.


  1. Production

Solution Overview

Fleet management tools typically overwhelm users with extensive data reports, creating time-consuming navigation tasks. For Fleet Managers operating within constrained time, we needed a fundamentally different approach: a compact, scannable interface that enables data-driven decisions without sacrificing detail or context.


Design Approach

I established a foundational information architecture that balanced overview clarity with detailed access, then refined through iterative design cycles. The solution prioritizes progressive disclosure, surfacing critical insights immediately while maintaining pathways to granular data when needed.


The result: a dashboard that respects user time while maintaining the depth required for confident decision-making.


Design System & Scalability

I followed existing UI standards while contributing new widget components to the design system, defining rules and specifications in the shared Figma library.


Edge Case Planning: Beyond standard documentation, I designed a comprehensive state system addressing real-world scenarios:

  • empty states (100% active fleets with no inactive vehicles)

  • zero data conditions

  • extreme values

  • loading/error states.


    This proactive approach prevents design debt and ensures consistent UX across all fleet sizes and operational conditions—critical for enterprise scalability.


Deliverable: Documented component library with defined states and implementation guidelines.

Impact & Results

Iterative Delivery Approach


I contributed with a deliverable that allowed the team to iterativaly launch the dashboard view.

Phase 1 - Maintenance Data: Immediate visibility into fleet maintenance, reducing daily monitoring time

Phase 2 - Fleet Activity Data: Unified dashboard combining logistics and maintenance workflows

Phase 3 - Personalization: Customized views based on user role and fleet type



Outcome:

  • 40% increase in user engagement in first 2 weeks post-launch

  • No development issues or blockers during implementation.

  • Post-launch survey deployed for continuous feedback.


  1. Retrospective: Areas for Improvement

Enhanced Metrics & Validation

I would strengthen design decisions with deeper quantitative analysis.


What I'd do differently:

1. Baseline Metrics

  • Measure pre-redesign: task time, click depth, error rates, session patterns

  • Identify most-accessed data points and usage sequences

2. Success Measurement

  • Define KPIs: reduced monitoring time, faster issue detection, confidence scores

  • A/B test key design choices


Key Learning:

Qualitative research + behavioural analytics = stronger rationale and measurable impact.

Note: To comply with a NDA, sensitive information about the software was hidden in this case study. The information shown here is my own and does not reflect the views of the company.

Next Use Case: Volkswagen Maintenance Platform