Process book

Content

In this process book, we will show our progress throughout the realization of this project, week by week. For each of them, you will find our advancement on data preprocessing, design, implementation and choices for the future.

Week 1

31/10 - 06/11

The first week of work in this project was dedicated to the composition of a group of 3 students and to agree on the subject of our visualization. Our team is composed of 3 exchange students, we all are from the same home University and we have known each other before. We did not want to combine the ADA project (CS-401 @EPFL) and the Data Visualization because we were afraid that the deadlines might be not compatible.

Looking at the available datasets online helped us to pick a subject. We found on Kaggle a dataset on listing airplane crashes between 1908 and 2009. It caught our attention as the idea of developing a visualization using a map was interesting for us.

Starting from there, we created our GitHub repository with a basic skeleton of the project, and then got the useful resources, such as the dataset and data for the map.

Week 2

07/11 - 13/11

During the second week, we agreed on the expected result of our visualization. The idea is to have a map showing all the airplane crashes from 1908 to 2009 as circles on a map, the radius of the circle represent the fatality. For the visualization to be interactive, the user will be able to zoom and drag on the map, a click on any crashes on the map will show a tooltip with some more information. Below the map, we plan on drawing a timeline of all the airplane crashes over time. The timeline will be brushable to allow the user to display on the map only the crashes on the selected time period. We also started to preprocess the data using python and a jupiter notebook.

• Organisation of our work
• Clean data to have location of each crash (google maps request)
• Display dots on map

Week 3

14/11 - 20/11

** Semaine du proposal ?? ** On week 3, we started to work on the visualization itself. We first had to find a topojson file of the world for our map, define the scales and draw the axis for the timeline. Our first visualization was using svg elements a map with circles and a timeline of the number of crashes per year. One can see details of the each crashes on a tooltip, zoom in and zoom out on the map, also drag and reset to default view. The result is eactly what we wanted to implement but the performance not good at all. The visualization lags, there is a delay between the actions on the map and the result. We will need to find a solution to this on the coming week.

Week 4

21/11 - 27/11

In order to improve the performance of our visualization, we decided to replace the svg element defined for the map by a canvas. We also refactored the code to be more easily readable using classes.

Week 5

28/11 - 04/12

This week, we focused our effort on the design of the visualization. We choose the background color for the webpage and the shape of the map, a font family from the Google font etc … We also fit the visualisation to the/any screen size. Issue :

• color by company not a good idea -> more than 10 colors. color by cause ?
• overlap of crashes

Week 6

05/12 - 11/12

Added tooltip when click on any crash on the map. Picking

Week 7

12/12 - 18/12 Focus on the story telling. We added some information about airplane history to the visualization, explain the increase of the number of airplaine crashes some years ( war ...) Tweaked the design