Vai alla Home Page About me Courseware Federica Living Library Federica Federica Podstudio Virtual Campus 3D La Corte in Rete
 
Il Corso Le lezioni del Corso La Cattedra
 
Materiali di approfondimento Risorse Web Il Podcast di questa lezione

Raffaello Mazzacane » 3.La stesura dello storyboard e del flow-chart


La stesura dello storyboard e del flow-chart

Premessa

Come abbiamo visto nella lezione precedente, un passaggio determinante per la buona riuscita del progetto da sviluppare è rappresentato dalla stesura di uno storyboard di massima (per chi decide di realizzare uno slide show o un filmato), oppure un flow-chart (per chi invece decide di realizzare un ipermedia). In questa lezione vedremo, attraverso i modelli cartacei distribuiti nel corso ed alcuni esempi pratici realizzati dagli stessi studenti, come si utilizzano questi due importanti strumenti metodologici.

Storyboard

Storyboard è un termine utilizzato nel mondo dell’audiovisivo e indica una rappresentazione grafica della sceneggiatura che, in una sorta di anteprima, ci consente di rendere al meglio il processo di preparazione delle scene da girare.

Lo storyboard consiste in una serie di frame, raffigurati in un preciso lay-out grafico, che descrivono la sequenza dell’azione filmica, mettendoci in grado di farci un’idea di come sarà il prodotto che desideriamo realizzare.

Storyboard

In pratica nello storyboard inseriamo il primo fotogramma di ogni sequenza ritenuta importante ai fini dell’obiettivo della comunicazione.

Andiamo poi a specificare il tipo di inquadratura, la durata della sequenza, gli effetti audio e video.

Man mano che andiamo avanti lo storyboard può essere migliorato e perfezionato. A volte si propongono al committente più proposte di storyboard e si sceglie la più convincente prima di andare a girare le scene o organizzare una location.

Storyboard

Di seguito vediamo alcuni esempi che illustrano il processo di costruzione di uno storyboard:

  • uno spot realizzato con disegni;
  • uno spot realizzato con immagini fotografiche;
  • Uno spot realizzato con sequenze video.
Storyboard Ragazzi Pupazzi
L’infanzia violata
Legalize it

Storyboard

Titolo progetto: Camomilla sweet dreams: dormire è un sogno?

Gruppo di lavoro:

  • Salvatore Di Natale – regista e art director
  • Luca Pastorino – autore dei disegni
  • Chiara Meli – sceneggiatrice
  • Anna Liguori – tecnico animazioni, immagini e audio
  • Giada Salvo – responsabile inchiostratura e grafica

Lo storyboard prevede un primo livello di ideazione della storia; l’inquadratura è integrata da un commento scritto che descrive la scena e gli aspetti emotivi della storia. Il passo successivo consiste nella creazione delle tavole dei disegni di ogni scena prevista.

Camomilla sweet dreams
Primo piano
La corsa
Inciampa
In trappola

Storyboard

Titolo progetto: Ragazzi pupazzi

Gruppo di lavoro:

  • Ciro Di Maro
  • Ciro Lo Masto
  • Anna Lombardi

Nello storyboard possiamo vedere il lay-out grafico di ogni fotogramma, il numero di frame, un time code, la descrizione dell’animazione (integrata in questo caso da frecce direzionali per rappresentare la dinamica degli elementi grafici che entrano in scena).

Storyboard Ragazzi Pupazzi

Storyboard Ragazzi Pupazzi


Storyboard

Lo storyboard può essere sviluppato anche attraverso immagini fotografiche oppure con fotogrammi chiave di sequenze video. Negli esempi che seguono vediamo uno storyboard realizzato con immagini fotografiche ed uno con fotogrammi di sequenze video ed effetti grafici delle titolazioni.

Titolo progetto: L’infanzia violata

Titolo progetto: Legalize it

L’infanzia violata

L'infanzia violata

Legalize it

Legalize it


Flow-chart

Per la realizzazione di un ipermedia (un prodotto multimediale caratterizzato da una struttura non sequenziale) è prevista la formalizzazione del progetto in un diagramma di flusso: il flow-chart. Gli elementi base da comporre e organizzare nel progetto grafico sono le schermate e i contenuti, specificandone, possibilmente, l’articolazione tra i media (mix di testo, immagini, video, audio…).

Flow-chart

In genere si parte dalla home page, la pagina del menù principale da cui poi si dipartono i vari rami dell’applicazione (ad esempio, le sezioni tematiche di una enciclopedia). Ogni flow-chart può essere realizzato per approfondimenti successivi. Nel flow chart le aree dei contenuti di solito sono individuabili come rami dell’applicazione. Le schermate, rappresentate da figure geometriche (nel nostro specifico sono rettangoli), vengono collegate tra loro mediante frecce di connessione che caratterizzano la navigazione.

Flow-chart

Il flow chart è in sintesi un diagramma di flusso, un grafico nel quale una serie di figure geometriche molto semplici rappresentano le schermate dell’applicazione. In definitiva il flow chart rappresenta il documento più importante che bisogna realizzare quando si progetta un prodotto multimediale. Da esso si sviluppano poi l’analisi dei dati multimediali da realizzare e le fasi e i tempi operativi per la realizzazione del prodotto.

Flow-chart – esempi

Titolo progetto: Humanity

Gruppo di lavoro:

  • Ivan Cipollaro

Titolo progetto: City of angels

Gruppo di lavoro:

  • Valentina Cozzolino
  • Valentina Iaccarino
  • Mario Rumolo
  • Carlo Russo
  • Giuliana Taranto
Flow chart Humanity

Flow chart Humanity

Flow chart City of Angels

Flow chart City of Angels


La stesura dello storyboard e del flow-chart

In questa lezione abbiamo visto:

  • I due più importanti strumenti metodologici da sviluppare per la realizzazione di un prodotto audiovisuale o multimediale: lo storyboard ed il flow-chart.
  • Per prodotti di tipo sequenziale (slide show o filmati), il progetto cartaceo da realizzare è lo storyboard che, in una sorta di anteprima, ci consente di rendere al meglio il processo di preparazione delle scene da girare.
  • Per prodotti di tipo interattivo e multimediale il progetto cartaceo da sviluppare è invece il flow-chart, ovvero il diagramma di flusso delle schermate e dei collegamenti tra queste.

Prossima lezione

Tipi di inquadrature: campi e piani

  • Contenuti protetti da Creative Commons
  • Feed RSS
  • Condividi su FriendFeed
  • Condividi su Facebook
  • Segnala su Twitter
  • Condividi su LinkedIn
Progetto "Campus Virtuale" dell'Università degli Studi di Napoli Federico II, realizzato con il cofinanziamento dell'Unione europea. Asse V - Società dell'informazione - Obiettivo Operativo 5.1 e-Government ed e-Inclusion

Fatal error: Call to undefined function federicaDebug() in /usr/local/apache/htdocs/html/footer.php on line 93