Animazioni bestiali Gabbiani e dune
__________________
Prima parte __________________
Seconda parte __________________
 
Come navigare __________________




quelle difficili
quelle di testo
cgm
foto ricordo
bricchi
varie
link
Mappa del sito
__________________
Gallerie
__________________

 
 


Volo di gabbiani in riva al mare.
Omaggio ad Hugo Pratt.
Prima parte.

Le immagini sono liberamente tratte da una serie di fumetti, sono ridisegnate, modificate, ricolorate, ma comunque sempre derivanti dall'opera di Hugo Pratt.
Che spero non se l'abbia a male non avendo io volontà di guadagno od altro fine utilitaristico se non, appunto, quello di porgere un grazie-di-cuore all'autore di tante tavole sognanti.


Questa guida è a tratti.
Trattandosi di omaggio ad artista che lavora di tratto.
E parlo di tratti nel senso che per un certo numero di punti, o pagine, ancora non so, mi limiterò a produrre i protagonisti dell'animazione. Quindi non fate troppo caso alla consecutio temporum (sequenza di lavoro, niente a che fare con la sintassi) che si dipana in modo casuale, trattandosi, appunto, di fasi propedeutiche alla sceneggiatura.
Non fate caso neppure alla terminologia, mi sono appena letto una qualche pagina di un qualche trattato di animazione (ci ho capito pochino, ma non lo dite in giro) ed in quei trattati lì si da moltissimo peso alla sceneggiatura, allo story-board, alle tecniche di movimento etc. tutta roba interessantissima ma assai barbosa se l'affronti senza un esempio, un problema pratico da risolvere.
La qual cosa fornisce ulteriore veridicità al vecchio adagio secondo il quale val più la pratica della grammatica, il quale adagio invero non dice che senza la grammatica alla pratica non ci arrivi. Ma questo è tanto per parlare, pour parler, per allungare il brodo, cercando di allontanare l'istante dell' ...

 
 


 
         
   
Photoshop


   
 

0

___________________________________________________________________________________________________

   
    ... inizio della guida.

Il fondo.
Creo un nuovo file di 1280 x 720 pixel.

Riempio lo sfondo con un azzurro chiarissimo.
Seleziono un rettangolo in basso che riampio con un azzurro poco più intenso.
Salvo (file > Salva per Web) come jpg 100% chiamandolo fondo.jpg.

   
   

 

   
 

1

___________________________________________________________________________________________________

   
   



Il mare.
Un mare essenzialmente grafico, fumettistico.
Più lungo da spiegare che da fare.

Creo un nuovo livello (ONDA1) sul quale traccio un'area sinuosa come nella figura.
Ho dovuto spezzare in tre pezzi il disegno per mostrare qualcosa di intelleggibile.
Riempio l'area di bianco, poi traccio il profilo di un 2-3 pixel, colorandolo di azzurro intenso.
Elimino i due tratti verticali ai lati che inevitabilmente l'azione "traccia" ha creato.

Costruzione
della bolla
di sapone
 
   

 

livello
ONDA1

 
  2 ___________________________________________________________________________________________________    
   

Creo un nuovo livello (ONDA2) e sempre con il lazo traccio una seconda area, come nella figura, la riempio di bianco, ne traccio il profilo ed elimino le due linee verticali ai bordi dell'immagine.

 
   

 

livello
ONDA2
 
  3 ___________________________________________________________________________________________________    
   


Sistemo i due livelli uno al di sopra dell'altro.
Creo un nuovo livello (ONDA3) al di sotto dei primi due e traccio un'area che stia all'interno delle aree biancha, ma cercando di seguirne in modo grossolano l'andamento esterno, sempre come si vede nella figura.
Quest'area la riempio di un azzurro più chiaro dei bordini.

Non sto molto a perder tempo con i colori che come sempre sono un fatto soggettivo.


   
   

 

livello
ONDA3
 
  4 ___________________________________________________________________________________________________    
   


Per poter far scorrere in loop un oggetto sul monitor occorre averne due, identici.
E' un concetto già trattato più volte su queste pagine. Per ricorrere ad un esempio, mettiamo che siete affacciati di fronte ai binari e passa un treno: quando la motrice ha superato il vostro campo visivo il treno funziona come un loop, ma quando finiscono i vagoni finisce il loop.
Qui dobbiamo non far finire mai i vagoni.

Premetto che questa è una prova del nove, tutto quel che viene indicato qui e nel punto successivo ha il solo scopo di chiarire in cosa consista il movimento che ho in mente per questo mare.

Dunque, duplico il livello ONDA1 e lo sposto tutto a destra, fuori schermo, ma accostato all'originale.

Poi duplico il livello ONDA2 e lo sposto tutto a sinistra, fuori schermo, ma accostato all'originale.

Collego fra di loro i livelli ONDA1 e la sua copia.
Collego fra di loro i livelli ONDA2 e la sua copia.

   
   

 

   
  5 ___________________________________________________________________________________________________    
    Vado su Image Ready ed inserisco un secondo fotogramma al primo che trovo pronto nella condizione proveniente da Photoshop.
Sposto ONDA1 e la sua copia a sinistra, fino a far arrivare la copia in posizione a pieno schermo



Sposto ONDA2 e la sua copia a destra, fino a far arrivare la copia in posizione a pieno schermo.


   
   

Imposto un tweening di una dozzina di fotogrammi e ...

 

   
  6 ___________________________________________________________________________________________________    
   


... e controllo che tutto funzioni e che soprattutto il livello ONDA3 copra sempre lo spazio fra i livelli ONDA1 ed ONDA2
Che non ci siano zone vuote, per intenderci

Le prime due animazioni raffigurano i movimenti di una sola onda alla volta, la terza mostra tutto il menù, a schermo ridotto, mentre la quarta è il vero risultato finale.


   
   

 

   
  7 ___________________________________________________________________________________________________    
   

I due livelli ONDA1 ed ONDA2 vanno poi salvati (attenzione ad ingrandire lo schermo in orizzontale per contenere tutto il disegno) come png trasparenti per poi rifare tutta l'operazione (sposto a destra, sposto a sinistra) su SwishMax.

Però, ripensandoci, si potrebbe anche usare tutto l'ambaradan generato con ImageReady (= l'animazione) per far prima quando ci troveremo a fare i conti con SwishMax.

In tal caso si fa in questa maniera.
Visto che i colori sono davvero pochetti, si può salvare il gif da Imageready (salva ottimizzato come ...) per poi rileggerlo immediatamente e salvarlo come PSD (Salva con nome).
Si rilegge il PSD con Photoshop, si riduce il quadro in verticale ai minimi termini in modo cioè da comprendere lo stretto indispensabile e solo quello, quindi si rende visibile un livello alla volta e lo si salva (file > salva per web).

In questo modo, non disponendo di un fondo trasparente, si salvano dei jpg.

Volendo dei PNG con il fondo trasparente, prima di salvare i vari livelli si può selezionare la parte superiore dell'immagine, quella color cielo chiaro con lo strumento

e quindi cancellare la zona selezionata.
A vostro piacere.


   
   
   
  8 ___________________________________________________________________________________________________    
   

Fatto il mare ce ne scordiamo.
Passiamo alle nuvole.


Come ho premesso, questo è un lavoro che non richiede un file unico, con tutto sistemato per benino a registro.
Si tratta di procurarsi i vari elementi dell'animazione per poi disporli altrove, su di un palcoscenico diverso dai camerini degli attori. L'importante è che non si producano oggetti troppo grandi, per evitare un peso finale eccessivo del filmato.



Con il pennello sottile (2-3 pixel) intinto di nero si disegnano delle forme nuvolanti (che se sono onde si dice ondeggianti, no?) del tipo di quelle accennate qui sotto.
Ora non era affatto necessario stare a perder tempo nel mostrare come si muove il pennello e quale effetto se ne ottenga, ma essendo questo un posto dove si fa animazione alla buona, mi è sembrata una buona cosa illustrare praticamente quel che si ricava da un piccolo cerchiolino nero che scorre sulla superficie azzurrina dello schermo.
Proprio per darmi un po' di arie, maproprio (tuttattaccato-come-si-usa-sulle-chat-degli-hub).

   
   

 

   
  9 ___________________________________________________________________________________________________    
   

Fatti i profili occorre riempire l'area delle nuvole di un bel bianco nuvoloso.

Si tracciano le aree seguendo i profili (meglio un pochetto alla volta per non perdersi) e, su un nuovo livello sistemato al di sotto del (o dei) livello dei profili neri, si riempie di bianco.
Alla fine converrà unire tutti i livelli, bianchi e profili, o tutti in sieme in un unico livello, o seperando fra di loro le nuvole; in quest'ultimo caso attenzione alla sovrapposizione: vi potrebbe capitare che un'area bianca si sovrapponga ad una parte di profilo dell'altro livllo di nuvole; quindi, in untima analisi, salvo che vi vada di animare separatamente cirri e cumuli ed altre amenità, meglio un unico livello e morta là.

   
   

 

   
  10 ___________________________________________________________________________________________________    
   


Qui sotto, tutte in fila ed a grandezza naturale, brandelli di nuvole che vi potrebbero servire per rifare il tutto. Sono sistemate a registro in basso, quindi, copiando ed incollando su Photoshop e poi affiancando le immagini in modo acconcio, si può ricostruire l'intero cielo.

 
   

 

   
 

11

___________________________________________________________________________________________________

   
 


E mettiamo via anche le nuvole, per passare alle dune ed ai ciuffi stentati d'erba o di sterpaglia.
Il procedimento è analogo: si va di pennello intinto di nero per i profili ed i ciuffi d'erba e di disegno delle aree colorate.
Più che mostrarvi il risultato non saprei.
Qui sotto ci sono due dune, ed anche se non nel formato originale ma un po' rimpicciolite, credo che bastino a dare uno spunto per ridisegnare qualcosa di simile (e certamente di meglio).

Come si nota ho utilizzato come spunto qualche tavola di Hugo Pratt, trattandosi di omaggio dichiarato.

 
   

 

 

 
  12 ___________________________________________________________________________________________________    
   

Ogni duna l'ho raggruppata in un unico livello, senza ovviamente il cielo. Della prima ho fatto una copia, ribaltandola in orizzontale di 180°. Della seconda ho fatto una copia pari pari.
La cosa si poteva fare anche su SwishMax, ma ho preferito avere una scena completa, un'impaginato, un lay-out a disposizione per ragionare sull'animazione.
La scena estesa (ne vedremo solo un parte in animazione) è quella che si vede qui sotto.
Di nuovo c'è solo il sole, ma si tratta di una cosa veramente banale, dopo aver affrontato mare cielo e terra, no?

Dimenticavo: ho salvato come png 24 trasparente (il cielo no, mi raccomando) le quattro dune.

   
   

 

   
  13 ___________________________________________________________________________________________________    
   



Creo un nuovo livello (l'ho chiamato sole ,e non in romanesco, ma è ininfluente: tutta l'opera non è indirizzata ad immagini fisse ma solo a realizzare i protagonisti dell'animazione)


Traccio un cerchio, lo riempio di giallo, poi traccio il perimetro (2 pixel, colore marroncino).
Fatto il sole. Lo salvo (salva per web) come png 24 trasparente (oscurando tutto, compreso il fondo).

   
   

 

 

   
  14 ___________________________________________________________________________________________________    
   
Il gabbiano.
L'unica è trovare qualche gabbiano fra le tavole di Hugo Pratt (ce ne sono a migliaia) e cercare di farne una copia animabile.

Per i disegno sempre la solita storia: darci di pennello intinto di nero:


   
   

 

 
  15 ___________________________________________________________________________________________________    
    Io ho avuto fortuna: appena disegnato s'è messo a volare.
Nel caso in cui ciò non succeda occorre rassegnarsi e modificare il livello di partenza, copiandolo e rifacendo delle parti d'ala.

Sviluppando il volo come si vede nelle immagini qui sotto:

   
   

 

   
  fine prima parte ___________________________________________________________________________    
   

Abbiamo praticamente finito.
Ora si tratta di assemblare il tutto con SwishMax.
Nella seconda parte di questa guida.

 



   
 

 

 

 

 

 

  altre guide onde, mare
ed uccelli
 
                 
     
 
 
 
 
 
 
 
 
   
 
mappa del sito
  Info_ndo
Non ho Copyright © poichè non so l'inglese però il sito è fatto da nebbiaenuvole.com Tutti i diritti sono diritti, che se fossero storti ....
Marchi registrati e segni distintivi sono di proprietà dei rispettivi titolari.

Creative Commons License
nebbiaenuvole by www.nebbiaenuvole.com is licensed under a Creative Commons Attribuzione-Non commerciale-Condividi allo stesso modo 2.5 Italia License
Permissions beyond the scope of this license may be available at http://creativecommons.org/about/licenses/