1

“Esplora i Cantieri” Implementazione piattaforma OpenCantieri

Manuale descrittivo

Roma, febbraio 2018

2

Premessa 3

Analisi di contesto 3

Funzioni principali della piattaforma 4

Geo Intelligence 4

Data Intelligence 5

Navigazione dell’applicazione 5

Splash Page 6

Home Page 6

Interazione 1 - Mouseover sul cantiere 7

Interazione 2 - Click sul cantiere 8

Dentro il cantiere: nel dettaglio 8

Navigare nel tempo 8

Click sul Point of Interest (PoI) 9

Visionare il cantiere 10

Dentro il cantiere: Data Intelligence 12

Navigazione dalla barra superiore 13

Data Intelligence 13

Geo Intelligence 14

Approfondimento: architettura dei dati - progettazione 15

Template 15

Prodotto Finale 15

Cartografia 15

Data intelligence 16

3

Premessa Il seguente documento intende illustrare le attività svolte per l’implementazione della Piattaforma “Esplora i Cantieri”.

Il progetto ha previsto lo studio grafico, lo sviluppo e l’implementazione di un sito web interattivo per l’analisi e la visualizzazione di dati geografici e open data relativi ai cantieri Torino-Lione (parte italiana) - Cunicolo esplorativo de La Maddalena, A2 Autostrada del Mediterraneo (ex A3 Salerno - Reggio Calabria).

Analisi di contesto Il Ministero delle Infrastrutture e dei Trasporti (MIT) nell’ottica di garantire la massima trasparenza sulla propria attività ha sviluppato la piattaforma OpenCantieri (opencantieri.mit.gov.it), con l’intento di aumentare la consapevolezza dei Cittadini in relazione alle opere strategiche avviate dalla Pubblica Amministrazione.

In OpenCantieri è presente una informazione aperta, completa e aggiornata sul processo di realizzazione delle infrastrutture pubbliche censite e geolocalizzate.

Con il documento “Connettere l’Italia” (Allegato Infrastrutture al DEF 2016 e 2017), il MIT ha avviato un processo di riforma della pianificazione e della programmazione delle infrastrutture in Italia, partendo dalla definizione degli obiettivi, delle strategie e delle linee d’azione per proseguire nelle riforme strutturali del settore, e realizzare le politiche necessarie per l’implementazione della Visione del Sistema dei Trasporti e delle Infrastrutture al 2030.

Il nuovo approccio alla politica infrastrutturale del MIT pone al centro i fabbisogni dei cittadini e delle imprese, e promuove le infrastrutture come strumento per soddisfare la domanda di mobilità di passeggeri e merci (evitando strozzature di capacità e “colli di bottiglia”) e per connettere le aree del Paese (in particolare le città, i poli industriali ed i luoghi di maggiore interesse turistico) attraverso interventi utili allo sviluppo economico e proporzionati ai bisogni.

In linea con tale concezione “servente” dell’infrastruttura, sono stati definiti quattro obiettivi strategici, pensati per rilanciare la competitività dell’Italia in un’economia globalizzata, in cui assume rilevanza centrale la capacità del Paese di stabilire connessioni e servizi di trasporto e logistica adeguati verso l’Europa ed il Mediterraneo, tali da consentire la piena mobilità di persone e merci e servire alcuni “mercati strategici” specifici, rappresentati dai luoghi di lavoro, poli turistici e attrazioni culturali. (fonte Allegato MIT al DEF 2017).

Gli obiettivi sono stati così articolati:

● Accessibilità ai territori, all’Europa e al Mediterraneo; ● Qualità della vita e competitività delle aree urbane;

4

● Sostegno alle politiche industriali di filiera; ● Mobilità sostenibile e sicura.

Le linee guida del piano Connettere l’Italia e i portali OpenCantieri e OpenData del Ministero delle Infrastrutture e dei Trasporti rappresentano le fonti principali per l’elaborazione dei dati e delle informazioni della presente piattaforma.

Tra le fonti utilizzate si devono considerare anche DIPE – Presidenza del Consiglio dei Ministri, Anas, Istat, Assoporti, Silos (Camera dei Deputati), siti web TELT-Sas e Autostrada del Mediterraneo.

Funzioni principali della piattaforma La costruzione di una narrativa storico-geografica dei due cantieri strategici ha previsto lo studio e lo sviluppo di due principali funzionalità all’interno della piattaforma:

● Geo Intelligence o Visualizzazione di dati geografici (Geo mappa, Geo 3D, Geo storia)

● Data Intelligence o Analisi di dati relativi a informazioni provenienti da fonti eterogenee (Anas, Istat,

Assoporti, Silos, TELT-Sas, OpenData MIT)

Geo Intelligence La Geo Intelligence ha come obiettivo principale l’individuazione da parte dell’utente di dati geografici su mappa e con distinte forme di visualizzazione.

I servizi di analisi dei dati geografici realizzati sono:

● Geo storia: navigazione temporale di immagini satellitari statiche rappresentative del territorio in cui sono presenti i cantieri selezionati. L’utente ha la possibilità di visualizzare il cantiere di interesse attraverso immagini satellitari, scorrendo nel tempo le immagini stesse (“prima” e “dopo”).

● Geo mappa: visualizzazione cartografica interattiva di mappe e di dataset nazionali, che consente un alto grado di interazione e la possibilità di approfondimento dei contenuti grazie alla consultazione di statistiche. Le interazioni all’interno delle carte sono gestite interamente attraverso la libreria open source e mobile-friendly Leaflet V.1.2.0.

● Geo 3D: progettazione e visualizzazione 3D. La costruzione 3D permette all’utente di conoscere informazioni relative al cantiere di riferimento in modalità interattiva e navigabile.

5

Data Intelligence La Data Intelligence ha come obiettivo la raccolta di dati e la loro contestuale elaborazione mediante infografiche interattive.

Il servizio ha previsto la definizione dell’ambito tematico della ricerca inerente fenomeni di attualità, fatti che calamitano l’attenzione dell’opinione pubblica, eventi nazionali ed internazionali, argomenti che a vario titolo sono di interesse rispetto agli ambiti del progetto. In via ulteriore è stato individuato l’intervallo temporale di analisi, la definizione delle chiavi di ricerca (parole chiave, hashtag, account in base ai quali vengono identificati i flussi informativi da analizzare), elaborazione dei dati estratti e definizione dei risultati e la visualizzazione di questi ultimi. Infine, il servizio si è soffermato sulla narrazione dei risultati per la valorizzazione dei contenuti.

L’analisi di Data Intelligence si è soffermata su:

● Il bacino del Mediterraneo e i porti italiani ● La posizione dell’Italia nei traffici del Mediterraneo ● Calabria: flusso merci (dati Istat) ● Osservatorio sul Traffico: aumentano i veicoli al Sud ● Discussioni sui social media intorno ai temi Salerno - Reggio Calabria e Autostrada del

Mediterraneo ● La TAV Torino Lione su Twitter ● I Tweet di Telt Tunnel (Account Twitter ufficiale della Torino - Lione), focus sulla costruzione

della Torino Lione ● La Torino-Lione e l’ambiente (livello di impatto ambientale e acustico, vibrazioni).

L’implementazione delle suddette funzionalità sarà descritta in dettaglio nel prossimo capitolo.

Navigazione dell’applicazione Il capitolo che segue intende descrivere in dettaglio il processo di navigazione dell’applicazione web “Esplora i Cantieri”. La progettazione dell’interfaccia ha previsto uno studio di User Experience Design e User Interface Design volto a garantire la migliore navigazione per l’utente.

In questa fase sono stati analizzati i seguenti ambiti:

● User Experience (Personas e Scenarios) ● Information Architecture (alberatura contenuti, flowchart, architettura tech) ● Navigation Flow (desktop, mobile)

A partire dall’analisi degli Scenarios, si è individuata la funzione principale dell’applicazione: la costruzione di una narrazione-storia per ciascun cantiere, in grado di evidenziare le potenzialità

6

delle opere a partire dalle connessioni prodotte o dal miglioramento socio-economico generato.

Splash Page La Splash Page è la pagina di benvenuto con l’obiettivo di illustrare visivamente il concept del sito. Al click, l’utente potrà entrare nel vivo della piattaforma “Esplora i Cantieri”. Una Freccia verso il basso lo invita a proseguire la navigazione.

Home Page

L’utente è in grado di esaminare su mappa tutti i cantieri attivi in Italia con la possibilità di filtrare per area o tipologia. L’utente può filtrare per: zona (nord - centro - sud) e tipologia (strade - ferrovie - città metropolitane - porti - aeroporti - ciclovie).1

1 Attualmente, l’utente ha la possibilità di filtrare soltanto i due cantieri analizzati.

7

Interazione 1 - Mouseover sul cantiere

Al mouseover su un cantiere l’utente potrà vedere un breve focus di dettaglio con i principali dati dello stesso.

L’utente accede al dettaglio del cantiere cliccando sulla mappa, sul suo nome o, in alternativa, proseguendo con la freccia in basso.

8

Interazione 2 - Click sul cantiere

Al click l’utente accede al dettaglio del cantiere di interesse. Le informazioni sul cantiere selezionato vengono visualizzate all’interno del box.

Dentro il cantiere: nel dettaglio

All’interno del cantiere, l’utente può compiere diverse azioni:

➔ Navigare nel tempo ➔ Visionare il cantiere

◆ In numeri ◆ Nel tempo ◆ In 3D

Navigare nel tempo

Dallo slider in basso a sinistra l’utente può definire l’intervallo temporale di interesse e di conseguenza veder riportati su mappa i punti di interesse di quel determinato periodo.

9

Click sul Point of Interest (PoI)

Al click su un PoI l’utente può osservare (attraverso lo slider a comparsa) l’evoluzione temporale di quel determinato intervento. L’utente può osservare le fasi di avanzamento e conclusione dei lavori attraverso foto satellitari del “prima” e del “dopo”.

10

Visionare il cantiere L’utente può navigare all’interno delle 3 sezioni principali relative al cantiere.

- La sezione “Il cantiere in numeri”, descrive il cantiere secondo dati numerici, ricavati da fonti ufficiali.

- Il cantiere nel tempo fa “viaggiare” l’utente all’interno della storia del cantiere attraverso le date più importanti (scelte in concomitanza dell’apertura di punti di interesse).

- Il cantiere in 3D infine permette una navigazione della mappa a 360 gradi e riporta i dati del cantiere d’interesse sotto una veste diversa ed interattiva.

11

L’utente nella sezione 3D può visualizzare per ogni singolo cantiere selezionato (oggi due), i 6 indicatori presenti anche nella piattaforma OpenCantieri, ma con una grafica assolutamente diversa. Interagendo con il grafico può leggerne i dettagli nell’apposita finestra.

12

Dentro il cantiere: Data Intelligence

L’utente può accedere alla sezione Data Intelligence dedicata alla visualizzazione delle infografiche dei dati raccolti e analizzati. I dati si riferiscono a diverse varietà di fonti offline e online. L’utente può navigare - con scroll orizzontale - all’interno delle infografiche inerenti quel determinato cantiere. L’utente può interagire con i grafici ed i dati per esplorare al meglio il contenuto.

13

Navigazione dalla barra superiore

Data Intelligence

L’utente può accedere alla sezione dedicata alla Data Intelligence direttamente dal Menù per avere una breve panoramica della materia e poi selezionare il cantiere interessato.

14

Geo Intelligence

L’utente può accedere alla sezione dedicata alla Geo Intelligence direttamente dal Menù per avere una breve panoramica della materia e poi selezionare il cantiere interessato.

15

Approfondimento: architettura dei dati - progettazione

Template Il portale è progettato con uno sviluppo in parallelo tramite il plugin open source pagePiling ed ottimizzato responsive e browser compatibility con il framework open source bootstrap, il plugin open source pagePiling ed il framework Meterialize. La struttura del portale si sostiene su una struttura HTML - CSS - JS con una suddivisione tematica per cartelle. I due file cardine per i comportamenti javascript sono compilati tramite la libreria open source jQuery.

I font utilizzati sono open source e richiamano le API di Google Fonts. Le icone utilizzano il framework Materialize. Per la creazione degli slider temporali è stata impiegata la libreria open source, responsive e browser compatibility nouislider. L’immagine della pagina di benvenuto (Splash Page) è stata ripresa dal portale unsplash con licenza free.

Cartografia Il tile server open source utilizzato è OpenStreetMaps.

Le interazioni all’interno dalle carte sono gestite interamente dalla libreria open source e mobile-friendly Leaflet.

Le immagini satellitari sono delle stampe ottenute tramite il software free Google Earth Pro ed elaborate tramite il tool open source juxtapose.js mentre, per la restituzione grafica, è stata impiegata la libreria open source, responsive e browser compatibility fancyBox.

La realizzazione delle polyline relative ai tracciati dei cantieri in formato .geojson, la realizzazione degli elaborati in 3d sono state effettuate tramite il software di sviluppo GIS open source Quantum GIS. La realizzazione grafica della carta in 3d è stata effettuata mediante il plugin open source e mobile-friendly Qgis2threejs contenuto all’interno di Quantum GIS. Il plugin Qgis2threejs utilizza la tecnologia WebGL per la renderizzazione 3d degli elementi tramite browser.

La carta dei confini amministrativi dell’Italia, presente nella visualizzazione in 3d, è stata scaricata dal portale Open Data Istat. Per il lavoro è stata presa in carico la versione “generalizzata” - “ WGS84 UTM32N” - “anno 2016”.

16

Data intelligence Il carosello di visualizzazione è il plugin open source e mobile-friendly Owl Carousel mentre la creazione dei grafici è affidata alla libreria javaScript open source e mobile-friendly chart.js.