nebbiaenuvole
guide animazione 2D Photoshop, ImageReady, Swish Max
 
saluti all'imbarco
___________________
 

 

Saluti all'imbarco.

Cominciamo dall'origine del male.
A volte qualche navigatore mi scrive (l'indirizzo per scrivermi è indicato in fondo ad ogni pagina: Info-ndo) chiedendomi, più che qualche spegazione sulle guide, un aiuto: nel senso di produrre qualcosa che gli serve per qualcosa o pr qualcuno o per chi sa che.
Insomma si tratta di fare un piacere che, potendo, a me non costa nulla, anzi a volte mi ci diverto perfino.
E' il caso di questa guida. Ovviamente non voglio e non posso citare il nome del gentile richiedente, ed in fondo non è importante sapere chi, ma vedere cosa ho combinato.

Che non è assolutamente granchè, ho dovuto fare in fretta, e certi movimenti avrei dovuto curarli maggiormente.
Ma ormai l'è fatta: pigliate il buono, se ce n'è, e lasciate quello che non vi piace.

 
1
   

lLa base è un'immagine in bianco/nero tratta dai simboli (CGM artwork) presenti nel sito raggiungibile andando nella sezione link & contatti, o, per far prima, andando direttamente alla pagina che ci interessa: simboli CGM.

Conviene però prelevare l'immagine dal B/N qui sotto, leggermente ingrandita.
Per farlo ho scaricato l'immagine FGS060.ai e l'ho letta con Photoshop.

Photoshop
   


 
2
    Ho colorato i personaggi ed un po' di cielo.
Se non vi va di farlo potete attingere dall'immagine qui sotto, al punto ........
Se lo volete fare, non disponendo di Adobe Illustrator, basta partire dal B/N, catturare il nero, cliccando su di una zona sicura con una tolleranza del 40-50%.
Copiare ed incollare.
Otterrete un livello con il fondo trasparente e con i soli profili neri della scena, che chiameremo
profili
.

A questo punto, selezionando con pazienza le varie zone, stando attenti a comprendere sempre un pochetto del profilo nero che le delimita, e riempire, su di un NUOVO LIVELLO, con il colore che più vi sconfifera. Ma questo lo vediamo più sotto, Per ora parliamo dello scontorno.

Io ho lavorato su di un personaggio alla volta, in questo modo:


Per prima cosa ho duplicato il livello
profili.
La copia l'ho chiamat
a uomo.


Ho scontornato una figura alla volta (in questo caso l'uomo), selezionando le parti di profilo che non la riguardavano e cancellandole.
La selezione è molto facile quando le figure non si trovano accavallate, sovrapposte fra di loro, nel qual caso la selezione si fa in modo grossolano e veloce, com'è il caso dell'uomo.
Il fondo bianco dell'immagine non tragga in inganno: ho lavorato su di un livello privo del fondo, quel che si vede è il livello sfondo del PSD.
Altra accortezza: sapendo che in fondo a noi basterà muovere le braccia, meglio limitarsi a delimitare solo la parte superiore dei personaggi, quella che fuoriesce dai parapetti, ma anche se lo scontornate per intero poco male.

Qui sotto si vede la parte selezionata (quella in grigio).
 
   

 
3
    E cancellando il superfluo ho ottenuto questo risultato.  
   

 
4
    Passiamo al colore.


Traccio il profilo delle aree da colorare. Qui, ad esempio, la faccia dell'uomo.
Unica accortezza è di comprendere sempre un pochetto del profilo nero che la delimita, per evitare di avere zone non colorate, e poi di non andare troppo per il sottile sulle zone piene di nero.


Creo quindi un nuovo livello nel quale riempio la zona selezionata con il colore che più mi sconfifera.

Sposto poi il nuovo livello al di sotto del livello
uomo.
 
   

 
5
    Seleziono le altre zona da colorare riempio con il colore scelto sempre sul livello posto al di sotto del livello uomo.
Al termine unisco fra di loro i due livelli, uomo ed il livello con i colori, mantenendone il nome: uomo.
Sposto il livello uomo al di sotto del livello profili, ottenendo questo risultato.

Qui non si vede, ma naturalmente il livello profili contiene anche i profili neri dell'uomo, che quindi sono doppi.
Capiterà quindi, con altre figure, di avere una sovrapposizione errata dei personaggi: alla fine del lavoro di scontorno e colorazione provvederemo a rimuovere tutti le parti doppie del livello profili.
 
   

 
6
    Allo stesso modo, e cioè:
duplicando il livello profili, cancellando i profili in eccesso per ottenerne la sola figura che interessa,
inserendo eventuali profili nascosti (ad es.: parte del braccio alzato della donna), colorando quindi, su di un nuovo livello, quel che occorre,
infine unendo i due livelli profilo più colore ...

otterremo i 4 personaggi che si vedono qui sotto, spostati rispetto alla posizione reale per mostrare come correggere il profilo e come disporre i colori.
 
   

 
7
    Livello profili.
Lo duplico per l'ennesima volta (la copia mi serve solo come copia di riserva, si sa mai che debba ripartire).


Sul livello profili cancello tutti i profili già inseriti nelle figure scontornate e scolorate.
Qui sotto la traccia per lo scontorno: l'area da eliminare è quella in grigio.
 
   

 
8
    C'è un particolare: il parapetto sopra alla ragazza, essendo il livello profili costituito, e Ferrini direbbe: come dice il nome stesso, dai soli profili, lascia intravedere parte dei vestiti.
Dovremmo, ma solo se ci tenete, provvedere a coprire, o meglio a mettere del colore (in questo caso il bianco) sul parapetto.

Per farlo usiamo la solita tecnica:


Si seleziona la parte che vogliamo coprire, si crea un nuovo livello, al di sotto del livello
profili, e, sul nuovo livello, si riempie la selezione di bianco.
Poi si collegano e si uniscono i due livelli, profili ed il nuovo con il parapetto in bianco,
mantenendo il nome profili alla somma dei livelli (profili-copia è sempre lì di riserva, vero?)


Qui sotto si vede, in grigio chiaro, la zona selezionata da colorare.
 
   

 
9
    Ci metterei un po' di cielo, ora.


Seleziono la parte al di sopra del parapetto, come nella figura.


Creo un nuovo livello e sfumo lazona selezionata dall'azzurro al bianco
 
   

 
10
   
Creo un nuovo livello, lo chiamo cielo, e sfumo la zona selezionata dall'azzurro al bianco.
Porto il livello cielo al di sotto di tutti i livelli (escluso il livello sfondo).

Dimenticavo, dovremmo colorare anche la figura di destra, quella un po' indefinita.
Stessa roba: creo un nuovo livello, lo sistemo al di sotto del livello
profili, seleziono le zone e le coloro, sul nuovo livello.
Alla fine collego ed unisco
profili al nuovo livello, ottenendo un solo livello profili,come si vede nella figura qui sotto.
 
   

 
11
   

Prepariamo, finalmente, l'animazione.
Io mi sono limitato alle braccia, anzi ad un braccio ciascuno. Volendo si può anche animare viso e corpo, ma volendo farsi del male.

Ne vediamo una, le altre son simili, quindi si tratta solo di rifare le stesse cose.
Duplico il livello uomo.
Il nuovo livello lo rinomino
uomo-senza, nel senso chefrapoco diventa senza braccio.

   


 
12
    Rotazione del braccio.


Duplico il livello B1, che rinomino in B2.

Sul livello
B2 eseguo una piccola rotazione in questo modo:

CTRL+T (oppure Menù > modifica > trasformazione libera)
Sposto il centro della selezione in basso a sinistra.
Ruoto con il mouse in altro verso sinistra.
Pochi gradi, fate ad occhio, come nella figura.
A proposito, nella figura si vede anche il corpo, il livello
uomo-senza
: mi serve come registro per controllare che il braccio sia sempre attaccato alla spalla e che non sia nè troppo in alto nè troppo in basso rispetto alla posizione precedente.
L'eventuale correzione fatela usanto le freccine poste in basso a destra della tastiera: evitano spostamenti drammaticamente ampi che otterreste usando il mouse per muovere il livello.



Duplico il livello B2, che rinomino in B3.
Sul livello B3 eseguo una piccola rotazione come ho fatto prima.
E così via, mi faccio circa un 5 copie di livelli, sempre più ruotati verso l'alto a sinistra.

Se volete graduare in modo precisissimo la successione degli angoli di rotazione
potete utilizzare i valori numerici inserendoli nelle finestrelle poste in alto sotto al
menù principale.
 
   

 
13
    Diciamo che di copie ne ho fatte 5, e quindi mi trovo ad avere, nel set uomo, l'ultimo livello di braccia chiamato B6.
Duplico
B6 e lo chiamo B7.
Sul livello
B7 seleziono la mano e parte della camicia, come si vede nella figura, la prima a sinistra.

CTRL+T
Sposto il perno centrale nella posizione di mezzo in basso.
Ruoto in alto verso sinistra di pochi gradi (fate riferimento alla quarta figura qui sotto.

Duplico
B7 e lo chiamo B8.
La selezione si mantiene da sola, come si vede nella quinta figura.
Ruoto il livello
B8, con l'accortezza di spostare, prima, il fulcro di rotazione in basso a destra, come nella sesta figura.

In pratica abbiamo fatto sventolare la mano per un saluto.

Io mi sono limitato a muovere la mano, ma voi potete anche ruotare un po' il braccio del livello B8, oppure fare altri livelli con rotazioni successive: a vostro gusto.
 
   

 
14
    Quel che si ottiene in animazione lo si vede qui sotto.
In ImageReady ho reso visibili, in sequenza di fotogrammi ed uno alla volta, i seguenti
livelli:
 
   
fotogr.
1
2
3
4
5
6
7
8
9
10
livello
B1
B2
B3
B4
B5
B6
B7
B8
B7
B6

fotogr.
11
12
13
14
15
16
17
18
livello
B7
B8
B7
B6
B8
B6
B4
B1
 
   

 
15
   

Si tratta ora di rifare le stesse cose per gli altri 3 personaggi.
Solo un consiglio: dovendo utilizzare il tutto su ImageReady che non dispone degli sprite (e del loro svilupparsi in un tempo fuori dal tempo del filmato), ma solo della possibilità del loop, cercate di organizzare il numero di livelli delle braccia dei vari personaggi in modo tale che, al termine dei fotogrammi totali dell'animazione, non vi rimanga qualcuno con il braccio fuori posto.
L'ideale è usare per tutti lo stesso numero di livelli: in questo modo l'animazione finale, che mettiamo occupi 18 fotogrammi come nell'esempio qui sopra, conterrà tutti i movimenti fluidi per ciascuno.
Altra cosa è la sincronia fra i movimenti: nessuno vieta di anticipare il movimento di qualcuno rispetto al movimento di altri: sarà il loop a rimettere tutte le cose a posto in quanto per ciascun personaggio dovrete ultimare un ciclo di saluto che sia contenuto nei fotogrammi totali, sia che partiate con il braccio in basso, sia a metà, sia in alto, oppure con la mano che svolazza.



Credo sia tutto.
Ops.
Mi scordavo i ... saluti!

 

fine della guida

 
 


Non ho Copyright © poichè non so l'inglese. 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