Ideazione e Progettazione di Prodotti Multimediali 2 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 di Prodotti Multimediali 2 SPS/08 Prof. Valerio Eletti 4a PARTE

4a parte 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

agenda 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

Ideazione e progettazione di un titolo ipermediale 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

Parentesi: cos'è la SWOT Analysis Ideazione e progettazione di un titolo ipermediale Parentesi: cos'è la SWOT Analysis Environmental analysis Internal analysis External analysis Strenghts Weaknesses Threats Opportunities SWOT Matrix Solo un accenno e rimando al prossimo incontro per una analisi più accurata e approfondita e sistematica

Ideazione e progettazione di un titolo ipermediale 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 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 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

agenda 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

Ideazione e progettazione di un titolo ipermediale 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 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 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 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 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 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 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 Proviamo ad applicare quanto detto a una vostra ipotesi di un primo project work… ANALISI OBIETTIVI ECONOMICI ANALISI OBIETTIVI EDITORIALI (DIDATTICI) DEFINIZIONE TARGET DI RIFERIMENTO (1° E 2°) DEFINIZIONE CANALE DISTRIBUTIVO O STRUMENTI DI LANCIO SWOT ANALYSIS ELENCO ARGOMENTI: PRIMO DIAGRAMMA A BLOCCHI PRIMO DIAGRAMMA DI FLUSSO DEFINIZIONE FUNZIONALE DELL’INTERFACCIA PRIMA IDEA GRAFICA PER L’INTERFACCIA PRIMA ANALISI DI USABILITY >>> cfr. richiamo nelle slide seguenti ANALISI DI FATTIBILITA’

agenda 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

Progettazione multimediale: usabilità 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

Progettazione multimediale: usabilità 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

Progettazione multimediale: usabilità 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

Progettazione multimediale: usabilità 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

Progettazione multimediale: usabilità 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 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

Progettazione multimediale: accessibilità 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

Progettazione multimediale: accessibilità 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

Progettazione multimediale: usabilità vs accessibilità 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

agenda 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

Valutazione di un titolo ipermediale 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 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 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à