use case

WebApp Redesign for Fleet Management

Project Overview

The redesign of this WebApp began as part of a platform-wide initiative to modernize its interface and improve usability for fleet managers and directors. The first milestone was to introduce a customizable dashboard, allowing users to prioritize and access critical information quickly. This foundational work set the stage for the redesign of additional key pages, resulting in a cohesive and scalable design system.

Client

Tourmo

Role

UI Designer

Duration

18 months

Tools Used

Figma

Understanding the Challenge

Fleet management is a complex domain that requires real-time access to actionable insights for directors and managers. However, the existing platform did not provide a way to customize priorities, making decision-making slow and inefficient.

  • Information Overload:

    Managers struggled with a one-size-fits-all dashboard that presented excessive non-prioritized data.

  • Lack of Customization:

    While the platform offered customization in other areas, there was no existing customized dashboard. The new product was designed from scratch to allow users to select and prioritize the most critical information for easy access.

  • Inefficient Navigation:

    Key reports and fleet insights were buried deep in the interface.

Key Note: This WebApp redesign was exclusively for fleet managers and directors. Drivers interact only with the mobile app, which will be redesigned as a separate initiative. Learn more about the Mobile App Use Case.

Business & User Insights

Rather than conducting direct user interviews, this project was informed by strategic business insights gathered by the commercial team and the head of product management.

The data was based on:

  • right arrow icon gray

    Client Feedback:

    Recurring issues reported by existing customers.

  • right arrow icon gray

    Product Strategy Goals:

    Identified priorities from product leadership.

  • right arrow icon gray

    Commercial Team Insights:

    Observations from sales and customer success teams interacting
    with users.

Key Findings:

  • Fleet managers need a customizable dashboard to surface critical KPIs quickly.

  • Reducing cognitive load improves decision-making.

  • Navigation should be restructured for more intuitive access to reports and analytics.

Ideation & Strategy

With a clear understanding of business goals and user challenges, we explored solutions that focused on:

  1. Customizable Dashboard:

    Users should be able to prioritize and configure their most critical data.

  2. Scalability &
    Design Consistency:

    The redesign needed to be extendable to other pages.

  3. Faster access to insights:

    Key reports and metrics should be surfaced prominently.

Dashboard tiles sizes & wireframes

Design Execution

One of the core innovations in this redesign was the introduction of Tiles, a modular approach that allowed users to configure their dashboard by selecting prioritized information. These tiles functioned like Tetris or Lego pieces, fitting together dynamically to create a customized view of key data.To achieve this flexibility, each tile was designed with a set of pre-defined sizes such as 2x3, 4x3, 6x2, and other adaptable configurations. Each tile contained relevant information based on user priorities, including:

  1. Buttons for quick actions.

  2. Graphs for data visualization.

  3. Tables for detailed insights.

  4. Filters to refine displayed data within individual tiles, ensuring quick access to relevant information.

  5. Customizable Content: Users had the ability to select what information appeared within each tile, ensuring a personalized experience tailored to their operational needs.

By creating a structured framework of flexible tiles, fleet managers and directors could personalize their dashboards to optimize workflow efficiency and improve decision-making.

The final design delivered:

  • Modular Data Cards:

    Managers struggled with a one-size-fits-all dashboard that presented excessive non-prioritized data.

  • Visual Data Representation:

    While the platform offered customization in other areas, it did not provide a customizable dashboard that allowed users to select and prioritize the most critical information for easy access.

  • Prioritized Fleet Health Metrics:

    Key reports and fleet insights were buried deep in the interface.

Expanded Tile Library for Flexibility and Configurability

Building on the initial tile designs, I expanded the library to offer a broader selection of components, including tables, graphs, action tiles, trend lines, location maps, and event summaries. This enhancement aimed to provide both the Development Team and Tourmo’s Professional Services Team with a predefined yet adaptable set of components to accelerate implementation and ensure scalability.

By refining the tile framework, we enabled teams to efficiently customize dashboards for different use cases and user roles, ensuring that fleet managers and directors could access the most relevant data without friction. This structured yet flexible approach helped streamline dashboard personalization while maintaining a consistent design system.

This initiative highlights my focus on scalability and cross-functional collaboration, delivering practical tools that align with both technical and client requirements. The expanded tile library not only enhanced dashboard configurability but also laid the foundation for future growth and adaptability across Tourmo’s platform.

AutoPilot Dashboards

The AutoPilot Dashboards represent the final implementation of the WebApp redesign, bringing together all the flexibility, configurability, and user-centric enhancements developed throughout the project. These dashboards empower fleet managers and directors with a streamlined, highly customizable experience, ensuring they can access critical insights with ease.

Designed to support multiple operational needs, the AutoPilot Dashboards offer a modular approach, allowing users to switch between different program views, configure tiles based on their workflow, and optimize data visualization. This solution provides a structured yet adaptable framework that enhances decision-making efficiency and ensures a clear, intuitive interface tailored to various user roles.

Multi-Program Dashboard – A centralized view enabling users to manage multiple programs seamlessly

Program Dashboard with Configurable Tiles – Showcasing all available components, including buttons and action tile

Customized Dashboard Example – A fully personalized layout, reflecting individual user preferences and operational priorities

Voices From The Field

Once launched, feedback from fleet managers, the commercial team, and internal stakeholders validated the redesign.

"The simplified dashboard makes it so much easier to track performance in real time. Engagement has definitely increased since the update."

National Food Distributor

Operations Manager

“Tourmo’s AutoPilot platform has made a big difference in our employee engagement and satisfaction.”

A top 50 U.S. company with 20,000+ users.

VP Operations

"This update has been a major step forward. We’re enabling users to get to key insights faster, and that’s resulting in higher retention rates and stronger relationships with our clients."

Key Tourmo Reseller

CEO

Results & Business Impact

The dashboard redesign introduced a new way to interact with data by focusing on modularity and customization:

  • 40% faster access to key insights.

  • Improved user satisfaction score from fleet managers and directors.

  • Positive impact on client retention, as reported by the commercial team.

  • Established a design framework that has been extended to other pages of the platform.

Platform-Wide Redesign Impact

After the successful launch of the dashboard, the redesign principles were extended across other key areas:

coming soon

Event Panel

Trip Cards

Route Template

Workflow

Job Details

Event Tab

Task Edit Template

Edit & Assign

Mobile App

Explore More

Want to see the dashboard in action? Explore it on Tourmo's website.

Lessons Learned

This project reinforced key UX principles in business-driven design:
‍

  1. Business insights are as critical as direct user research.

  2. Customization boosts efficiency for enterprise users.

  3. A modular design system enables scalable platform-wide redesigns.

Next Steps

The WebApp redesign set a foundation for future enhancements. Ongoing iterations will focus on:

  1. Expanding dashboard customization options based on new user feedback.

  2. Optimizing the platform further for scalability across international markets

  3. Integrating AI-driven insights for predictive analytics.

I am excited to continue evolving the platform and ensuring its long-term success.

Discover More Case Studies

Explore similar projects in my portfolio:

Fleet Management Mobile App

Enhancing the mobile experience with an intuitive interface, optimized workflows, and improved accessibility for fleet operations.