UNIVERSITA’ DEGLI STUDI DI PAVIAUNIVERSITA’ DEGLI STUDI DI PAVIA

Corso di Laurea Interfacoltà in Comunicazione Interculturale e Corso di Laurea Interfacoltà in Comunicazione Interculturale e MultimedialeMultimediale

Usabilità dei Siti Flash: problemi e Usabilità dei Siti Flash: problemi e strategie di progettazione efficacestrategie di progettazione efficace

Relatore: Ing. Marco Porta Tesi di Laurea di Relatore: Ing. Marco Porta Tesi di Laurea di

Chiara NanniChiara Nanni

Anno Accademico 2005/2006Anno Accademico 2005/2006

L’USABILITA’ DEI SITI WEBL’USABILITA’ DEI SITI WEB

La diffusione del termine “Usabilità” è piuttosto recente ed è avvenuta La diffusione del termine “Usabilità” è piuttosto recente ed è avvenuta soprattutto con lo sviluppo di questo concetto nel World Wide Websoprattutto con lo sviluppo di questo concetto nel World Wide Web

I progettisti iniziano a spostare l’attenzione sull’utente finaleI progettisti iniziano a spostare l’attenzione sull’utente finale

Anni 80- 90Anni 80- 90: diffusione del personal computer: diffusione del personal computer

Diviene l’obiettivo dell’HCIDiviene l’obiettivo dell’HCI

FLASHFLASH

MacromediaMacromedia: software house di : software house di prodotti per la grafica e per il web prodotti per la grafica e per il web developmentdevelopment

6 Dicembre 2006: 6 Dicembre 2006: Adobe SystemAdobe System acquisisce la acquisisce la MacromediaMacromedia

Menù

Linea temporaledivide i filmati in fotogrammi

Stage qui si posizionano gli oggetti del filmato

Strumenti

Due parole-chiave per definire Flash:Due parole-chiave per definire Flash:

VersatilitàVersatilità: Flash può anche essere : Flash può anche essere utilizzato per creare un intero Sito Web utilizzato per creare un intero Sito Web multimedialemultimediale

InterattivitàInterattività: esperienze multimediali con : esperienze multimediali con partecipazione attiva dell’utentepartecipazione attiva dell’utente

animazioni interattive per animazioni interattive per visualizzare dati, visualizzare dati, riprodurre suoni,riprodurre suoni,reagire ad eventi del reagire ad eventi del mouse o della tastiera, mouse o della tastiera, trascinare e manipolare trascinare e manipolare elementielementi

giochi o applicazioni Web giochi o applicazioni Web complete con una propria complete con una propria logica internalogica interna

effetti sonori e la loro effetti sonori e la loro sincronizzazione con sincronizzazione con ciò che accade sullo ciò che accade sullo schermoschermo

Caratteristiche principali di FlashCaratteristiche principali di Flash

opera nel formato vettorialeopera nel formato vettoriale

Utilizza immagini definite da Utilizza immagini definite da equazioni matematiche vettorialiequazioni matematiche vettoriali

animazioni grafiche molto animazioni grafiche molto complesse, ma leggere, complesse, ma leggere, compatte e di ottima qualità compatte e di ottima qualità graficagrafica

Risolve i problemi di compatibilità e di visualizzazione di una stessa pagina su Risolve i problemi di compatibilità e di visualizzazione di una stessa pagina su browser diversibrowser diversi

Flash PlayerFlash Player

http://http://www.adobe.com/www.adobe.com/shockwave/downloadshockwave/download

I problemi di Flash fino al 2002I problemi di Flash fino al 2002

Non può essere visto da una percentuale importante di utentiNon può essere visto da una percentuale importante di utenti

Il tasto “Back” del browser non funziona come taleIl tasto “Back” del browser non funziona come tale

I contenuti in Flash sono poco flessibiliI contenuti in Flash sono poco flessibili

limitare l’uso dei moduli multimediali in Flash limitare l’uso dei moduli multimediali in Flash ai casi in cui essi possano costituire un reale ai casi in cui essi possano costituire un reale valore aggiunto per il sito valore aggiunto per il sito

Dal 2002 sino ad oggiDal 2002 sino ad oggi

Ma ancora oggi divide a metà ilMa ancora oggi divide a metà ilMondo dell’informatica…Mondo dell’informatica…

la tecnologia Flash ha conosciuto un enorme sviluppo: la tecnologia Flash ha conosciuto un enorme sviluppo: diffusione del plugin e standard Flash sempre nuovidiffusione del plugin e standard Flash sempre nuovi

http://www.devilwearspradamovie.comhttp://www.devilwearspradamovie.com

Accedendo al link del sito si apre Accedendo al link del sito si apre una pagina con un breve una pagina con un breve spezzone del filmspezzone del film

Necessita del Flash PlayerNecessita del Flash Player

http://www.devilwearspradamovie.comhttp://www.devilwearspradamovie.com

Home page Home page con i personaggi con i personaggi sullo sfondosullo sfondo

Colonna sonora di sottofondo Colonna sonora di sottofondo “sound on/off” “sound on/off”

Passaggio del mouse su uno dei Passaggio del mouse su uno dei personaggi personaggi sfondo sfuocato sfondo sfuocato compare il nome e il ruolocompare il nome e il ruolo

I personaggi sono dei bottoni I personaggi sono dei bottoni ma non si riconoscono ma non si riconoscono

I bottoni sono spesso poco chiariI bottoni sono spesso poco chiari

http://www.devilwearspradamovie.com/http://www.devilwearspradamovie.com/

Home page con i personaggi Home page con i personaggi sullo sfondosullo sfondo

Colonna sonora di sottofondo Colonna sonora di sottofondo “sound on/off” “sound on/off”

Posizionamento del mouse su Posizionamento del mouse su uno dei personaggi uno dei personaggi sfondo sfuocato sfondo sfuocato compare il nome e compare il nome e il ruoloil ruolo

I personaggi sono dei bottoni I personaggi sono dei bottoni ma non si riconoscono ma non si riconoscono

I bottoni sono spesso poco chiariI bottoni sono spesso poco chiari

http://www.devilwearspradamovie.com/http://www.devilwearspradamovie.com/

Test ironico di valutazione Test ironico di valutazione cartelletta con fogli che si cartelletta con fogli che si strappano strappano

Interazione dell’utente

http://www.devilwearspradamovie.comhttp://www.devilwearspradamovie.com

Poche parti testualiPoche parti testuali ““Cast notes” Cast notes” si accede alle si accede alle

biografie degli attoribiografie degli attori

testo piccolo e poco leggibiletesto piccolo e poco leggibile

Punta sull’aspetto visivoPunta sull’aspetto visivoFlash fondamentaleFlash fondamentale

http//:www.mcdonalds.co.ukhttp//:www.mcdonalds.co.uk

Versione Flash Versione HTML

Home page dinamicaHome page dinamica Musica di sottofondoMusica di sottofondo Oggetti che escono dalla scatolaOggetti che escono dalla scatola

Home Page staticaHome Page statica No musicaNo musica Scatola chiusaScatola chiusa

http//:www.mcdonalds.co.ukhttp//:www.mcdonalds.co.uk

http//:www.mcdonalds.co.ukhttp//:www.mcdonalds.co.uk

Versione FlashVersione Flash Versione HTMLVersione HTML

Pagina interattiva: giochi, : giochi, wallpapers wallpapers Musica di sottofondoMusica di sottofondo Ogni oggetto è un bottoneOgni oggetto è un bottone menù verticale a sinistramenù verticale a sinistra

E’ necessario il plugin E’ necessario il plugin

www.liquiddiamond.itwww.liquiddiamond.it

www.liquiddiamond.itwww.liquiddiamond.it

Versione in FlashVersione in Flash Immagini che scorronoImmagini che scorrono Musica di sottofondoMusica di sottofondo Bottone “apri il menù”Bottone “apri il menù”

Poche voci nel menùPoche voci nel menù

Solo col passaggio del Solo col passaggio del

mousemousesi visualizzanosi visualizzano le sottovocile sottovoci

www.liquiddiamond.itwww.liquiddiamond.it

Versione HTML

Home Page staticaHome Page statica

Menù verticale con sottovoci visibiliMenù verticale con sottovoci visibili

Possibilità di modificare dimensioni Possibilità di modificare dimensioni

Le parti testuali sono numeroseLe parti testuali sono numerose

Il sito punta sulla parte testualeIl sito punta sulla parte testuale Non sono fondamentali audio Non sono fondamentali audio video e immaginivideo e immagini

La versione HTML è meno dispersiva dal punto di vista dell’usabilitàLa versione HTML è meno dispersiva dal punto di vista dell’usabilità

ConclusioniConclusioni

È divenuto uno strumento completo per il Web per la È divenuto uno strumento completo per il Web per la realizzazione di contenuti altamente interattivirealizzazione di contenuti altamente interattivi

Pagina in HTML: a volte più usabile di una Pagina in Flash Pagina in HTML: a volte più usabile di una Pagina in Flash Siti in Flash: in genere sono più gradevoli da un punto di vista graficoSiti in Flash: in genere sono più gradevoli da un punto di vista grafico

Dovrebbe essere sempre fornita l’alternativa in HTMLDovrebbe essere sempre fornita l’alternativa in HTML

Potenza e flessibilitàPotenza e flessibilità

ConclusioniConclusioni

Flahpermette la creazione di siti di successopermette la creazione di siti di successo

non è esente da problemi riguardo l’usabilitànon è esente da problemi riguardo l’usabilità

bisogna fare affidamento sul bisogna fare affidamento sul buon senso degli sviluppatori dei buon senso degli sviluppatori dei

siti in Flash siti in Flash

Flash può essere usabile? Flash può essere usabile? Sì, tenendo conto degli accorgimenti necessariSì, tenendo conto degli accorgimenti necessari

Ma la questione rimane ancora oggi aperta…Ma la questione rimane ancora oggi aperta…