1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado...

21
Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini Aprile 2007 1 Introduzione ai nuovi sistemi visuali 1 – Generalità 2 – Metafore per i portali visuali 3 – Coremi 4 – Spiegando i cammini con foto 5 – Web Mapping 6 – Conclusioni 1 – Generalità Visual Information Systems • Sistemi visuali d’informazioni – Linguaggi visuali – Informazioni multimediali – Portali visuali • Sistemi d’informazioni visuali – Database d’immagini – Geomatica – ecc 2 – Metafore per i portali visuali Portale = sistema d’ingresso per un sistema informativo Un buon portale = un portale che consente di accedere a tutte le informazioni, secondo vari punti di vista Problema: come organizzare i portali?

Transcript of 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado...

Page 1: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 1

Introduzione ai nuovi sistemi visuali

• 1 – Generalità• 2 – Metafore per i portali visuali• 3 – Coremi• 4 – Spiegando i cammini con foto• 5 – Web Mapping

• 6 – Conclusioni

1 – Generalità

• Visual Information Systems• Sistemi visuali d’informazioni

– Linguaggi visuali– Informazioni multimediali– Portali visuali

• Sistemi d’informazioni visuali– Database d’immagini– Geomatica– ecc

2 – Metafore per i portali visuali

• Portale = sistema d’ingresso per un sistema informativo

• Un buon portale = un portale che consente di accedere a tutte le informazioni, secondo vari punti di vista

• Problema: come organizzare i portali?

Page 2: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 2

http://puebla.turista.com.mx/ Che cos’è un sitemap?

• Struttura che consente di accedere a TUTTE le informazioni e a TUTTI i servizi del sito web

• Portali: selezione delle informazioni i piùimportanti

• Relazioni tra portali e sitemap• Metafora della rivista

– Copertura = portails– Indice = sitemap

Metafore visuali

• Lista dei servizi• Hall (d’amministrazione) in prospettiva• Città virtuale

http://www.silkroaddance.com/

Page 3: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 3

Portaleorientatoai temi

http://www.cnrm.meteo.fr/present/present.htm

Confluences - Lyonhttp://confluences-lyon.cef.fr/accueil.htm

http://perso.wanadoo.fr/ist-leonardoparis.org/mappa http://www.aisee.com/png/sitemap.htm.

http://www.forum.mn/ http://www-utenti.dsc.unibo.it/~bergonzi/ig/mappa%20sito.html

Page 4: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 4

http://www.tafe.swin.edu.au http://mcc.sws.uiuc.edu/sitemap/sitemap.htm

http://www.cmi-services.org/site_map.html.

http://www.cs.york.ac.uk/search/sitemap.php.

http://www.nsae.com/images/sitemap.gif

http://www.promofit.it/mappa.php http://solar.physics.montana.edu/YPOP/Navigation/Images/sitemap.gif.

http://www.ijrr.org/images/sitemap.gif.

Ipermappe

• (Hypermaps) Links da mappe• Altri nomi

– Mappe cliccabili

– Mappe attive– Immagini mappate

• Zone attive: punti, linee, superfici

http://www.oxfordcity.co.uk/maps/ox.html

Page 5: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 5

Ipermappa dei rischi a Genovahttp://www.provincia.genova.it/pdb/pdb03.htm

Clicando sulla zona desiderata,si ritrova la descrizione dei rischi

Portale basato su foto aeree (Venizia)

http://www.comune.venezia.it/urbanistica/fotopiano/VenCS.htm

Metafora delle linee di metroMetafora delle mappa

della metro• Semplificazione del mondo reale• Familiare• Caratteristiche

– facile da trovare il suo cammino

– direzioni orizzontali e privilegiate verticali

• Organizzazione dei modi di navigare nelladocumentazione

Page 6: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 6

Guida di Londra

http://www.eu-seniorunion.info/it/sitemap.htm

http://www.multimap.com/images/ps/misc/sitemap.gif,

http://www.germinus.com/mapa.htm http://www.passado.be/

Portale di Edimburgo (Scozia) http://www.edinburgh.gov.uk

Città di Palermo

Page 7: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 7

http://www.nettuno.it/bologna/MappaWelcome.html

Zurich Municipal Portalhttp://www.zurichmunicipal.com/

Portale Rigatoni : Riga-Cityhttp://www.rigatoni.ch/start.html

Disney

Page 8: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 8

http://www.ci.baltimore.md.us/http://www.ci.lynchburg.va.us

http://www.sunysb.edu/ http://www.unh.edu/.

Facciatehttp://www.snv.fr

http://www.bossi.com

Portale del Museo del Louvres

Page 9: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 9

Portale dei musei canadesi Portale del MUVAhttp://www3.diarioelpais.com/muva2/#

Museodelle

Batterie

http://library.thinkquest.org/18775/index.htm

Page 10: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 10

http://www.pips-web.co.uk/pip/home/sitemap/sitemap_t.html.

A evitare !! Conclusioni sui portali visuali

• Importanza dei portali visuali• Accesso globale alle informazioni• Metafore

– Pertinenza

– Leggibilità– Comprensione

3 – Coremi

• Rappresentazione schematizzata di un territorio

• Inventati da Brunet• Fino ad oggi

– I coremi erano disegnati manualmente

• Scopo finale– Generazione automatica dei coremi da

database territoriali (attraverso il data mining geografico)

Due immagini della Francia

Mappa ufficiale conlivelli amministrativi

Una mappa corematica che enfatizzai problemi esistenti

Page 11: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 11

Problema dell’acqua in Brasile

Mappa convenzionale

Zona umida

Zona secca

Deserti

Limiti spartiacque

Limite Sud della foresta tropicale

Vegetazione regolarmente inondataOceano

Stati con un livello d’acqua elevato

Zona con dighe

Mappa Corematica Legenda

Popolazione degli Stati Uniti

Indovinate!

ConoscenzeGeografiche

Data Mining Geografico

Visualizzazione

Mondo realeDatabase oDataware-

housegeografico

Cartografia

Diagramma

Page 12: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 12

Data Mining Geografico (1/2)

• Molte tecniche sono state sviluppate• Trovare una combinazione di tecniche idonee

per la scoperta dei pattern geografici• Differenze tra

– Data mining spaziale• Pattern che sono veri dappertutto

• “Se lago + strada per il lago � ristorante”

– Data mining geografico• Pattern ubicati (pattern spaziale con toponimi)

• “Costa orientale della Spagna è saturata per il turismo”

Data Mining Geografico (2/2)

• Partendo da un database geografico• Lista limitata di pattern geografici

– Può darsi 7 ± 2

• Come definire i pattern più importanti?– Ipotizziamo 10 000 pattern geografici trovati:

come selezionare 7 ± 2?

• Codifica dei pattern geografici– XML, GML, KML, ecc..

Cartes Chorématiques Karla Lopez

47

Architettura proposta

OutputLayout

Initial SDBMS

AdaptedSDBMS

Patterns

Choremdefinition

Format and Structure

Transformation

KDD(DM/SDM)

Chorem/Patternmapping

Pre-Layoutcomputation

ChorML 3

ChorML 1

Interactive LayoutManagement

System

Chorem Visualization

Chorem Extraction

SimplificationGeneralizationChoremization

PlacementChorML 4

OracleMysqlPostgresql-Postgis

DB Tansformation

Layout

ChorML 2

ChorML 0

ChorML 0

Linguaggio ChorML

• Passaggio graduale– dal database originale ai pattern ricavati– dai pattern ricavati ai pattern selezionati– alla mappatura dei coremi

• Esempio 1– Città principale, popolazione, coordinati GB– Cerchio rosso, radio 3mm, coordinate in pixel

• Esempio 2– Flussi di merci tra Milano e Roma– Freccia

Page 13: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 13

Conclusioni sui coremi

• Rappresentazione schematizzata di un territorio– Data Mining Spaziale– Visualizzazione

• Rappresentazione visuale di conoscenzegeografiche

• Riassunto di database geografico• Sistema d’accesso a un database spaziale

4 – Spiegando i cammini con foto

• Spiegazione cammini– Testo– Voce

– Mappe– Foto

Perduto nella Cina! Itinerario basato sulle immagini

• Obiettivo– Dare un insieme di foto per spiegare un

itinerario

– Requisiti preliminari

– Stoccare foto– Rete stradale– Localizzazione delle foto sulle strade

Page 14: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 14

Rete stradale Assegnando le immagini ai nodi

Spiegazioni itinerari

• Non solo un insieme di foto• Come girare, a destra o a sinistra• Soluzione

– Accennare il senso nell'immagine con unafreccia

• Conseguenze– Rilievi dei nodi (= crocevie) nelle immagini– Pixels (x, y) � nodi

Assegnando i nodi alle immagini

Nodoe 345

Nodo 827

Page 15: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 15

Direzioni

• Decorazione d’immagini con le frecce chemostrano il senso seguente, e situate allecoordinate del pixel di nodo

• Foto non decorate• Foto decorate con frecce

Generazione itinerari

• Come da solito– Avviamento di un algoritmo di percoso

• Resulti– Un insieme di nodi e di spigoli– Un insieme di foto decorate con frecce

Page 16: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 16

Itinerari con foto decoratecon frecce

Punto dipartenza

Futuro

• Calcolo automatico delle frecce• Aspetti cognitivi• Soprattutto per i pedonisti• Sistema integrato interiore ad esteriore• Applicazioni ai Physical Hypermedia

Esempio di generazionedi cammino tra

due Physical Hypermedia

• Come andare dalla Gioconda del Leonardo nel Louvres(Parigi) alle Meninas nel museo del Prado (Madrid)?

?

• Generazione di un link per un Physical Hypermedia

5 – Web Mapping

• Nuovi sistemi territoriali– Google Earth, Google Maps– Yahoo Maps– MSN Virtual Earth– ecc

• Mappa, foto, immagini da satellite delmondo intero

• Possibilità di aggiungere informazionilocalizzate

Page 17: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 17

Definizione del web mapping

http://www.dbxgeomatics.com/

Web Mapping Service (WMS)

• Consente di produrre mappe georeferenziate da parecchi server di dati

• Impostare una rete di server da cui i client possono costruire mappe interattive

• Specifiche:– Open Geospatial Consortium (OGC).

Perché Google?

• E’ gratuito• Aggiornato• Grande comunità di utilizzatori• Sviluppo amichevole• Facile da apprendere e da capire

• Independente da piatteforme

Page 18: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 18

• Grammatica e un formato di file per glioggetti di Google Earth/maps– Punti– Foto– Linee– Sovraposizione– Collegamento a altri dati esterni

Keyhole Markup Language (KML) Keyhole Markup Language (KML)

• I file KML files possono essere condivisi• KMZ versione zippata di KML• Google Earth procede i file KML come un

browser di file HTML

Esempio: punto

<?xml version="1.0" encoding="UTF-8"?><kml xmlns="http://earth.google.com/kml/2.0"><Placemark>

<name>Seminario del 12 aprile 2007</name><description><![CDATA[Seminario <br>"Introduzione ai nuovi sistemi

visuali"<br>dal Pr. R. Laurini]]></description><Point id="khPoint616">

<coordinates>12.25111,45.4797166</coordinates></Point>

</Placemark></kml>

Punto

Page 19: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 19

Punto con testo Punto con URL

<?xml version="1.0" encoding="UTF-8"?><kml xmlns="http://earth.google.com/kml/2.0"><Placemark>

<name>Seminario del 12 aprile 2007</name><description><![CDATA[Seminario <br>"Introduzione ai nuovi sistemi

visuali"<br>dal<a href="http://lisi.insa-lyon.fr/~laurini/resact/cafoscari.pdf">Pr. R. Laurini</a> ]]> </description>

<Point id="khPoint616"><coordinates>12.25111,45.4797166</coordinates>

</Point></Placemark></kml>

Puntocon URL

Punto con immagine

<?xml version="1.0" encoding="UTF-8"?><kml xmlns="http://earth.google.com/kml/2.0"><Placemark>

<name>Seminario del 12 aprile 2007</name><description><![CDATA[Seminario <br>"Introduzione ai nuovi sistemi

visuali"<br>dal<a href="http://lisi.insa-lyon.fr/~laurini/">Pr. R. Laurini</a><br><img src="http://lisi.insa-lyon.fr/~laurini/laurini.jpg" alt="Robert LAURINI" height="129" width="105">]]></description>

<Point id="khPoint616"><coordinates>12.25111,45.4797166</coordinates>

</Point></Placemark></kml>

Page 20: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 20

Punto con immagine Esempi

• Localizzazione di foto• Localizzazione dei clienti di una ditta• Localizzazione d’attività

– Esempio: alberghi

– ecc

Localizzazione e condivisionedi foto

• Panoramio

• http://www.panoramio.com/map/#lt=40.712785&ln=-74.000645&z=4&k=1&a=1

Page 21: 1 – Generalità 2 – Metafore per i portali visuali · (Parigi) alle Meninas nel museo del Prado (Madrid)?? • Generazione di un link per un Physical Hypermedia 5 – Web Mapping

Introduzione ai Nuovi Sistemi Informativi Visuali Pr. R. Laurini

Aprile 2007 21

6 – Conclusioni

• Erano esempi di nuovi sistemi• Mescolando

– Immagini

– Informazioni multimediali– Mappe

• Importanza dei servizi basato sulleimmagini