|
8 | 8 |
|
9 | 9 | ## Milestone 2 (Friday 1st May, 5pm) |
10 | 10 |
|
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 number of crashes for a given aircraft, airline, destination, etc, across the years, using 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. |
29 | | - |
30 | | -<img src="comparison_visualization.png" width="600" height="auto"> |
31 | | - |
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 treemap would help establish a clearer sense of scale for this information. By showing the percentage of crashes per country and per continent (as we include both levels of granularity), the visualization highlights the relative distribution of crashes, which can be easily compared visually through 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 | | -Visualizing 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 relationships, 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. |
| 11 | +The report for Milestone 2 can be found here: [Milestone2.pdf](Milestone2.pdf) |
63 | 12 |
|
64 | 13 | ### Website prototype |
65 | 14 | The initial implementation of our website with the basic skeleton of the visualization/widgets is running live at the following url : |
|
0 commit comments