02 introduzione

Sistemi
Multimediali
Introduzione
Sistemi Multimediali A.A. 2020-2021 1

Indice
Media e Mediamorfosi.
Interattività.
Elementi multimediali.
Il paradigma ipertestuale.
Struttura e navigazione di un ipertesto.
Sistemi Multimediali 2
A.A. 2020-2021

Lo scambio di informazioni
“Quando mi dici qualcosa, io verifico di aver
compreso il tuo messaggio ripetendolo con
parole mie, perché se lo ripetessi con le
tue parole tu potresti dubitare che io
abbia capito. Ma se uso le mie parole il
risultato è che cambio il tuo significato,
anche se solo di poco …”
David Lodge
Small World: An Academic Romance, 1984 (ed.it. Il professore va al congresso, Bompiani, 2001)
A.A. 2020-2021

Il contesto
• Termini da esplorare:
Comunicazione
Informazione
Interattività
Ipertesto

Letteralmente:
incrociare piante o animali di specie diverse in modo
da ottenere ibridi
Esempi:
Mulo  incrocio tra un maschio di asino e una femmina di cavallo
Tomtato  una pianta ibrida che produce contemporaneamente
pomodori e patate
Auto ibride  idrogeno/benzina
Lavagna luminosa  lavagna/proiettore
A.A. 2020-2021
Ibridazione

Dati e informazione, la stessa cosa?
dati
• Se qualcuno vi dicesse
– Cristoforo Colombo
– 125
voi rispondereste:
"embè"?
informazione
• Ma se prima voi
aveste chiesto: "in che
via e civico abita
Giovanni? "
eccovi la risposta
cercata.
La prima volta non sapevate come potevano esservi utili (dati),
ma una volta fatta una domanda si sono tramutati in ciò che vi
serviva (informazioni).

Comunicazione e informazione
• L’informazione è un processo di acquisizione di
conoscenze.
• La comunicazione è un passaggio di informazione,
cioè l’informazione viene “messa in comune”.
• Caratteristiche:
– la possibilità, per chi riceve, di trasmettere a sua volta;
– partecipazione allo scambio comunicativo.
A.A. 2020-2021

L'ibridazione tecnologica è una pratica che consiste nell'impiego
innovativo di materiali e conoscenze tecniche mediante
l'integrazione di componenti a basso contenuto tecnologico e/o
appartenenti alla tradizione con elementi tecnologicamente
complessi maturati spesso in contesti scientifici.
Le tecnologie di
telecomunicazione, l’informatica e
i media sono entrati in un
processo di metamorfosi che li
porterà sempre più a convergere,
a scambiarsi il ruolo, ad assumere
caratteristiche ibride.
Telecomunicazioni
Media
Computer
A.A. 2020-2021
Ibridazione tecnologica

• I media più vecchi generalmente non muoiono, ma
continuano ad evolversi e ad adattarsi.
• I nuovi media vengono continuamente “creati”:
non sorgono spontaneamente e
indipendentemente, ma emergono gradualmente
dalla metamorfosi dei vecchi mezzi.
A.A. 2020-2021

• La storia della tecnologia dei media non è una
storia lineare: nel 1986 venivano già elencati 26
newmedia. Molti di questi sono divenuti standard,
altri sono scomparsi.
• INTERNET è divenuto il driver della tecnologia
innovativa e della convergenza multimediale.
A.A. 2020-2021

Una notizia di questi giorni
• I dischi in vinile (ntrodotto nel 1948 dalla Columbia
records negli Stati Uniti d'America come evoluzione del
precedente disco a 78 giri), si legge sull'edizione on-
line della Cnn, hanno raggiunto nella prima metà
dell'anno 2020 la quota di 232,1
milioni di dollari di vendite.
• I Cd, secondo un report della Recording Industry
Association of America, hanno invece toccato la quota
129,9 milioni di dollari.

Mediamorfosi
• Le informazioni possono essere presentate sotto forma di:
• Tutti questi oggetti di informazione prendono il nome di Media.
• L’uso combinato di diversi media in formato digitale (elementi
multimediali) ha portato ad una trasformazione dei tradizionali mezzi
di comunicazione che sono divenuti multimedia .
Testo
Immagini
Filmati
Audio
Animazioni
Media
A.A. 2020-2021

… ma anche
Testo
Immagini
Filmati
Audio
Animazioni
Tatto
Olfatto
Media
A.A. 2020-2021

•Multimedia indica l’integrazione (controllata da
computer) di testi, immagini, audio, video, animazioni
e di ogni altro mezzo comunicativo che può essere
rappresentato, memorizzato, trasmesso ed elaborato
in forma digitale.
• Rappresentazione digitale.
• Rappresentazione delle informazioni in modo
efficiente e completo.
Multimedia/Ipermedia
A.A. 2020-2021

Quale comunicazione?
Quali di questi prodotti di comunicazione sono multimediali?
Libro
illustrato
• testo + immagini + interazione (salto alle pagine + ricerca dei capitoli tramite
indice + ricerca di singole parole tramite indice analitico)
Film su
pellicola
• filmato + suono + testo, sequenzialità senza interazione
Sportello
bancomat
• (informazioni, emissione banconote e scontrini, servizi di ricarica schede telefoniche, etc)
• testo + grafica + interazione col computer (ricerca informazioni bancarie, composizione dinamica delle
maschere di accesso e degli estratti conto)
Videogioco
• testo + suono + grafica + interazione tramite computer
Spettacolo
teatrale
• suono + immagini + interazione (senza limiti: tattile, olfattiva, termica)
A.A. 2020-2021

Quale comunicazione?
 Media interattivi:
l’utente è mittente e
destinatario
dell’informazione
 Media tradizionali:
l’utente è solo
destinatario
dell’informazione

L’interattività
• La multimedialità non è caratterizzata
esclusivamente dalla presenza e dall’integrazione di
una varietà di media utilizzati per comunicare.
• Può e deve esistere la possibilità da parte di un
utente di interagire mediante l’immissione di dati o
eventi.
 Possedere uno o più flussi di comunicazione.
 Possedere una struttura ipertestuale.
A.A. 2020-2021

L’interattività
• Un mezzo di comunicazione è interattivo quando:
– è in grado di prendere informazioni provenienti dall’esterno
– può fornire risposte alle domande/azioni dell’utente
– può valutare le risposte/azioni dell’utente
• Un sistema di comunicazione è interattivo quando è in grado
di modificare l’informazione trasmessa in base agli input
(stimoli) forniti dall'utente.
A.A. 2020-2021

L’interattività
• Interattività è sempre stata presente.
• Un cavallo risponde al suo cavaliere
• Una macchina risponde al suo guidatore
• I computer aumentano le possibilità di interattività.

La navigazione di base.
Per i libri è implicita: si possono sfogliare.
Per i media digitali è una conquista.
Adattabilità all’utente e al contesto
Legami ipertestuali e la non linearità
Dinamica con l’evolversi dell’interazione
Le funzioni di ricerca.
Gli elementi dell’interattività

Un esempio particolare
• Il film tradizionale
• Il film “multimediale”
– l’utente può diventare parte attiva nel processo di
riproduzione del film.
– Gli sviluppatori di film in DVD Video hanno la possibilità di
inserire nello stesso film varie trame e vari finali.
– L’opera cinematografica introduce la possibilità di
interagire direttamente con il film, e in base alle proprie
scelte, far cambiare la trama.
A.A. 2020-2021

Un esempio particolare
Attualmente molti DVD possono contenere
sezioni multiangolo.
• Le funzioni multiangolo permettono di
visualizzare la stessa scena da punti di vista
differenti.
• Esempio. Nel DVD del film «L’era glaciale»
realizzato da Fox Animation Studios .
A.A. 2020-2021

Sistema multimediale
Una applicazione multimediale va dunque
vista come:
… un’applicazione che utilizza in modo
combinato e interattivo un insieme di testi,
disegni, immagini, audio, video, animazioni o
altro mezzo comunicativo in forma digitale.
A.A. 2020-2021

• Un sistema multimediale è in grado di:
Generare
Elaborare
Memorizzare
Manipolare
Presentare
Distribuire
Informazioni multimediali
A.A. 2020-2021

Generazione • Production/authoring tool
Rappresentazione • Compression and formats
Memorizzazione • File system design
Trasmissione • Networking issues
Ricerca e accesso • Database management
Distribuzione • Server design, streaming
A.A. 2020-2021

Esempi
World Wide Web
•Documentazione ipermediale
Video conferencing, Video on-demand, TV digitale interattiva
•Multimedia streaming
Strumenti per l’interazione di comunità (groupware)
•Software collaborativi: Wikipedia, TikiWiki
Realtà virtuale
•Sistemi multimediali totalmente immersivi
Editing video
•CD ROM, DVD
Archivi digitali
•Sistemi informativi multimediali

Le origini
• Memex di Vannevar Bush
– As we may think, Atlantic Monthly 176, 1945
– Macchina elettromeccanica con capacità di annotazioni
e di indicizzazione associativa.
• Testo  multimedia
• Ipertesto  ipermedia (Ted Nelson, Literary
Machines, 1974, ISBN: 0893470554)
• Ipertesto, termine coniato da Nelson nel 1965

Nel luglio del 1945 Vannevar Bush scrisse un articolo
sull’Atlantic Monthly intitolato “As we may think” (Un modo
di pensare) in cui descrive una macchina foto-elettrica-
meccanica chiamata Memex.
Consider a future device for individual use, which is a sort of mechanized private file
and library. It needs a name, and, to coin one at random, “memex” will do. A memex
is a device in which individual stores all his books, records, and communications, and
which is mechanized so that it may be consulted with exceeding speed and flexibility.
It is an enlarged intimate supplement to his memory.
Vannevar Bush, “As we may think”, Atlantic Monthly, July 1945
http://www.theatlantic.com/unbound/flashbks/computer/bushf.htm
Un memex è un dispositivo in cui l'individuo immagazzina tutti i
suoi libri, le annotazioni e le informazioni di qualunque genere ed
è tale da poterlo consultare velocemente ed esaurientemente.
A.A. 2020-2021
1945: As we may think

 1945 - “Memex” by Vannevar Bush
 1960 - Xanadu – global hypertext network by Ted Nelson
 1968 - Augment – multiple-window interfaces; remote
access to computers by Doug Engelbart
 1969 - ARPANET – the first prototype internet, by J. C. R.
Licklider
 1976 - Architecture Machine Group propone a DARPA:
Multiple Media
 1985 - Negroponte, Wiesner: inaugurano MIT Media Lab
A.A. 2020-2021
Multimedia e ipermedia: una sola storia

 1989 - Tim Berners-Lee propone il World Wide Web al CERN (European
Council for Nuclear Research)
 1990 - K. Hooper Woolsey, Apple Multimedia Lab
 1992 – Primo evento multicast M-Bone audio multicast sulla rete
 1993 - U. Illinois National Center for Supercomputing Applications:
NCSA Mosaic
 1994 - Jim Clark e Marc Andreesen: Netscape
 1995 - JAVA ambiente di sviluppo indipendente dalla piattaforma
 … e la storia continua …
A.A. 2020-2021
Multimedia e ipermedia: una sola storia

La critica di Ted Nelson
• Per gran parte delle persone, il World Wide
Web è oggi una fedele implementazione della
visione del memex ipertestuale di Vannevar
Bush. Per molti, ma non per tutti. Ted Nelson
non si accontenta e denuncia:
“L’HTML è proprio quello che volevo evitare con
Xanadu: collegamenti sempre interrotti,
collegamenti unidirezionali, citazioni di cui non
puoi seguire l’origine, nessuna gestione delle
versioni, nessuna gestione dei diritti.”
A.A. 2020-2021

Il sistema multimediale
• contenitore • contenuto
Il sistema multimediale è soprattutto un progetto
comunicativo, fatto di:

Il progetto comunivativo
il giusto Contenitore
per ogni Contenuto
… ma …

Elementi multimediali
A.A. 2020-2021
Gli ingredienti
• - il testo scritto
• - le informazioni visive
• - il colore
• - il testo parlato
• - la musica
• - gli effetti sonori
• - il tatto e l’olfatto

Il testo scritto
• Secondo la ricerca psicologica, la comprensione della
lettura si compone di due ordini di processi:
– il primo (di livello più basso) è percettivo e riguarda la
corretta identificazione e decodifica delle lettere che
compongono le parole e le frasi
– il secondo (di livello più elevato) è cognitivo e riguarda la
costruzione di una rappresentazione mentale del
significato del testo, a partire dalla decodifica svolta dal
primo processo.

Il testo scritto
• L’uso del monitor per la lettura del testo in un’opera
multimediale rende più difficile il processo di corretta
identificazione di caratteri e parole, a causa
dell’emissione luminosa dei fosfori (più affaticante
della carta) dell’innaturale posizione nella quale ci si
trova durante la lettura su monitor.
• La maggiore difficoltà della lettura a monitor (circa il
25% più lenta che su carta) ha imposto ai progettisti
la necessità di trovare dei modi che potessero ridurre
queste difficoltà:
» Uso di font sans serif (senza grazie)
» Miglioramento del rendering (sfocatura)

Il testo scritto
• In un font con grazie (es. Times) le lettere
contengono delle piccole appendici che
accompagnano le linee ascendenti o
discendenti “verso” la lettera successiva.
• In un font senza grazie (es. Verdana), le
lettere mancano completamente di queste
appendici: i caratteri sono composti da linee
che terminano in maniera netta, dette
“bastoni”.
L
L

Il testo scritto
• La lettura di testi attraverso un monitor è anche
appesantita dall’avvicinamento fra i caratteri.
• Alcuni programmi spaziano in maniera difettosa
alcune lettere, che si trovano così più vicine di altre
all’interno della stessa parola, creando
raggruppamenti irregolari e ostacolando la lettura.

Il carattere perfetto
• Il carattere ‘perfetto’ per la lettura a monitor è il
Verdana:
– appartiene alla categoria “senza grazie”, ed elimina così i
problemi specifici legati alle piccole appendici dei caratteri
– è particolarmente curata la spaziatura fra le lettere, che è stata
resa uniforme
– ottima resa del grassetto, il bold tipografico, che serve ad
enfatizzare i caratteri
– avendo pochi pixel a disposizione, il cambiamento di dimensioni
del carattere non è un problema
A.A. 2020-2021

Informazioni visive
• L’uso delle immagini nei prodotti multimediali è
fondamentale, praticamente indispensabile.
Perché?

Informazioni visive
• La scienza ancora non sa esattamente come la nostra mente
trattenga le informazioni, ma tutti concordi su un punto:
– Il nostro cervello dimentica più facilmente le informazioni ricevute
come parole o numeri, mentre conserva più a lungo le informazioni
visive.
• Generalmente ricordiamo il volto di una persona, il nome si
dimentica più facilmente.
• Possiamo ricordare un’intera scena di un film, ma facciamo
fatica e ripetere più di un paio di battute.

Informazioni visive
• Se un'immagine vale più di mille parole …
• Non è sempre altrettanto semplice fare in modo che
un'immagine comunichi almeno quanto mille parole
…
• I problemi sono molti:
– modalità proprie della percezione visiva
– quantità di dati da codificare e quindi veicolare

Informazioni visive
• La natura delle immagini, la loro funzione e il modo
in cui sono realizzate sono aspetti da non
sottovalutare nello sviluppo di un prodotto
multimediale.
• Ogni dettaglio dell’immagine deve contribuire a
comunicare il messaggio e lo spirito del prodotto.
• Le immagini possono chiarire, porre in contrasto o in
evidenza, oppure completare il testo o altri elementi.

Il colore
 Anche il colore introduce informazione e quindi è parte
della comunicazione.
 Non esistono combinazioni cromatiche migliori in
assoluto.
 Le combinazioni esistenti in natura sono universalmente
apprezzate:
Colori caldi per sottolineare
Colori freddi per sfondi

Il colore
• Color Wheel Pro è un software che aiuta nella scelta delle
combinazioni cromatiche.
Aqua Sunny Energy Contrast Eggplant

Il colore
• Concetti interessanti sono enunciati da Andrew
Mundi che introduce la “Web color theory” aiutando
a comprendere la natura dei colori dello schermo
http://www.mundidesign.com/

Il testo parlato
• Può essere utilizzato, ad esempio, nelle presentazioni multimediali,
per accompagnare la visualizzazione di testo e immagini.
• A differenza del testo scritto, il testo parlato è un flusso continuo
che non può essere agevolmente interrotto.
• Maggiore difficoltà di comprensione rispetto a un testo letto.
• Problemi di sincronizzazione tra il testo parlato e la relativa
presentazione.
• I tempi di lettura e di attenzione degli utenti rappresentano una
variabile rilevante.

Il testo parlato
• Vengono meno alcuni elementi tipici delle comunicazioni
verbali:
– il linguaggio del corpo
– le espressioni facciali
• Il linguaggio del corpo è più credibile del linguaggio verbale.
• Si possono però sfruttare le “informazioni paralinguistiche”,
per dare una certa enfasi al discorso o per attribuire maggiore
importanza a determinate parole:
– qualità della voce (tono, risonanza)
– vocalizzazioni (sospiro, riso, pianto, ecc)
– qualificatori vocali (ritmo, intensità, estensione)
– segregati vocali (ispirazioni, pause, balbettii)

Gli effetti sonori
• Possono essere impiegati come dimensione
supplementare dell’interfaccia, per potenziare
l’interattività.
• Consentono di:
– attirare l’attenzione su particolari situazioni
– dare conferma del recepimento dei comandi da parte del sistema
– informare l’utente su eventi che hanno luogo in background
– suggerire il senso del luogo o un’atmosfera
• L’utente deve avere sempre la possibilità di escluderli.

La musica
È probabilmente l’impiego più ovvio del sonoro nei
prodotti multimediali.
• È sempre l’elemento di maggiore impatto emotivo in
qualsiasi comunicazione.
• Determina l’impressione iniziale dell’utente nei
confronti del prodotto.

La musica
• L’uso della musica in un prodotto multimediale può
avere diverse funzioni
– aumentare la spettacolarità;
– collocare il prodotto entro un certo contesto
culturale;
– creare un sottofondo.

La musica
Il rapporto tra la musica e i testi o le immagini può
essere di
• Parallelismo
– La musica commenta testo e immagini;
– La musica dà enfasi e stabilisce una relazione di continuità
con gli altri codici.
• Contrappunto
– La natura della colonna sonora sembra quasi negare il
valore di quanto espresso dalle immagini o dalle parole;
– È una strategia di grande impatto emotivo.

Tatto e olfatto
Tatto e olfatto nei multimedia?
• L’uomo utilizza primariamente l’informazione visiva e
sonora, ma il canale tattile e olfattivo possono
assumere una funzione di supporto nella
comunicazione.
• L’uso del tatto e dell’olfatto possono aumentare di
molto il realismo nella percezione di
un’informazione.

Tatto e olfatto
Dalla multimedialità all’aptica
• La disciplina che studia come le sensazioni tattili e
olfattive (oltre alla vista e all’udito) possono essere
riprodotte da un sistema artificiale è detta aptica.
• Un sistema aptico rappresenta la forma più completa
di multimedialità.
• Applicazioni dell’aptica:
– Medicina, training professionale, telecontrollo,
– Settore ludico, arte virtuale, cinema.

Tatto e olfatto
• L’esplorazione di modelli virtuali 3D di opere
artistiche famose a persone non vedenti.

A.A. 2020-2021
L’ingrediente segreto:
semplicità
“Complicare è facile, semplificare è
difficile.
Per complicare basta aggiungere,
tutto quello che si vuole: colori,
forme, azioni, decorazioni,
personaggi, ambienti pieni di cose.
Tutti sono capaci di complicare. Pochi
sono capaci di semplificare"
Bruno Munari

L’ingrediente segreto: semplicità
A.A. 2020-2021

Semplice o complicato?
A.A. 2020-2021

A.A. 2020-2021
L’ingrediente più
importante: chiarezza
Parla il linguaggio dell’utente,
piuttosto che utilizzare termini
orientati al sistema e ai soli
addetti.
Presenta le informazioni
secondo un ordine logico e
naturale.

L’ingrediente più importante: chiarezza
A.A. 2020-2021
Quando è consentito
l’accesso?

Simboli di spunta
• Un segno di spunta è un carattere (V, ✓, ✔, ecc.)
usato per indicare il concetto "sì", ad esempio "sì,
questo punto è stato controllato" o "sì, sono
d'accordo".
• È l'opposto della croce (X, ✗, ✘, × ecc.), anche se la
croce può essere a sua volta segno di assenso (ad
esempio nel caso di una lista a scelta multipla).

Pavimento di una stanza:
bisogna mettersi in fila, dove?
Sedie messe in fila e intorno ad
un tavolo. Dove mi siedo?
Simboli chiari o confusi?

L’ingrediente fondamentale: comprensibilità
A.A. 2020-2021

A.A. 2020-2021
L’ingrediente fondamentale: comprensibilità

Riassumendo
Comprensibilità
Semplicità
Chiarezza

Multimedia: questioni tecniche
• Problemi critici, tra cui:
– Come rappresentare e memorizzare l’informazione temporale
– Come mantenere strettamente le relazioni temporali durante la
riproduzione o l’accesso ai dati
– I dati devono essere rappresentati digitalmente –
campionamento, conversione analogico-digitale
– I dati hanno dimensione molto elevata – banda, memoria,
compressione

Multimedia: questione non tecniche
• Sinestesia
– Il termine fa riferimento a quelle situazioni in cui una
stimolazione uditiva, olfattiva, tattile o visiva è percepita
come eventi sensoriali distinti ma conviventi.
– I multimedia si prestano a fenomeni di interazione
sensoriale e sinestesica
Per esempio: uno stimolo visivo accompagnato ad uno
stimolo sonoro appare più lungo.

• Contenuto
– Lo scopo di un’applicazione multimedia è quello di rendere
l’informazione (contenuti) più interessante, compelling e …
di facile navigazione.
– Le tecnologie multimedia danno agli utenti la possibilità di
scegliere il contenuto da ricevere e la maniera con cui esso
è presentato.
– Indipendentemente dalle tecnologie utilizzate nel
multimedia, il focus primario sono i contenuti.

• Alcuni consigli
 Non sovraccaricare un registro sensoriale
Es. Solo stimolo visivo
 Non dare stimoli contrastanti in senso diverso
Es. Icona e suoni associati
 Progettare unitariamente un registro sensoriale ma
controllare l’associazione sinestesica e simbolica
Considerare gli aspetti culturali.
Ogni cultura offre una gerarchia sensoriale.

• Prevedere la creazione di uno schema, di un filo logico,
che ci consente di mantenere una coerenza interna,
senza perdersi in approfondimenti inutili.
• Si procede con una stesura provvisoria dello schema, alla
quale segue una stesura definitiva.

Perché è credibile?
• Keep Calm and Carry On (in
italiano "Mantenete la calma e
andate avanti") fu uno slogan
prodotto dal governo britannico
nel 1939 agli albori della
seconda guerra mondiale, con lo
scopo di invogliare la
popolazione a mantenere
l'ottimismo e non farsi prendere
dal panico in caso di invasione
nemica.

• Erano realizzati da professionisti specializzati in programmazione HTML
• Spesso i siti somigliavano più a un volantino di carta che a un prodotto multimediale
• Erano creati sulla base di un progetto iniziale ed eventuali modifiche erano apportate solo in
caso di necessità
• I siti erano una collezione di pagine statiche unite dai collegamenti ipertestuali (link)
Pagine con links
Home page
Ipertesto statico
A.A. 2020-2021

Dal testo all’ipertesto
Il testo
• Organizzazione lineare: unidimensionale e
unidirezionale.
• Modellato sulla forma inerente del medium
fondamentale della comunicazione umana: il
linguaggio verbale orale.

74
Cos’è l’ipertesto?
 Il termine ipertesto fu coniato nel 1965 da Ted Nelson per
indicare documenti caratterizzati da una struttura non
sequenziale delle idee, in alternativa al formato logico-
sequenziale tipico dei libri, dei film e dei discorsi.
 Adattamento del termine inglese hypertext
Hyper = “sopra”
Text = intreccio, trama (latino)

●Un ipertesto è un testo costituito da blocchi o
frammenti interconnessi tra loro.
●Blocchi o frammenti sono unità funzionali
significative e sono chiamati nodi.
●I collegamenti, chiamati link, possono essere esterni
o interni tali da generare una rete di nodi intratestuali.

Ipertesto con nodi testuali Ipertesto con nodi multimediali
A.A. 2020-2021

La figura mostra
come gli
argomenti
possono
essere
relazionati in
un ipertesto,
opposto ad un
documento
lineare
A.A. 2020-2021

Un ipertesto è: un insieme di nodi connessi da legami.
Nodi
Il nodo è la singola unità informativa (uno qualsiasi dei media
disponibili) che permette la navigazione predisposta dall'autore
e attivabile dall'utente.
I nodi possono essere delle parole, delle pagine, delle
immagini, dei grafici, delle sequenze sonore, dei documenti
completi che possono essere degli ipertesti a loro volta.
Ipertesto: nodi, link e rete
A.A. 2020-2021

Link
I collegamenti (link) sono l'elemento caratterizzante degli
ipertesti e dei sistemi ipermediali: essi permettono la
connessione, sia logica che fisica, tra le unità informative (nodi).
Gli items di informazione non sono collegati linearmente,
come su una corda a nodi, ma ciascuno di essi, o la maggior
parte, estendono i loro legami a stella, secondo un modello
reticolare.
Navigare in un ipertesto, è disegnare un percorso in una rete
che può essere complessa quanto si vuole.
A.A. 2020-2021

Rete
 Una rete è un percorso di tutte le possibili
navigazioni tra i nodi, mediante i link stessi.
 Il paradigma di navigazione è semplice: l’utente
“legge” il contenuto di un nodo e in base a ciò che
legge, si sposta in un altro nodo attraverso un link.
 Un nodo della rete può sempre essere il
successivo.
A.A. 2020-2021

• Si possono individuare almeno tre tipologie
diverse di rete e quindi di navigazione
associabili alle strutture di un ipertesto:
– Navigazione orizzontale
– Navigazione verticale
– Navigazione trasversale
A.A. 2020-2021

Navigazione
Navigazione orizzontale
• quando i link si configurano come collegamenti tra
informazioni concettualmente assimilabili sullo stesso
piano.
Navigazione verticale
informazioni concettualmente assimilabili a piani diversi.
Navigazione trasversale
informazioni poste su piani diversi, sia
concettualmente che in riferimento al tipo di contenuto.
A.A. 2020-2021

Struttura di un ipertesto
STRUTTURA DEGLI IPERTESTI
• L’insieme dei nodi e dei collegamenti rappresenta
l'insieme dei percorsi logici che sono stati attivati.
• Classificabile in 4 tipi:
• sequenziale
• ad albero o gerarchica
• semigerarchica
• a rete
A.A. 2020-2021

Struttura sequenziale
• Si naviga in maniera sequenziale da un nodo al
successivo.
A.A. 2020-2021

Struttura ad albero
• La navigazione avviene tra un nodo e l’altro
secondo un percorso gerarchico. Le informazioni
sono collocate a livelli distinti.
• Dal nodo a livello superiore si passa al nodo di
livello inferiore.
A.A. 2020-2021

Struttura semigerarchica
• La navigazione avviene su percorsi destrutturati.
Le informazioni sono collocate a livelli distinti.
A.A. 2020-2021

Struttura a rete (ipertesto puro)
• La struttura ha la massima flessibilità costruttiva
e di consultazione. Le informazioni sono
idealmente tutte allo stesso livello e i link
permettono una navigazione completamente
libera e destrutturata.
A.A. 2020-2021

Struttura a rete (ipertesto reale)
• In realtà poi si hanno situazioni di questo tipo.
A.A. 2020-2021

 Definizione degli obiettivi:
 analisi dell'argomento
 destinatario (studenti, insegnanti, appassionati, vasto
pubblico, .....)
 tipologia (intrattenimento, informazione,
autoapprendimento, approfondimento, apprendimento
guidato, ......)
 supporto finale (CD-ROM, Internet, ....)
 individuazione delle competenze necessarie
 chi deve realizzarlo (studenti, insegnanti, principianti,
esperti, .......)
 costituzione del gruppo di lavoro
Realizzare un ipertesto
A.A. 2020-2021

• Ricerca dei materiali:
– Documentazione sull'argomento
– Individuazione dei contenuti
– Ricerca e raccolta dei materiali (libri, fotocopie,
scritti, foto, filmati, ....)
– Elaborazione concettuale
A.A. 2020-2021

• La mappa concettuale
– La mappa concettuale è la rappresentazione della
struttura dell'ipertesto mediante un diagramma ad
albero che descrive tutti i nodi e i collegamenti che si
intendono attivare.
– La mappa è di fondamentale importanza in lavori di
una certa complessità. Essa serve a garantire la
coerenza logica dei collegamenti e permette di
progettare una corretta navigazione.
A.A. 2020-2021

• La mappa concettuale
– La navigazione ottimale è quella che garantisce un
alto grado di libertà, mantenendo l'orientamento.
– È indispensabile che il lettore sappia in ogni
momento dove si trova e non perda di vista le
informazioni che stava cercando.
– Se la mappa concettuale non è ben strutturata, è alto
il rischio di confusione e smarrimento.
A.A. 2020-2021

 Studio dell'interfaccia:
 Scegliere una veste grafica uniforme
 adottare una rappresentazione iconografica
chiara e univoca
 scegliere sfondi, pulsanti, icone, caratteri
tipografici
 verificare la lunghezza delle pagine
 curare il rapporto testo immagini
 scegliere suoni e musiche.
A.A. 2020-2021

• L’ipertesto sfuma i confini tra lettore e autore
• Testi leggibili vs. testi scrivibili
• Molteplici collegamenti rendono il lettore un attore attivo
• Un sistema ipertestuale completo offre al lettore una funzione per ampliare il
campo dei collegamenti
• L’ipertesto sfuma la distinzione tra esterno ed
interno
• Assemblaggio di frammenti che crea un metatesto
• Evidenzia l’inter-testualità anche implicita in una sola opera
• Apre il testo ad una infinità possibilità di relazioni
Ipertesto: dal punto di vista della teoria
letteraria
A.A. 2020-2021

Le figure interessate
Progettazione
e realizzazione
Della
infrastruttura
Analista
Team di
sviluppo
Del contenuto
informativo
Curatore
Team di
sviluppo
A.A. 2020-2021

Team di sviluppo
(infrastruttura)
Sviluppatore
web
DB manager /
Administrator
System manager
A.A. 2020-2021

Team di sviluppo
(contenuti)
Sviluppatori
Grafici
Produttori video
Speaker
Montatore
A.A. 2020-2021

Usabilità - accessibilità
• Nel progettare sistemi multimediali bisogna
garantire il più possibile la consultazione anche da
individui affetti da disabilità motorie (controllo arti)
o sensoriali (vista e udito), o cognitive, o
condizionati dall’uso di strumenti con prestazioni
limitate o da condizioni ambientali sfavorevoli.
• Due concetti:
- usabilità
- accessibilità
A.A. 2020-2021

Un esempio significativo
Mappa della
metropolitana di
Londra del 1908

Mappa della
metropolitana di
Londra del 1932
realizzata da
Beck.

• La versione di Beck della Mappa della Metropolitana di Londra
rinuncia alla precisione della scala (cioè a una fedele
rappresentazione delle distanze e delle forme geografiche reali) in
favore di una maggiore chiarezza e leggibilità.
• Le distanze relative sono volutamente alterate, i tratti raddrizzati
e schematizzati.
• Quella di Beck, infatti, non è una mappa in senso stretto quanto
piuttosto un diagramma.
• L’opera di Beck ha fatto scuola e da modello per molte altre
riguardo:
– l’uso del colore come codice identificativo
– il ricorso allo stile del diagramma
– l’impiego di linee rette per lo più a 90 e 45 gradi.

Un altro esempio …
… da non seguire!

Un altro esempio
?

In conclusione
• La cosa più facile è scrivere il codice (linguaggio di
mark-up)
• Si certo! Ma dopo …
– Aver disegnato la mappa logica
– La navigazione
– Il layout
– … … …

02 introduzione

Recommended

Recommended

More Related Content

What's hot

What's hot (20)

Similar to 02 introduzione

Similar to 02 introduzione (20)

02 introduzione

Editor's Notes