Web Design - Appunti

INFORMAZIONE DIGITALE

1.1 INFORMAZIONE E COMUNICZIONE

L’informazione è una collezione di dati + una relazione tra loro

Sistema d’informazione, c’è un Input e un Output, serve un Processo e una Memoria.

Comunicazione è il trasporto dell’informazione

Sistema di comunicazione è composto da: MESSAGGIO (sequenza di simboli), INFORMAZIONE

(contenuto), MITTENTE (fonte), DESTINATARIO (destinazione), MEDIUM (portatore di contenuti),

CODICE (sistema dei segni, conosciuti da mittente e destinatario), CONTESTO (ambiente),

FUNZIONE (motivo dell’atto comunicativo)

1.2

SISTEMA NUMERICO > MISURA DELLE INFO > UNITA’ E FATTORI

Informazione: 1) QUANTITA’ —> memoria —> Bytes —> volume 2) VELOCITA’ —> Trasmissione,

Input/Output —> bits/second —> volume/tempo = FLUSSO

BIT = unità di informazione minima (0,1) BYTE = 8 Bit KILOBYTE = 2 (10) Byte MEGABYTE 2 (20)

Byte GIGABYTE = 2 (30) Byte TERABYTE = 2 (40) Byte PETABYTE = 2 (50) Byte EXABYTE = 2 (60)

Byte ZETTABYTE = 2 (70) Byte YOTTABYTE = 2 (80) Byte

1.3

ARCHITETTURA DEL SISTEMA DIGITALE

HARDWARE (componenti fisiche, hard) - SOFTWARE (componenti volatili) diviso in Sistema

Operativo”Vista” e Applicazioni”Office”)

FILE —> un blocco di dati sotto forma di byte, messi insieme e gli viene dato un nome. FILE SIZE —

> dimensione del file in Bytes

COMPRESSIONE —> riduzione dimensione file 1) LOSSLESS: compresione SENZA perdita di

informazione (percorso reversibile) 2) LOSSY: compressione CON perdita di informazione (percorso

non reversibile)

MALWARE: è un SFOTWARE!! —> diverse forme

NETWORK —> connessione-condivisioni di risorse: nodi + link. 1) LAN: Local Area Network 2) WAN:

Wide Area Network

INTERNET —> Network di Network. 1) TCP, comunicazione tra applicazioni. 2) IP, comunicazione tra

nodi. 3) DNS, nome del dominio

WWW —> World Wide Web —> 1)HTTP, hyper text transfer protocol. 2) URL, uniform resource

locator. 3) HTML, Hyper text markup language.

EMAIL —> SMTP, simple mail transfer protocol

FILE TRANSFER —> FTP, file transfer protocol

STREAMING —> RTSP, real time streaming protocol (LIVE)

1.4

ANALOGICO/DIGITALE

ANALOGICO —> il segnale analogico degrada con il rumore, GRADUALMENTE

DIGITALE —> il segnale digitale è più ROBUSTO al rumore, cede di botto.

il digitale permette una convergenza di sistemi e tecnologie, tutti parlano la stessa lingua 1,0

MEDIA E MULTIMEDIA

2.1

DEFINIZIONI

MEDIA —>1) PSICOLOGICO, percezione testo, immagine, suono… (MULTI-MEDIA) 2)

FISIOLOGICO, sensazione. 3) FISICO. 4) TECNOLOGICO: - Memorizzazione, detti anche storage

media, VHS, DVD… - Trasmissione, mass-media, TV, radio … - Acquisizione, scanner, camera,

microfoni… - Presentazione, monitor, proiettori… - Elaborazione, matita, computer…

MULTI-MEDIA = composto da almeno 2 Media + Integrazione —> convergenza.

INTERACTIVE MEDIA = MEDIA + interattività, esperienza ATTIVA vs passiva.

HYPER-MEDIA TEXT = multi sequenziale, multi lineare VS MEDIA TEXT sequenziale, lineare VS

HYPER LINK non lineare, SALTA.

2.2

MEDIA, CAMPIONI vs OGGETTI (spazio/tempo)

TEXTURE —> ho l’oggetto grafico e lo rendo reale tramite un’immagine, lo riempo di pixels.

RASTERIZING —> da oggetto grafico e immagine Pixels

TRACING —> da immagine con Pixels a oggetto grafico.

FRAMES —> INQUADRATURA

TWEENING —> Deriva da between, sono i frames nell’immagine 2D + tempo, immagine in

movimento. I frames che ci sono tra due key frames.

RECOGNITION —> da Samples a Objects, con sviluppo nel tempo.

SAMPLING (AUDIO) —> passaggio da Oggetto a Campione, da spartito a l’onda con i sui puntini.

2.3

MULTI-MEDIA, ON-LINE vs OFFLINE (spazio/tempo)

2.4

PROCESSO DI PRODUZIONE

slides + CONCETTO —> SVILUPPO ( design —> -1 information design (qual è il prodotto?)-2

interaction design (come dovrebbe funzionare?)-3 presentation design (come dovrebbe sembrare?) —

> IMPLEMENTAZIONE —> TEST —> CONSEGNA SVILUPPO (DESIGN)

slides

IMPLEMENTAZIONE ci sono diversi strumenti e oggetti per la produzione multimediale: AUTHORING

e CODING

WYSIWYG (“what i see is what you get) —> codice invisibile —> authoring

TEXT-BASED —> codice visibile —> coding —> programmazione (scrivere un programma, JAVA),

scripting (programmare con un programma JAVASRIPT), mark-up (annotazione tramite programma

HTML).

c’è anche un’interattività che va dal SISTEMA all’UTENTE e viceversa —> il sistema risponde

all’utente che è attivo. 1 determinato evento (click su un pulsante…) viene associato a una

determinata azione.

TEST

Piattaforma del target —> hardware e software + requisiti del sistema. Qui si va verso una lotta tra

QUILITA’ vs PERFORMANCE (memoria, processore…).

Utenti Target —> estetici VS funzionali

DELIVERY

solo contenuto —> programma di visualizzazione richiesto dall’utente (player, lug-in…).

contenuto + player —> programma di visualizzazione dato all’utente (in piedi da solo, dentro CD).

DIGITAL 2D IMAGE

3.1

SAMPLE vs OBJECTS

Sample-based —> spazio 2D —> strutturato de elementi colorati, PIXELS (picture elements) termini

comuni: raster - grid - pixmap - bitmap.

La risoluzione - dipendente. QUALITA' <—> DIMENSIONE

Si usano programmi e oggetti di Pittura - Painting, basati su effetti pixels.

Object-based —> spazio 2D —> descrizione matematica delle forme (oggetti, linee…)

termini comuni: object-oriented - shape-based - vector.

La risoluzione - indipendente. QUALITA’<—|—> DIMENSIONE (compatto)

Si usano programmi e oggetti di Disegno.

3.2

SAMPLE-BASED IMAGE

ALIASING —> un difetto di campionamento: percezione dell’immagine sottoforma di linea frastagliata,

perdita di dettagli.

ANTI-ALIASING —> immagine basata su pixel, si usa una tecnica di arrotondamento e dei dettagli

colorando i pixel vicino di un colore intermedio.

Dimensione/Risoluzione

IMMAGINE (spazio) Dimensione: 1) Continua —> Analogica, illusione di continuità data dal limite

dell’occhio umano —> Metro di misura, Pollici, Cm… 2) Discreta —> Digitale —> misura, Pixels.

IMMAGINE /spazio) Risoluzione: 1) Risoluzione immagine —> risoluzione dell’oggetto originale (es:

tramite scanner) —> discrete dimension pixel / continuos dimension pollici = PPI (pixels per inch).

2) Risoluzione dispositivo —> discreta dimension (punti, linee) / continuos dimension (pollici) =

DPI (dots per inch) ; LPI (lines per inch).

OCCHIO —> 300 DPI alla distanza di 40/50 cm, buona qualità d’immagine.

QUANTIZZAZIONE/CODIFICA

Quantizzazione = n° di colori = livelli di colori

Codifica = n° di bit = come scrivo i colori

normalmente si lavora a 8 bits, per colore, di colore per velocità. 8 bits RED - 8 bits