Following on with my previous work on a example visualisation of player data, I carried out some more research into the best colour schemes for charts. My initial design was heavily influenced on the current trend for Business Intelligence dashboards to have a dark background. Based on the work of Maureen Stone and Stephen Few, I inverted the colour scheme of the design to provide a neutral consistent canvas for the data.
Here’s the version with a black background and the same one with a light background.
With any project, there is always a feeling that the design can be improved, but given the time constraints, I left the design work with the intention on revisiting it in the future (!).
The next step was to mark up the basic html page with a simple gridded design and then use Bootstrap css to speed up the process of styling the page. To start with I used actual content, with a plan to replace these metrics and values with placeholders. The final aim was to make the page completely dynamic so that for example, I could swap the summary data for a player based on broad roles, eg goal keeper, defender, midfield or forward.
Once the content had been defined, I modified the css to mimic the original design. I kept the css within the html page initially, purely due to the convenience of editing it. This is the html5 version. Note that the charts in the page are still image placeholders. Again the plan is use d3.js to load in the match data and process it to provide dynamic charts for each player.
Another aspects of the design work was to rough out some ideas of the structure / navigation pages for getting to the player page (with pencil and paper). At the moment the work is purely to play around with the technology and try some experiments in visualisation, but it also balanced with the eventual need to refine the data into a understandable/presentable form. (All stuff for the parts bin)
That said, the next part is to spend some more time playing around with d3 and the data. The plan is to build on the heatmap, and track a player’s position through a game and be able to see how they move around the pitch during a game.
Still no word on the #MCFCAnalytics, though I assume the January transfer window is the one of the busiest time of the year for football analysts…