Upload
tina-bianco
View
216
Download
0
Embed Size (px)
Citation preview
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Università Sapienza di Roma
Corso di Laurea magistrale Design, Comunicazione visiva e multimediale
Facoltà di Architettura Ludovico Quaroni e Facoltà di Scienze della Comunicazione A.A 2010/2011
Secondo anno, secondo semestre curriculum
Web e Interface Design e Comunicazione Multimediale
Ideazione e Progettazione Ideazione e Progettazione di Prodotti Multimediali 2di Prodotti Multimediali 2
SPS/08
Prof. Valerio Eletti
4a PARTE4a PARTE
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Ci dedichiamo ora finalmente all’approfondimento e all’applicazione pratica della progettazione multimediale:
Modelli di costruzione di flow chart > casi ed esercitazioni
Applicazione delle mappe logiche
Progettazione delle interfacce funzionali e grafiche > casi ed esercitazioni
Usabilità e accessibilità (cenni)
Analisi di fattibilità e prima organizzazione della produzione
4a parte
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Ideazione e progettazione di un titolo ipermediale:
Prima della progettazione editoriale
Concept
SWOT Analysis e Studio di fattibilità
• Case history: la scelta del Cd’Art
La progettazione editoriale di un prodotto ipermediale
Progettazione della struttura: diagramma a blocchi e flow chart
Progettazione dell’interfaccia strutturale e grafica (rif. usabilità e accessibilità)
• Case history: costruzione flow chart e strutturazione interfaccia
Usabilità e accessibilità di un prodotto ipermediale
Valutazione di un titolo ipermediale
agenda
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Prima della progettazione editoriale
Descrizione del concept
Analisi degli obiettivi da raggiungere
Definizione del target da colpire
Previsioni di mercato al momento dell’uscita valutazione di tutte le eventuali opportunità valutazione della concorrenza presente possibilità di alleanze nazionali e internazionali
Analisi delle risorse disponibili materiali multimediali da acquisire o produrre staff operativo a disposizione o da organizzare tempi e risorse economiche (cfr. il managment triangle)
>>> SWOT Analysis•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Parentesi: cos'è la SWOT Analysis
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Environmental analysisEnvironmental analysis
External analysisExternal analysisInternal analysisInternal analysis
StrenghtsStrenghts OpportunitiesOpportunitiesWeaknessesWeaknesses ThreatsThreats
SWOT MatrixSWOT Matrix
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
segue Prima della progettazione editoriale
… ma soprattutto, prima di avviare la progettazione,va verificata la validità della scelta multimediale:
perché non un titolo on line, su carta, su Vhs, su totem, su mobile…?
Analisi dei punti di forza
Evidenziazione di eventuali punti deboli
Confronto di tempi e costi rispetto alle altre soluzioni
Ora vediamo in concreto il nostro caso di studio. … e partiamo dalla visione del CdRom di riferimento >>>
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Case history.
Prima parte: lo studio di fattibilità del “Cd’Art”
Premessa: perché proprio il “Cd’Art” come case history di riferimento?
Analisi al contorno Situazione del mercato all’inizio della progettazione Previsioni di mercato per l’uscita del prodotto
Opportunità Punti di forza della Giunti Multimedia Punti di forza delle Edizioni la Repubblica Punti di forza della collaborazione editoriale
Incognite Rischi del nuovo mercato edicola
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
segue Case history
Il concept Titoli dedicati all’arte: perché?
L’eredità interna alla Giunti La storia: il successo dei fascicoli del dopoguerra
Una collana: perché? Il progetto iniziale in grandi linee
La scelta multimediale Punti di forza rispetto a carta e video tradizionali
(esclusione a priori dell’on line per l’epoca e la redditività)
L’analisi delle risorse disponibili materiali multimediali disponibili staff operativo a disposizione potenzialità di distribuzione e promozione valutazione di tempi e risorse economiche
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Ideazione e progettazione di un titolo ipermediale:
Prima della progettazione editoriale
Concept
SWOT Analysis e Studio di fattibilità
• Case history: la scelta del Cd’Art
La progettazione editoriale di un prodotto ipermediale
Progettazione della struttura: diagramma a blocchi e flow chart
Progettazione dell’interfaccia strutturale e grafica (rif. usabilità e accessibilità)
• Case history: costruzione flow chart e strutturazione interfaccia
Usabilità e accessibilità di un prodotto ipermediale
Valutazione di un titolo ipermediale
agenda
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
La progettazione editoriale propriamente detta
A. Analisi del concept e sua messa a punto
B. Scelta degli standard e del sistema di sviluppo
C. Strutturazione del titolo >>>
D. Design logico-funzionale dell’interfaccia >>
E. Verifica della fattibilità >
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
La progettazione editoriale >>> C. La strutturazione del titolo
Diagramma a blocchi statico
analisi dei materiali da inserire in ciascun blocco
valutazione dei pesi in memoria dei materiali previsti
prima ipotesi di navigazione generale
Definizione dei flussi logici: il flow chart
individuazione e descrizione dei rami principali
definizione delle eventuali stratificazioni di linguaggio
armonizzazione delle componenti multimediali
Vedremo più avanti l’applicazione di queste regole nel nostro caso di studio
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
La progettazione editoriale >> D. Design logico-funzionale dell’interfaccia
Individuazione e verifica della metafora comune
Definizione delle funzionalità dell’interfaccia delle diverse gerarchie di menu
Definizione delle funzioni attive e passive nelle schermate di servizio finali
Indicazioni grafiche operative per ciascuna interfaccia
bidimensionalità o tridimensionalità
struttura delle barre di controllo
collocazione e design degli strumenti di navigazione, ecc
Vedremo più avanti l’applicazione di queste regole nel nostro caso di studio
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
La progettazione editoriale > E. Verifica finale della effettiva fattibilità
Analisi dettagliata dei tempi e dei costi previsti
costi di acquisizione e/o produzione dei contenuti
valutazione giornate uomo per ogni fase
valorizzazione del totale giornate uomo
Analisi dettagliata della congruità della metafora,
della struttura e dei meccanismi di navigazione
… e quindi: eventuale ri-definizione del progetto
(si riparte dall’inizio fino alla verifica di tutti i punti)
E ora applichiamo tutto al nostro caso di studio, il Cd’Art
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Case history.
Seconda parte: il progetto editoriale del “Cd’Art”
Messa a punto del concept Scelta dei titoli della collana (lancio e pianificazione) Definizione della complessità della struttura ad albero
Scelta degli standard hw e sw Analisi dell’installato sul mercato:
• caratteristiche degli hw e sw più diffusi • valutazione della quantità di lettori CdRom
Scelta del sw di sviluppo Scelta della profondità di pixel (8 bit) per una buona riproduzione delle opere d’arte
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
segue Case history
Strutturazione del “Cd’Art” pilota
Diagramma statico semi-definitivo dei blocchi logici
Valutazione dei pesi degli apporti multimediali
Prima ipotesi operativa di flow chart
Ipotesi di stratificazione del linguaggio Definizione dei rami prevalentemente passivi Definizione dei limiti da porre all’interattività (ovvero limitazioni e cul de sac nel
disegno dell’albero per evitare la trappola dei link annidati)
… verifica: VEDIAMO I FLOW CHART ORIGINALI >>>
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
segue Case history
Design logico-funzionale dell’interfaccia
La definizione della metafora: come l’allestimento di una esposizione rispettosa dell’opera d’arte
Funzionalità dell’interfaccia di ciascun menu
… verifica: VEDIAMO QUALCUNO DEI PROGETTI ORIGINALI >>>
Indicazioni grafiche per l’interfaccia la bidimensionalità del quadro il fondo nero con tutti i suoi diversi vantaggi i comandi espliciti
Verifica finale dell’effettiva fattibilità
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Proviamo ad applicare quanto detto a una vostra ipotesi di un primo project work…
a) ANALISI OBIETTIVI ECONOMICI
b) ANALISI OBIETTIVI EDITORIALI (DIDATTICI)
c) DEFINIZIONE TARGET DI RIFERIMENTO (1° E 2°)
d) DEFINIZIONE CANALE DISTRIBUTIVO O STRUMENTI DI LANCIO
e) SWOT ANALYSIS
f) ELENCO ARGOMENTI: PRIMO DIAGRAMMA A BLOCCHI
g) PRIMO DIAGRAMMA DI FLUSSO
h) DEFINIZIONE FUNZIONALE DELL’INTERFACCIA
i) PRIMA IDEA GRAFICA PER L’INTERFACCIA
j) PRIMA ANALISI DI USABILITY >>> cfr. richiamo nelle slide seguenti
k) ANALISI DI FATTIBILITA’
Ideazione e progettazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Ideazione e progettazione di un titolo ipermediale:
Prima della progettazione editoriale
Concept
SWOT Analysis e Studio di fattibilità
• Case history: la scelta del Cd’Art
La progettazione editoriale di un prodotto ipermediale
Progettazione della struttura: diagramma a blocchi e flow chart
Progettazione dell’interfaccia strutturale e grafica (rif. usabilità e accessibilità)
• Case history: costruzione flow chart e strutturazione interfaccia
Usabilità e accessibilità di un prodotto ipermediale
Valutazione di un titolo ipermediale
agenda
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Che cosa è l’usabilità (usability)
Secondo lo standard ISO 9241-11:
“Il grado in cui un prodotto può essere usato da classi di utenti
per raggiungere specifici obiettivi con efficacia, efficienza e soddisfazione
in un contesto d’uso determinato”
In concreto, per essere usabile un prodotto deve: essere adeguato ai bisogni e alle aspettative degli specifici utenti essere facile da capire, da imparare, da usare. E gradevole consentire di eseguire le specifiche attività lavorative in modo corretto,
veloce e con soddisfazione generare pochi errori: non critici.
Rif. Sentinelli, Usabilità dei nuovi media, Carocci Editore, Roma 2003
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: usabilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Evoluzione del concetto di usabilità
Prima del 1980 L’usabilità non serve
Anni Ottanta I primi laboratori di usabilità
Tra gli ’80 e i ‘90 Design iterativo
Anni Novanta Design partecipativo
Nell’ultimo decennio Complessità dell’attore umano (Rif. Jacob Nielsen e M. Sentinelli)
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: usabilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
I tre settori dell’usabilità di un prodotto ipermediale
Architettura informativa Chiarire mission e vision del prodotto Disegnare una mappa informativa adatta ai diversi utenti
Progettazione grafica dell’interfaccia Definire le regole grafiche di usabilità (colori, forme, font, ecc)
Analisi dei flussi di interazione Applicazione dei processi relativi al user centered design
(cfr. HCI, Human Computer Interaction)
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: usabilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
I cinque aspetti dell’usabilità di un prodotto ipermediale
Learnability Il sistema deve essere semplice da imparare
Efficiency Dopo avere imparato a usare il sistema, l’utente deve poterlo usare con
un alto livello di produttività
Memorability Il sistema deve essere facile da ricordare
Error L’utente deve fare pochi errori e tutti reversibili
Satisfaction Il sistema deve soddisfare le esigenze dell’utente
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: usabilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Alcuni metodi per la valutazione dell’usabilità di un prodotto ipermediale
Heuristic evaluation• Nella valutazione vengono coinvolti solo esperti di usabilità• Viene fatta in corso d’opera e sui prototipi
Cognitive walkthrough • Vengono coinvolti esperti di usabilità, progettisti, utenti • Viene fatta in corso d’opera e sui prototipi
Thinking aloud • La navigazione viene fatta da utenti sotto l’osservazione dell’esperto che
registra le difficoltà dell’utente • Viene fatta solo dopo la beta release del prodotto
Task analysis • Coinvolgimento diretto di 5 utenti finali che devono raggiungere gli
obiettivi dei task definiti dall’esperto sul prodotto finito.
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: usabilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
E ora passiamo al concetto di ACCESSIBILITA’:
un sito è accessibile se permette di raggiungere tutte le informazioni a chiunque,indipendentemente dalla presenza di disabilità
fisiche, sensoriali o cognitive
Un sito accessibile è navigabile da qualsiasi utente indipendentemente da: Computer usato Velocità di collegamento Browser Interfaccia utente Periferica utilizzata (comprese quelle alternative come la tastiera Braille)
Un sito accessibile prevede quindi che il contenuto dell’informazione e la sua presentazione siano sempre indipendenti l’uno dall’altro (rif. a XML)
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: accessibilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Scopo dell’accessibilità è la lotta alla “info-esclusione” (cfr. punto C, Obj. 2 del piano d’azione eEurope):
(per la) “partecipazione di tutti all’economia basata sulla conoscenza (…) è necessario riservare una particolare attenzione ai disabili e alla lotta contro la info-esclusione”
Riferimento alle regole definite dal W3C attraverso il WCAG-WAI (Web Accessibility Initiative), per cui un sito deve essere:
Navigabile da tastiera
Accessibile da browser orali o da screen reader
Accessibile da browser di solo testo
Accessibile indipendentemente dal dispositivo di navigazione utilizzato
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: accessibilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Problemi di competizione fra accessibilità e usabilità:
Il problema della perdita di appeal con i livelli 2 e 3 del W3C
La difficoltà a utilizzare grafica e soprattutto animazioni Flash
La legislatura in Italia: obbligo del primo livello per la PAC e la PAL
Le applicazioni e le difficoltà individuate dal Cnipa
Le soluzioni a doppio binario
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
•Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica
Progettazione multimediale: usabilità vs accessibilità
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Ideazione e progettazione di un titolo ipermediale:
Prima della progettazione editoriale
Concept
SWOT Analysis e Studio di fattibilità
• Case history: la scelta del Cd’Art
La progettazione editoriale di un prodotto ipermediale
Progettazione della struttura: diagramma a blocchi e flow chart
Progettazione dell’interfaccia strutturale e grafica (rif. usabilità e accessibilità)
• Case history: costruzione flow chart e strutturazione interfaccia
Usabilità e accessibilità di un prodotto ipermediale
Valutazione di un titolo ipermediale
agenda
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Analisi della struttura del titolo Rilevamento e analisi del flow chart
Valutazione dell’efficacia del sistema di rimandi
Analisi del linguaggio ipermediale
Congruità dell’insieme delle componenti ipermediali (corretta distribuzione di ipertestualità, multimedialità e interattività nei diversi rami del titolo)
Efficacia e coerenza della metafora utilizzata
Efficacia dell’interfaccia
Efficacia del sistema di navigazione
Valutazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Analisi dei contenuti multimediali Individuazione dei diversi apporti multimediali
Qualità scientifica dei contenuti
Efficacia dei contenuti per il target previsto
Analisi della forza editoriale del titolo Verifica della validità della scelta ipermediale
Confronto qualitativo con i titoli concorrenti
Ove possibile, valutazione di costi e ricavi
Ove possibile, verifica della congruità del titolo nei confronti della politica editoriale del publisher
Valutazione di un titolo ipermediale
Prof. Valerio Eletti
Ideazione e Progettazione di Prodotti Multimediali 2
Design, Comunicazione visiva e multimediale, Università Sapienza di Roma. A.A. 2010/11
Analisi delle soluzioni tecniche Valutazione della semplicità di installazione e di disinstallazione del titolo
Valutazione della permeabilità alle macchine sul mercato
Valutazione sintetica finale Dopo la fase analitica si passa a un giudizio sintetico
che tenga conto sia delle analisi fatte, sia di fattori meno definibili come:
• la giocabilità del titolo,
• il suo valore innovativo
• e la sua capacità comunicativa.
• … oltre, naturalmente, usabilità ed accessibilità
Valutazione di un titolo ipermediale