OverviewProblem SpaceResearchIdea ExplorationDesign IterationFinal DesignNext Steps

SPIN SCOOTER

Data-driven dashboard design for analysts

MY RESPONSIBILITY

Product Strategy
Visual design
Research

overview

How can Pittsburgh become a role model city for micro-mobility transportation? Our team grappled with this question while developing a dashboard for "Spin," an e-scooter company based in San Francisco. As the lead product designer, I designed an interactive dashboard for Spin's data analysts to help scale the company's rollout in Pittsburgh while assuring the safety of their customers.

DURATION

5 weeks (Oct - Nov 2021)

TEAM

1 Product Designer (me)
2 UX Researchers

Problem space

New scooters in town

In the summer of 2021, I started noticing bright orange scooters parked in every corner of the city. Spin had partnered with the city of Pittsburgh to launch its scooter distribution across the city in an effort to provide an additional transportation choice for residents.

1,000 scooters distributed across Pittsburgh

Growing pains in the beginning

However, the effort met a rough start due to the numerous complaints on illegal parking and reckless driving putting both pedestrians and drivers at risk. In addition, the lack of Spin 's physical office space in Pittsburgh only aggravated the issue.

How can a team of designers solve this?

In today’s age of sharing economy, information is key. Our team believed that providing access to meaningful data can help Spin employees identify and mitigate emerging issues by accurately projecting scooter demand.

We decided to design a dashboard that enables Spin to scale its business without putting safety at risk

My role as the product designer was not only limited to translating design concepts into iterative prototypes but also involved ensuring the design supports Spin's ultimate business objective of a successful rollout.

Research

Research on contextual information

E-scooter was initially an unfamiliar territory for our team. In order to gain background knowledge and define our project scope, we spent the first week conducting research across three domains.

Key takeaways from contextual information research

Making sense of what we know so far

We then compiled our findings through space saturate and created a collage of experiences, thoughts, and insights gathered to-date. The goal of this exercise was to narrow down the key areas of focus for our dashboard design.

Space saturate with information gathered from research, categorized by themes

There were a myriad of factors to consider, stakeholders involved, and issues to address. However, we decided to prioritize the specific problems that prompted the project from the beginning - how can Spin minimize safety risks while efficiently distributing scooters throughout the city of Pittsburgh?

But first, who are we designing for?

To ensure our solution is actionable, we first defined the intended target user. Using publicly available data on Spin's organization, we reviewed several role descriptions before deciding that a Data Analyst would be our dashboard's primary user.

Target user persona description

Based on contextual research and our newly chosen persona's objectives - optimizing scooter allocation and detecting emergent scooter issues in the city - we refined our problem space into the following -

How might we provide real-time data to help analysts scale Spin's operations without jeopardizing customer safety?

Idea exploration

Desired outcome via storyboarding

Before putting pen to paper, I first wanted to define a data analyst's desired outcome from interacting with our dashboard. I also wanted to validate the user's needs and establish a deeper understanding of the user's motivation.

Through storyboarding, I recognized that in addition to identifying emerging issues and trends, our user should also be able to appropriately allocate scooters based on their supply and demand in a specific region.

Right charts for the right data

Data visualization is in itself a form of art. Before jumping into digital design, I created hand-drawn sketches to explore numerous graph types that best suit the purpose of each parameter.

Hand-drawn sketch exploring different visualizations

Several data points and metrics were considered in the process. Some were mission-critical while others were dismissed because they did not seem insightful for the data analyst. Our team decided to include the following metrics, categorized by themes -

Customer issues - type of issues reported (composition by type),
count of issues by type (trend over time)
Scooter allocation - available scooter (% idle), in-use scooter (% utilized), non-functional scooter (% down)
Business growth - revenue growth (relative to previous period), total trips completed (relative to previous period), new & active users (growth over time), miles traveled (growth over time)

DESign Iteration

Getting the framework right with wireframes

I first built the skeletal framework for the multi-page dashboard. The goal was to design an interface that is not only informative but also actionable for our intended user.

Wireframes of the dashboard that consists of three separate pages

The Overview tab, as the very first page of the dashboard, displays high-level information and key operational metrics that are important for the company.

The Performance Trend tab allows users to keep a pulse on several KPIs including the growth of users, trips completed, and miles traveled between two date ranges. The Issue Management tab is intended to provide a view on the overall trend of rider issues reported.

Each dashboard tab was designed to achieve specific purposes, with different data points and metrics as enablers

Early feedback: "Wait, what am I looking at?”

Being unable to consult with the actual analysts from Spin, our team instead approached several colleagues with previous experience in data analyses and dashboard design for constructive feedback.

Feedback and comments on the wireframe

Incorporating feedback during design iterations

Our team collected and analyzed the feedback we received from seven different colleagues. Some directed at improving the visual design, which I then addressed by clearly labelling the user interface and making it more scannable.

However, one piece of feedback was particularly important, which was about effectively allocating scooters based on both the demand and availability of existing scooters in a specific region. Our team went back to the drawing board to figure out how to address this significant gap.

We needed to improve how we visually depict the shortage or surplus of scooters in a region for analysts to appropriately allocate scooters

Final Design

Allocating scooters to meet customer demand

The area graph visually depicts whether there is sufficient # of available scooters across different regions of the city throughout the day.

For example, if 'In Use (%)' is high, more scooters may need to be distributed in that region.

Finding high-growth neighborhoods

The heat map of the city represents the magnitude of growth for different metrics (e.g., active users) over a certain time range, highlighting regions with increasing needs.

Data analysts may use this information to either allocate scooters or recommend more marketing spend in lagging areas.

Detecting sudden spikes in rider issues

Trend analyses on rider issues, which are reported across 4 different categories, enable early detection of abnormal behavior in a region.

Data analysts may use this insight to make informed decisions on emerging safety risks.

Actionable data in a readable design

We chose to design a multi-tab dashboard where each page serves a specific business purpose. We believe this not only helps prevent users from cognitive overload but also makes the dashboard more actionable by reducing decision-making time.

Finished designs of dashboard interface

Next Steps

Validation and testing with real users

We designed the dashboard as a classroom project, without the chance to receive inputs from our intended user group at Spin. As a potential next step, I would like to conduct a usability test with Spin data analysts to validate our hypotheses around user needs and to explore ways to improve the design.

Improvement opportunities

During the project time frame of 3 weeks, we conducted topical research, ideated through rapid prototyping, and iterated on the design. If we were to have an opportunity to consult with Spin data analysts, I would like to further improve our dashboard design by discussing the following topics -

Identifying sub-categories of issues that Spin tracks today which can be used to inform more tactical solutions for analysts
Exploring other ops metrics / measurements of scooter usage that can be used to determine shortage or surplus in a region
Research source: 1) 2019 Micro-mobility in cities: a history and policy overview, National League of Cities; 2) Sarah Fox, co-author of Accessibility and Crowded Sidewalk: Micro-mobility’s Impact on Public Space