Map View page with new flight visualization feature.
Clear Skies Ahead for Drone Monitoring
Creating a new flight visualization tool for SkyVision, a B2B SaaS
Company / SkyVision (B2B SaaS)
Role / Solo designer working with a Product Manager, Backend/Frontend developers, and QA Analysts
Timeline / 3.5 weeks
BACKGROUND
Helping analysts find areas of the pipeline that need to be re-monitored
Meet the new flight visualization tool on SkyVision's web application. It helps analysts audit past drone flight paths to that they can alter crew of any areas that need to be re-monitored. It simplified the laborious audit process, giving analysts more time to spend on addressing problematic areas.
Flight visualization feature with collapsed left side panel.
CONTEXT
What is SkyVision?
Oil pipelines are difficult to monitor regularly because they are located in remote areas. Some common pipeline issues that occur as a result are corrosion leaks and cracks. Such issues can result in serious ecological, human casualties, and production & financial loss.
SkyVision is a B2B SaaS tool that helps oil and gas companies save thousands of dollars by helping them monitor and keep their pipelines healthy using aerial imagery captured by drones.
In 2016, an oil spill polluted Amazon rivers used by indigenous group in Peru.
PROBLEM
The impact of missing areas
Areas along the oil pipeline that need to be re-monitored were being missed by the flight crew costing SkyVision's customers, oil companies, millions of dollars in remediation.
It was clear there was an issue with the current drone monitoring process.
RESEARCH
Meet users where they are
In a 2 week sprint of rapid iteration and real-time feedback, I hit the ground running. The accelerated timeline necessitated strategic planning and asking the right questions.
I started by scheduling interview sessions with power users. I focused on answering:
How are analysts auditing flight paths today?
Where are they experiencing the most friction? Why?
Are they using any work-arounds to help them? If so, what are they?
User flow of the problematic multi-system process analysts were using.
KEY INSIGHT
How are analysts auditing drone flight paths today?
Mapping out their current process in a flow chart helped me determine what’s working, what’s not, and what areas need improvement.
I learned analysts used a disjointed process that involved downloading and uploading files into Google Earth. This multi-system process was time consuming and inefficient.
We discovered the laborious audit process was the root cause of human errors. And this is why so many areas were being missed.
DESIGN GOALS
Reframing challenges into opportunities
Our goal is to provide analysts the tools they need to audit drone flight paths directly within SkyVision.
The follow How Might We statements guided the remainder of my process:
HMW support analysts in determining which areas of their pipeline are due for re-monitoring so that they can alert the flight crew?
HMW eliminate the need for analysts to export data and upload it into Google Earth?
DESIGN EXPLORATION
The challenge: make it simple
The 3 different ways drone flight paths could be presented on map.
The easiest way for analysts to find missed areas is by visualizing the drone flight paths. I thought of 3 different ways to present them on a map.
I chose the third option of showing only the 'latest known' flight paths because my research showed this critical information was difficult to determine on Google Earth. In fact, this was the second more time consuming step. My solution was two fold:
PIVOT
Overcoming technical limitations
I couldn't wait to share my solution with my developers!
Unfortunately, I learned the developers discovered a major technical limitation with our mapping system: drone flight paths aren't associated with the oil pipeline overlay.
This impacted my design solution in the following ways:
The 3 different ways drone flight paths could be presented on map.
REDEFINING DESIGN GOAL
Back to the drawing board
The new challenge was to simplify the flight paths in an intuitive way so analysts can easily find the missed areas.
I created two new how might we questions to guide my solution ideation:
HMW enable analysts to find the information they need from the flight path visualization?
HMW provide the right choices at the right time rather than presenting all the possible choices all the time?
DESIGN EXPLORATION
Second attempt to solve the problem
I took a great deal of time and care designing the flight path visualization in a way that would be helpful and insightful. Repeated iterations of using real data helped me get closer to my analysts' goals.
Helping analysts find missed areas for pipelines with different monitoring cadences
I learned pipelines are monitored at different cadences. For instance, pipeline A is monitored every week and B is monitored once a month. Because of this, analysts downloaded files for custom date ranges.
The flight path date range modal allows analysts to narrow down flight paths by a pre-selected date range or a custom range. Date range options were thoughtfully selected based on each customer's oil pipeline monitoring cadences.
To the right you can see the three designs I came up with. I chose the second one because it takes up the least amount of space on the map.
Saving analysts time by reducing cognitive load
Analysts spend the most time distinguishing missed areas amongst the overlapping flight paths in Google Earth. I alleviated this pain point by:
In the same way Google docs only highlights the misspelled words, I made it easier for them to spot missed areas by emphasizing them. The legend highlights flight paths that are older than the common pipeline monitoring cadences.
Reduced cognitive load by making the colors more intuitive; recent flight paths are green and older ones due for monitoring are shades of red.
The final solution showing flight paths that occurred in the last month. Analysts can easily find the missed areas highlighted in orange.
DESIGN ITERATION BASED ON FEEDBACK
Redesigning the left side panel
As I tested out my flight visualization feature with real data, it was clear the left side panel needed to be redesigned.
Analysts couldn't easily view nor access the 3 different cards with the existing design. 3/3 power users frustratingly assumed they couldn't access details pertaining to flight paths during user testing because they couldn't find the flight cards.
Here's a quick preview of the major changes I made to create a seamless experience between the new flight visualization feature & left side panel:
After receiving negative feedback about long loading times, I redesigned loading indicators.
FEEDBACK
Loading no more - revamping loading indicators
Overall analysts were thrilled about the flight path filter and the color-coded paths but we received some feedback on long loading times between searches.
I closely worked with the developers to understand how data is loaded and redesigned loading indicators.
I improved the loading indicators so that they provide clear feedback on what was loading. We also created a new story so that the developers could investigate the root cause of the performance issue.