Skip to content

Commit db9f027

Browse files
committed
docs(Milestone2): Wrote the report for Milestone 2 and added files for the sketches
1 parent f1874c9 commit db9f027

7 files changed

Lines changed: 49 additions & 3 deletions

milestones/milestone2/.DS_Store

6 KB
Binary file not shown.

milestones/milestone2/MILESTONE2.md

Lines changed: 49 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,58 @@
88

99
## Milestone 2 (Friday 1st May, 5pm)
1010

11-
### Early sketches and tools/lectures we will use to implement each of them
12-
Comparison of different aviations actors and their correlated incident/accident records :
11+
At flight inspectors, we will seek to illustrate the risk of flying through the lens of various different factors. More specifically, we’d like to implement visualizations to make sense of the effects that the different variables have on flight accidents. How has safety increased throughout the years? Are some airlines or manufacturers more prone to crashes? Are there cities that are noticeably dangerous to fly in or out of? Our website will be ordered to sequentially display visualizations that explore these points, finishing with an interactive plot where users will be able to select the variables and estimate the crash risk for a custom flight.
12+
13+
14+
The skeleton of our core visualization can be found at the end of the page.
15+
16+
### Early sketches and tools/lectures we will use to implement each of them
17+
18+
#### Sketch 1: Biggest actors involved in plane crashes
19+
20+
This bubble plot will display the amount of crashes for a given, aircraft, airline, destination, etc, across the years, thanks to a dropdown for the category and a slider for the year. The size shall be scaled with the number of incidents, highlighting the riskiest variables.
21+
22+
<img src="top_actor_visualization.png" width="600" height="auto">
23+
24+
For this visualization, we will make use of the *5_1_Interaction*, *6_1_Perception_colors* and *10_Graphs* and *D3.js* lectures along with library of the same name.
25+
26+
#### Sketch 2: Comparison of different aviation actors and their crash records
27+
28+
This visualization will enable users to compare the influence of different actors on plane crashes. For instance, it can be a helpful tool if you'd like to compare the safety of fierce rivals like Airbus and Boeing over the years.
1329

1430
<img src="comparison_visualization.png" width="600" height="auto">
1531

16-
For this visualization, we will make use of the *10_Graphs*, *5_1_Interaction* and *D3.js* lectures along with library of the same name.
32+
For this visualization, we will make use of the *5_1_Interaction*, *10_Graphs* and *D3.js* lectures along with library of the same name.
33+
34+
#### Sketch 3: Heat- and tree-maps of plane crash locations
35+
36+
With the heatmap, we can geographically represent where most crashes happen, allowing the user to take that into consideration when planning a flight route. The tree map would help establish a clearer sense of scale of this information. Through the percentage of crashes per country and per continent as we include both of these division granulities, the visualization shows the relative distribution of crashes, easily visually comparable by the rectangle size.
37+
38+
<img src = "crash_locations_visualization.jpg" width="600" height="auto">
39+
40+
For this visualization, we will make use of the *5_1_Interaction*, *8_1_Maps*, *10_Graphs* and *D3.js* lectures along with library of the same name.
41+
42+
#### Sketch 4: Globe displaying flight routes where planes have crashed
43+
44+
Visualizaing a globe enables us to have more realistic perception of flight routes, to see over which countries the flight route leads, which would be hard to represent on mercator map. The slider below the globe enables the user to select specific periods of time that they are interested in representing on the globe.
45+
46+
<img src = "globe_visualization.jpg" width="600" height="auto">
47+
48+
For this visualization, we will make use of the *5_1_Interaction*, *8_2_Practical_Maps* and *D3.js* lectures along with library of the same name.
49+
50+
#### Sketch 5: Predictive model: Custom flight risk estimator
51+
52+
For the main product of our website, we aim to create a predictive modeling tool which will let the user input the details of a flight and return a Poisson distribution curve detailing the probability of that specific flight having x accidents over a certain period of time. The intent behind this visualization is to allow users to evaluate the danger of a custom flight based on the data that we have.
53+
54+
<img src = "predictive_model_visualization.png" width="600" height="auto">
55+
56+
For this visualization, we will make use of the *5_1_Interaction* and *D3.js* lectures along with library of the same name.
57+
58+
#### Extra sketch: Relationship graph between origin and destination of flight routes
59+
60+
<img src = "directed_chord_visualization.png" width="600" height="auto">
61+
62+
This visualization would be a directed chord diagram linking the different intended routes of flights that crashed. The idea would be to get an understanding of which cities are most dangerous to fly to or from, as in a densely populated graph like this one, considering we would have around 4000 relations, cities with the most connections should easily stand out. However, this may mean that the visualization would be too cluttered and illegible, thus we might have to resort to classifying cities based on their country or continent, which is doable but potentially slightly irrelevant. Therefore, we may scrap this visualization if we finally deem it to be uninteresting. This will require lectures on graphs and colors and marks.
1763

1864
### Website prototype
1965
The initial implementation of our website with the basic skeleton of the visualization/widgets is running live at the following url :
223 KB
Loading
649 KB
Loading
99.3 KB
Loading
503 KB
Loading
440 KB
Loading

0 commit comments

Comments
 (0)