Swing Analytics

VISUALIZE YOUR GOLF SWING AND SEE WHICH GOLF PRO IS MOST SIMILAR TO YOU

Project description
Created:

May 2015

Reason:

The Deloitte Ladies Open
Golf Tournament

Tools:

D3.js

Data:

Original Golf Pro and Peer Group data provided by Trackman
This online version contains completely randomly generated data

Because Deloitte sponsors the Deloitte Ladies Open golf tournament in the Netherlands we wanted to do something with “Swing Analytics” as the analytics department. The idea was to work together with Trackman and use their equipment together with a program that we would create to test visitors and see which golf pro was most similar to them in terms of their swing. The Trackman is a very nice tool that tracks a horde of measurements from each golf swing, such as club speed or carry.  I don’t know who came up with the idea, because I wasn’t involved from the very start, but the hashtag #WelkeGolfProBenJij (translates as #WhichGolfProAreYou) had already been thought of by marketing when I came on.

I created the front-end while two other colleagues worked on the back-end making sure that the connection to the Trackman API existed and the data of each swing would be loaded into the webpage. I split the front-end into 4 separate screens.

  • The first is a “waiting” screen with a green pulsating dot, Deloitte’s signature mark, that sort of wants to be touched (we first expected that the screen at the tournament would be a touch screen). Here the participant is explained what the idea is of #WhichGolfProAreYou.
  • Next is a screen where the participant defines their Peer Group. This is needed so we can compare how well the participant did relatively. If they wanted to receive screenshots of their end results, they could also fill in their e-mail and twitter.
  • The third screen is where the action happens. Now the participant will actually (try to) hit the ball. After each swing the Trackman API would supply 5 predefined variables about the swing: club speed, ball speed, carry (how far did the ball go before touching the ground), side (how far to the side did the ball go before touching the ground) and attack angle (the angle with which the club hits the ball). Each of these variables is then build up on the four charts on the screen (carry and side are in the same chart). I used an SVG gooey effect to create a more interesting transition where the big green dot at the start seems to “eject” the small green dot towards the eventual value (here you can find a tutorial on how to create such a gooey effect)
  • After about 5 swings the participant was ready and the fourth screen would be shown. Here the participant could see which golf pro was most similar to them. I created a radar chart so the participant could see how their average value on the 5 variables compared to the golf pro (i.e. how much their green “blob” looks like the golf pro’s blue blob).
    Because golf pros are so much better than any amateur we needed to find a way to make a comparison possible. Luckily through Trackman we had access to the average scores and standard deviations of several amateur peer groups based on gender, age and handicap, the 6 Dutch golf pros (3 male, 3 female) and average scores of many golf pros from around the world combined. By using this information, we could calculate how each of the 6 Dutch golf pro’s performed compared to the world golf pros. Was Joost Luiten better on average with his club speed than a typical male pro, and if yes, by how much? We could do the same with the participant and his or her peer group. Perhaps club speed was also better for the participant compared to his or her peer group.
    By using these two comparisons of the participant and golf pros to their respective peer groups we could compare an amateur to a pro (more technically: we used z-scores and calculated the Euclidean distance between the participant z-scores and the z-scores of each of the 6 pros to see which was most similar).
    It’s actually the z-scores that are visualized on the radar plot. The grey line is the peer group of both and thus by design exactly in the center. The participant is the green blob. A score that is smaller than the grey peer group line means that they performed worse and a score above the grey line means they scores better than expected.
    On the right you can see the actual values of the participant’s swing and what their strong points are and on what points they could improve

The data that is used in the online version that I created as a showcase is completely made up and swings are randomly generated for each swing. I also attached a few introductory steps to each screen in the showcase version so you know what to do and what everything means (with intro.js).

I tried to create something with a rather clean feel. Not too many colors (two colors, Deloitte green and blue, and many grey shades), green circles repeated throughout and a lot of white space. To counter that I put in some visuals and transitions that are aesthetically appealing or different than usual and interesting to look at. Being able to quickly get insights from all the plots was less important here. It was more of a gimmick for the visitors to the tournament. Although in the end I do feel that you can still easily analyze a swing with all the charts available.

The event at the Deloitte Ladies Open on June 19 – 21, 2015 was a big success and the participants loved to see all the statistics of their swing being brought to life on the screen. Therefore, we are going to reprise at the KLM open (the guy version of the tournament) this september!

Project
Details