dashboard design; data visualization;

SpinDashboard

September 2021 - October 2021
I designed a data platform that coordinates Spin Scooter gig workers based on all stakeholder priorities to calculate the optimal pickup and redistribution route. This allows gig workers to evenly distribute the electric scooters across the city for equal access.
Jump to Final Product
Context
Academic Project
for Spin Scooters
Team
Mia Hofmann, Ashley Kim, Ziwen Zeng
My Role
Lead Designer
Methods
Data Visualization, Dashboard Design,

Executive Summary

search icon used to convey the goal
Problem

Many cities around the US have adopted electric scooters to fill short-distance transportation gaps in urban life. Nevertheless, many local policymakers assessing the viability of e-scooters in their transportation system have identified that an uneven spread over the city severely limits the access for many community members to this cost-effective alternative mode of transportation. 

light bulb icon used to convey the solution
Solution

A data platform that empowers Spin Scooters gig workers with algorithmic decision-making. The platform coordinates all the gig workers based on the individual, company, and city priorities and calculates the optimal pickup and redistribution route allowing the gig workers to evenly distribute the electric scooters across the city. Job progress insights and visualizations allow the gig workers to quantify their effort and follow the desired path. 

Project timeline of Spin Scooters project
PROBLEM OVERVIEW

An uneven distribution of electric scooters limits access to a cost-effective mode of transportation for short distances

Electric scooters are usually aggregated in some locations; whereas, other locations are left empty, making access to them uneven or unreachable. Current solutions to this problem initiated by competitors include employing full-time employees or introducing a scooter "reserve" feature, both of which fail to take into account the needs of the gig workers or the city.

Spin Scooters Distribution in Pittsburgh
RESEARCH

Understanding the gig workers behind scooter deployment

Gig workers are employed by Spin Scooters to facilitate the distribution and upkeep of its scooters. For gig workers, their main goals are to have a flexible schedule where they can use this job as a side-gig to make some extra income. However, they are not provided the right management model to complete their jobs effectively.

purple line bullet
Kalen - Gig Worker
Inefficient usage of workers incentivizes them to form clusters

Due to a lack of coordination between the gig workers, they tend to pick up and drop off scooters at the location that is most convenient for them (i.e. their nearest and most profitable locations). This creates clusters of scooters in some locations instead of ensuring an even distribution throughout the city.

purple line bullet
Key Takeaways
custom made check mark bullet circle
Gig workers are currently motivated by convenience
custom made check mark bullet circle
Gig workers require a flexible schedule
custom made check mark bullet circle
There is a lack of an efficient management process
PROPOSAL

A data platform that empowers the gig workers’ decision making 

Job efficiency enhances e-scooter access

The design proposal is a comprehensive dashboard that uses an optimization algorithm that takes into consideration the preferences specified by the gig workers via a job request as well as company requirements (i.e. maximizing scooter ridership and revenue generated). The algorithm then responds to each individual gig worker with a list of tasks that they can accept. This ensures an even distribution of scooters across the city while maintaining a gig worker economy.

ITERATIONS

Scaling e-scooter deployments confidently with visualizations and analytics

Low-fidelity Wireframes

To start the design process, we carried out a quick brainstorming session with the team where we all sketched out individual ideas for layout and visualizations. I then consolidated the strengths of all the sketches into an annotated wireframe that specifies the layout as well as placement of the different metrics, which was helpful in realizing the best flow of the dashboard.

annotated layout of the dashboard low fidelity sketches of the dashboard design
purple line bullet
Key Design Principles
custom made check mark bullet circle
Establish a grid
custom made check mark bullet circle
Identify key metrics
custom made check mark bullet circle
Recognize data visualization best practices
Mid-fidelity Prototype

After laying out the fundamental grid and layout of our dashboard, we worked in two sprints to start developing data visualizations and populate the dashboard with all the visuals and the metrics. I led the sprint-style work sessions in order to reach an appropriate level of fidelity for usability testing.

gif of kalen's workflow on a mid-fidelity dashboard prototype
Job Requests Mock-up
TESTING

Platform usability repairs

We conducted a task-based usability testing method to evaluate the design and effectiveness of our prototype. To make the usability testing as realistic as possible, I recruited two  gig workers as our participants. I was able to identify key changes that we had to make in our next iteration through this process.

purple line bullet
Task Based Testing
cross icon
Task 1: Open chat and ask for real-time help
cross icon
Task 2: Use the QR Code Scanner to check Scooter Status
check mark icon
Task 3: Update status of a task in the Task Manager
usability testing task screenshot for kalen's task 3: update status of a task in the task manager
check mark icon
Task 4: Check scooter activity trends over time
purple line bullet
Data Visualizations
cross icon
Perception of color changes depending on neighboring colors making not well-suited for seeing individual results
cross icon
Encoding too much information with color and no clear labels makes it confusing and ineffective
purple line bullet
Key Takeaways
custom made check mark bullet circle
Important metrics need to be more emphasized
custom made check mark bullet circle
There needs to be more visual heirarchy between elements
custom made check mark bullet circle
Need to be more mindful of the data visualization method used
REVISING

Developing a multi-directional value flow

While it seemed like our proposal was developing multi-flow value creation, we went back to our stakeholder map and realized that the city policymakers' considerations were not met. Monitoring data and distribution to reach locations with limited access to other transportation options is a key goal for city policymakers. While this consideration can be addressed by the algorithm, it also can appear in the incentives offered to the gig worker when making a job request.

purple line bullet
Stakeholder Map
purple line bullet
Key Takeaways
custom made check mark bullet circle
The map views need to be more personalized
custom made check mark bullet circle
There needs to be more visual heirarchy between elements
custom made check mark bullet circle
Important metrics need to be more emphasized
FINAL

Bridging the short-distance transportation gap

The process of iterating and testing informed the design of our final prototype. We also incorporated motion design at this stage to make present a dashboard experience that is more fluid. Some key features that we focused on are: task manager, chat assistant, scooter activity visualizations, and the job requests form.

Dashboard Features

The image below highlights all the essential features of the final dashboard prototype.

play button

Spin Dashboard Features

Watch the video

Bonus Feature: Dark Mode

I also designed the dashboard in a dark mode so that the user has the option to pick a mode of their preference.

Light Mode
arrow
Dark Mode
arrow
REFLECTION

Final Thoughts

purple line bullet
Value Creation

The user benefits from having a clearly labeled and organized dashboard that allows them to gain quick insights. The gigs are coordinated based on user, company, and the city needs to ensure equal distribution of scooters across the city.

purple line bullet
Things I Learned

Data is ubiquitous in today’s age and prior to this project, I felt like I lacked the necessary exposure to data-driven design. However, this project helped me develop a strong foundation in data visualization and dashboard design. Moreover, I also learned about motion design and how to use it to complement data-driven designs.

purple line bullet
What Can Be Improved
custom made check mark bullet circle
Paying more attention to data visualization methods used
custom made check mark bullet circle
More in-depth usability testing to ensure the effectiveness of the dashboard
custom made check mark bullet circle
Refine UI of the scheduling form to meet accessibility requirements
diagram of project concepts
Previous Project
Gadgets
purple line break
Next Project
SecurePass