A data viz project exploring driving test pass rates across the UK.

Twitter 💬   |   LinkedIn 👔   |   GitHub    |   Website 🔗

For many, passing their driving test enables them to travel across the country whenever they want to. The structure of the practical driving test remains the same across Great Britain but the amount of traffic, number of roundabouts, and potential hazards vary from place to place.

Using data from the DVSA, I have crafted this informative map of 300+ driving test centres pass rates across Great Britain. With the data provided candidates can see their chances of passing their practical driving test at nearby centres.

Two data sets are required for this viz:

• Pass Rates by Test Centre
• Test Centre Locations

'Pass Rates by Test Centre' is downloaded as a .ods file, I've converted this to a Microsoft Excel file as it was planned to reshape the data with Python but the process is a one-off and would have been more time consuming than manually reshaping this dataset.

Below are the sets I took to reshape the data into driving_tests_map.xlsx

1. Clean up yearly tabs for Pass Rates by Test Centre, removing any blank columns, keeping only the total rows for each test centre, and adding the date range for the data.
2. Consolidate all the tabs into one tab 'Historical Data', so we have all the data in one place, columns should be: Test Centre, Date, Male - Conducted, Male - Passes, Male - Pass rate (%), Female - Conducted, Female - Passes, Female - Pass rate (%), Total - Conducted, Total - Passes, Total - Pass rate (%)
3. For Test Centre Locations add to the Excel file and reduce to test centre name, lat and long
4. Clean up test centre names in 'Historical Data', some names are also inconsistent between the locations.
5. Create three tabs, 1. A location lookup table 2. Pass rates by location for April 2020/2021 (looking up locations from the location lookup) 3. Historical pass rates by location
6. In Tableau size and check the test centre location squares, aiming to have square visible from a distance.
7. For overlapping test centres, create separate zoomed-in maps for cities, in other cases editing the lat and long data to nudge the square location so the data is clear (a rough location is fine for this viz)

For this viz I want to show 4 variables:

• the location of the test centres on a map of the UK (latitude and longitude)
• how the driving tests pass rates differ from the national average
• whether men or women are more likely to pass their test at this test centre

Encoding

• Using the location to place the test centres on the map,
• I have created a sloped area chart to show the difficultly, i.e. an uphill slope indicates a relatively harder test.
• To show gender I have coloured the red, blue and black, for female, male and no clear advantage.

Detailing all of this information in the legend at the top of the map, with tooltips to help explain the data points so the users don't have to check the legend when viewing test centres in the South of England.

Two charts types are used in this dashboard:

• the beeswarm plot
• the difficulty tiles (boxes)

The beeswarm plot generally follows the tutorial from Ken Flerlage: Creating a Basic Beeswarm Plot in Tableau

Notes for this specific build:

• Total pass rates are rounded and converted to integers INT(ROUND([Total - Pass rate (%)],0))
• A reference line for the national average was added and then rebuilt in Figma so the line didn't overlap the data points
• Adding a categorical colour palette caused calculation issues with the plot, I worked around these issues by using a custom sequential colour palette taking the values -1, 0, or 1 and adding the following to my Tableau preference.tps file between the <preferences> tags:

<color-palette name="Driving test" type="ordered-sequential" >
  <color>#7196ff</color>
  <color>#333333</color>
  <color>#f55343</color>
</color-palette>

Lastly, all text (notes, reference line, axis values, legend) were all created in Figma and layered underneath this plot, with the plot background set to None.

The tiles are constructed using Tableau's new feature called map layers, essentially 4 separate components are drawn and layered on top of each other, they are:

• A background square (polygon) - a white background so the data stands out
• A slope chart (polygon) - how difficult the test is compared to the national average
• An angled car shape (shape) - so the car looks like it driving on the slope
• A blank foreground square (polygon) - giving ease of access to tooltips

In the dataset driving_tests_map.xlsx, I have created additional datapoints to build and path the polygons for the map layers. In the tab driving_tests_map I added the following fields to build the polygon elements:

• [X, Y, Path] - draws the polygon shape
• [Element] - filters between the background polygon and slope polygon
• [Dataset] - filters for polygon data and the actual data set used for tooltips and calculations

The boxes are finished off by the tooltip detailing the test centre name, pass rates for overall and by gender, with a viz in tooltip sheet showing the historical trend for the test centre.

Mapbox studio is a great place to build custom-style maps for Tableau to give your work a unique look and feel.

Map Preview

In Mapbox studio > New Style > Under Components

• Change Base, Greenspace and Greenspace Label colour to #b6d1a3
• Change Roads to #f2eeee
• Change Water to #e6f9f8

Note due to the number of maps on show (8) and being featured on VOTD means I exceeded the free tier API usage, so had to reset my API key and revert the maps to the standard free versions available with Tableau.

I've used Figma to build:

• Car icons
• Background

In Figma, I constructed sample slopes at angles from +45 to -45 incrementing by 5 degrees in 100x100px squares. I then positioned the car icon on the slope in the centre of the square. I then hid the slope, made the squares transparent and exported the car icons so they are all sized the same.

Car Icon source from Freepik

The background consists of the map of Great Britain, all text objects, and callouts for the additional maps.

The process involves creating a background image in Figma with the same dimensions as the dashboard being made, tiling this image on the dashboard removing any padding and disabling the fit to space option. Assets in Tableau such as charts are then floated on top of the background, using the layout option you can make these fit pixel perfect to your Figma background. From here there is a lot of back and forth with Tableau, exporting dashboard images, editing the background in Figma until you are happy with the result.

Font used: Nobile

Will Sutton, Sept 2021
Twitter 💬   |   LinkedIn 👔   |   GitHub    |   Website 🔗