Delta Route Map

This project is a map designed to inspire travelers to explore destinations and plan their next trip.
Delta wanted to create a pre-trip inspiration experience for customers to investigate flight options within Delta’s network. The goal was for customers to be able to search Delta and SkyTeam partners’ flight options, filter available routes based on multiple criteria, and make the selection that is best for them.

Delta Flight Map

The Delta Flight map displays all of the airports from which Delta and its partners operate, and highlights Delta hubs.
By default, all airports are shown, but travelers can use the filter bar to select a point of origin and explore possible destinations.

Upon zooming in, detailed information becomes visible such as city, state, and airport names.
When a traveler hovers over an airport, a widget displays details about that location.

Airport Markers

Airport markers indicate the location of available airports on the map.
Different styles of markers were designed to help travelers navigate their options and selections as they explore flights.

Unselected Airport Indicators
There are three types of indicators for airports which are not currently selected.

Selected Airport Indicators
There are six types of indicators for airports which have been selected.

Stacking Order

We also defined logic for how initiators will overlap.
All location indicators may only be overlapped by 35% of its width.


The stacking order of unselected locations is: 
Hub indicators on top layer, followed by cluster indicators, and standard indicators on the bottom layer. 


Once a location has been selected as origin or departure, that indicator will move to the top stacking layer.

Filters

There are a number of ways travelers can filter their destination options.
In it’s collapsed state, the filter bar allows travelers to enter an origin and destination location. There is also an option for travelers to select from categories such as “Beaches”, “Fine Dinning”, or “Kid Friendly” to narrow search options.

Once expanded, the filter bar displays additional filtering options including flight operator, number of stops, and travel duration. As travelers make their selections, the map will update to display only the destinations which meet the selected search criteria.

List View

Travelers can also view search results in a list view sorted by region. All regions are selected by default, and travelers can tab to specific regions to focus only on the destinations in that region.

Within each region, results are surfaced in clickable tiles, displaying the name of the city/state and country along with the airport code. The cities will update as travelers make filter selections.

Airport Selection

Once both an origin and destination have been selected, a details card appears displaying additional information about the destination airport and routes to the selected destination.

In this details card, travelers can see all possible route for the journey including direct and indirect flights as well as Delta operated and partner operated flight options.

If the selected destination has multiple airports servicing it, those airports will appears both on the map and in a dropdown in details card. If a traveler wants to see available routes at nearby airports, they can select another airport from the dropdown menu. Selection of a new airport updates the map routes.

Route Lines

With origin and destination locations selected, route lines display on the map.
When multiple routes are available, the most efficient path of travel is selected by default as a recommendation.

Different styles of route lines are used to indicate if a route is selected or not, and if the flight is operated by Delta or a partner airline. Travelers can reference a map legend to understand the meaning of the route lines. Routes with more than one stop may contain a combination of Delta and partner operated flights.