Milestride B2B SaaS Platform for Smart Mobility Operators

Milestride is a smart last-mile mobility hub for efficient electric scooter and e-bike operations.

Role

Product Designer

Product Designer

Duration

6 months

6 months

Tools

Figma and Figma Make

Figma and Figma Make

Flowpay coverpage
Table of Content
No headings foundSelect the Frame that wraps your article content → open Accessibility → set Tag to main, article, or section.This message disappears as soon as headings are detected.

Project Overview

As urban centers expand, last-mile mobility is becoming a critical challenge. Milestride is a smart mobility hub platform designed to make electric scooters and e-bikes more accessible, reliable, and efficient for everyday commuters.

This case study highlights the design journey of creating a bird’s eye view dashboard that gives operators real-time insights into fleet health, hub availability, and predictive maintenance.

140+

Active Hubs

5000+

Monthly Bookings

2000+

Fleet Vehicles

Problem Statement

City commuters face significant inefficiencies in last-mile travel due to:

  • Lack of visibility into vehicle availability at hubs

  • Limited awareness of battery levels and maintenance needs

  • Operational downtime caused by poor fleet management

  • Difficulty monitoring large networks across multiple hubs

Mobility operators needed a unified, interactive platform to manage hubs, track vehicles, and proactively address issues.

Research & Discovery

I conducted a 3-week research sprint combining qualitative and quantitative methods to build a deep understanding of user pain points and business context.

24

Users

120+

Survey Responses

8

Stakeholder Workshops

Key Findings

  • Operators were overwhelmed by dense data tables and multiple overlapping alerts.

  • There was no quick way to prioritize critical issues visually.

  • Existing dashboards were non-interactive, forcing constant tab switching.

  • Teams preferred progressive visibility — a quick overview first, details on demand later.

User Persona

Ideation

Following user research and stakeholder discussions, the ideation phase focused on simplifying fleet operations while creating a seamless experience for both operators and commuters. Through rapid brainstorming, user flows, wireframes, and iterative design explorations, I identified opportunities to centralize fleet management, improve real-time visibility, and reduce operational complexity.

The final concept evolved into a unified mobility dashboard that provides a bird's-eye view of every hub, enabling operators to monitor vehicle availability, battery health, charging status, geofenced locations, and maintenance alerts from a single interface. Smart filters, interactive maps, and drill-down analytics were introduced to support faster decision-making, optimize fleet distribution, and ensure vehicles remain available where demand is highest.

User Flow

Primary Flow: Issue Detection → Resolution

The primary workflow is designed to help fleet operators identify, investigate, and resolve vehicle issues with minimal effort. Operators begin with a bird's-eye dashboard that provides a real-time overview of all mobility hubs using color-coded status indicators. Selecting a hub drills down into issue details and affected vehicles, allowing operators to inspect battery levels, uptime, and connectivity. From the action panel, they can initiate repairs or notify the maintenance team. The timeline dashboard then provides historical issue data and performance trends, while the workflow concludes with automatic status updates and activity logs once the issue has been resolved.

Supporting Flows

Filtering Flow: Operators can quickly narrow down fleet information using filters such as severity level, node type, or date range, enabling faster issue identification and analysis.

Maintenance Scheduling Flow: The system continuously monitors vehicle health and automatically flags vehicles approaching predefined performance thresholds, allowing maintenance tasks to be scheduled proactively and reducing unexpected downtime.

Design System

To maintain visual consistency across the platform, a comprehensive design system was established with standardized typography, color palette, and semantic UI patterns. This foundation simplifies decision-making, improves accessibility, and creates a cohesive experience across dashboards, maps, and operational workflows.

Color palette

Final Design

The final design provides a centralized, real-time fleet management dashboard that enables operators to efficiently monitor, manage, and optimize last-mile mobility operations. Designed for quick decision-making, it combines intuitive visualizations with actionable insights to improve vehicle availability, operational efficiency, and user experience.

Key Highlights

  • Interactive city map with color-coded hub availability.

  • Real-time fleet status, battery health, and vehicle monitoring.

  • Smart alerts for maintenance, low battery, and geofence violations.

  • Predictive maintenance scheduling to minimize downtime.

  • Analytics dashboard with fleet utilization and performance insights.

Milestride mockup 4
Milestride mockup 4
Milestride Mockup 1
Milestride Mockup 1
Milestride Mockup 2
Milestride Mockup 2
Milestride mockup 3
Milestride mockup 3
Milestride mockup 5
Milestride mockup 5

Impact

35%

Faster Operations

30%

Less Fleet Downtime

25%

Higher Fleet Utilization

  • Reduced the time required to identify, monitor, and rebalance vehicles through a centralized real-time dashboard.

  • Predictive maintenance alerts and battery monitoring helped minimize unexpected vehicle outages.

  • Improved hub visibility and operational insights enabled better vehicle distribution and increased availability across the network.

Real-time insights help me make faster, more confident operational decisions.

Real-time insights help me make faster, more confident operational decisions.

Lessons Learned

Designing for fleet operations taught me that clarity and speed are more valuable than displaying large amounts of data. By focusing on intuitive visualizations and proactive workflows, the experience became easier to navigate while enabling faster operational decisions.


  • Visual-first dashboards with color coding and alerts reduce cognitive load.

  • Map-centric interfaces provide instant situational awareness and faster issue identification.

  • Predictive insights enable proactive maintenance, minimizing downtime and improving fleet reliability.

Next Steps

The next phase of the project is to design a customer-facing mobile application that complements the operator dashboard, creating a seamless end-to-end mobility ecosystem.

  • Design a mobile app for users to locate, unlock, and ride nearby e-bikes and scooters.

  • Enable real-time vehicle availability, route planning, and in-app navigation.

  • Enable secure payments, ride history, and digital receipts.

  • Incorporate safety features such as SOS, ride sharing, and issue reporting.

  • Conduct usability testing to validate the customer experience before launch.

Create a free website with Framer, the website builder loved by startups, designers and agencies.