nebbiaenuvole
guide animazione 2D Photoshop, ImageReady, Swish Max
 
rotazione
___________________
 
    Animazione Testi - rotazione testo sull'asse Y

Come far ruotare le lettere sull'asse Y

Per chi si fosse collegato ora, tutta la disquisizione sugli assi la potete trovare qui in giro. Vi metto un link, ma poi tornate qui, altrimenti la lettera A non ruota: > Giralalira

1
   

o sto lavorando con Photoshop su un'immagine
400x400 px. Fondo nero.


Strumento testo: scrivo A, di colore bianco.
Il font è ininfluente (qui ho usato il solito (Lucida Sans Unicode).

Duplico il livello testo e lo rasterizzo.

Un testo vettoriale si può deformare solo sulle cartesiane (esclusa la Z, purtroppo) quindi per usare lo strumento prospettiva mi tocca rasterizzarlo.

Photoshop
   

 
2
   

Dunque, ora duplico di nuovo.

Modifica > Trasformazione libera.

Usando i numeri in alto sulla barra menù riduco in orizzontale (L per intenderci) dell'80%.

Modifica > Prospettiva.

A seconda del senso di rotazione (oraria - antioraria) prima ingrandisco un lato (qui il lato destro) poi riduco il lato opposto.
Non tanto, diciamo che mi regolo in base a quell'80% di dimagrimento che ho fatto in precedenza.

Il fatto dell'80% non è casuale.
Dovendo ruotare solo una lettera sarebbe ininfluente.
Dovendone ruotare altre è bene che la deformazione sia idendica. Quindi il primo passo è 80% (nell'esempio, ma se usate rotazioni veloci, con un passo maggiore di gradi, ricordatevi i numeretti, magari segnateveli, oppure cambiate nome al livello, utilizzando come nome il numero dei gradi).

(Ho reso leggermente trasparente la A di base)

 
   

 
3
   

In tutto l'ambaradan la lettera si è spostata leggermente a sinistra.

Prima di andare avanti la riporto al centro della A di base.

Una cosa dimenticavo, in merito alla prospettiva: quando ingrandite un lato e riducete l'altro dovreste far caso a che l'ingombro centrale (il punto più alto in mezzo) della lettera non superi l'ingombro centrale di quella di base.

 
   

 
4
    Duplico il livello (quello deformato prima)
Modifica > Trasformazione libera
e coi numeri riduco ancora dell'80%.

Un'alternativa alla "trasformazione libera" è l'uso dell'opzione "trasforma di nuovo", ma occorre fare attenzione che nei passaggi la trasformazione non sia nè scarsa nè eccessiva.

Modifica > Prospettiva.
Ingrandisco e riduco sempre seguendo le indicazioni di prima.
 
   

 
5
   

Duplico, deformo e così via.

Alla quinta duplicazione riduco un po' di piu' sull'orizzontale

Modifica > Trasformazione libera. L = 50%
Modifica > Prospettiva. (come sempre)

 
   

 
6
   

Duplico, e sono alla sesta
(7° livello, contando la prima)


Modifica > Trasformazione libera. L = 50%
Modifica > Prospettiva. (come sempre)

 
   

 

 

     
Tutorial on line
         
      ImageReady          

7
   

Per come creare i fotogrammi guardate: clessidra (quasi al fondo)
oppure apritevi la guida animata ImageReady

Quello che dovreste ottenere, a questo punto, è una semi-rotazione. La lettera, una volta arrivata quasi di profilo, non si rigira, non mostra il lato oscuro, l'altro, il lato B (ovviamente, è la lettera A)

ImageReady
   

 
8
   

Una prima possibilità è quella di duplicare tutti i fotogrammi ed invertirne la sequenza (sempre agendo sulla freccina a sinistra della palette di animazione. Ma quello che si ottiene è sempre un mezzo giro:

 
   

 
     
Image Ready
    Avrete notato che ho saltato un passaggio, non ho riportato la I al posto iniziale e la R a metà corsa verso il basso.

Questione di velocità, diventava un po' melensa, almeno per me. A, la velocità: tutti i frames con permanenza 0, ok?
Molti ricorrono a tempi superiori, specie per non realizzare tutti i fotogrammi necessari. Ho visto nevicate con due fotogrammi ed un tempo di 0,2, che più che neve sembra un neon.

A proposito di neve, la nevicata su incip.it dei mesi invernali è realizzata con tre soli fotogrammi (questione di peso), e se ci fate caso a ben ben fissare solo una zona di neve, vedrete uno stacco, addirittura come se risalisse.

Ma voi non fateci caso, neh?

9
   

La soluzione corretta è tornare su Photoshop e duplicare tutti i livelli della rotazione esistente.
Se ce la fate, metteteli in fila al contrario, al di sopra dell'ultima rotazione (quella sottile sottile)

Collegate fra di loro questi livelli duplicati e ruotateli in orizzontale:

Modifica > Trasforma > Rifletti orizzontale.

Mentre ci siete, spostateli (magari meglio oscurarli tutti meno il primo, quello più largo) in centro alla lettera di base, come nella figura.

Photoshop
   

 
10
   

Questa soluzione, però, funziona solo con lettere simmetriche.

Nell'esempio il font (carattere) che ho usato non è simmetrico.
La gamba destra della A è più spessa di quella sinistra.
E questo determina uno sgancio al momento del raccordo fra la rotazione al contrario e la lettera in piano.

Image Ready
   

 
11
   

Qui è facile rimediare, basta eliminare il fotogramma di partenza, quello con la A in piano, e tutto funziona molto meglio:

 
   

 
   

 

Ah, l'effetto per far sembrare che la luce arrivi da destra lo si ottiene rendendo sempre meno opaca la lettera, nella prima semi-rotazione, fino ad arrivare ad un 20% quando è sottilissima (settimo fotogramma, sesto se abbiamo tolto il primo).
Ho aggiunto un fotogramma nero a dividere le due semi-rotazioni, ma non è indispensabile.

 
12
    Con le lettere asimmetriche c'è poco da fare:
Bisogna rifare tutto dal lato opposto:

Duplico la lettera di base e poi:
Modifica > Trasformazione libera: L = 80%
Modifica > Prospettiva.

Ora ingrandisco il lato sinistro poi riduco il lato opposto.

Ripeto tutto, duplicazione, trasformazione e prospettiva, fino a coprire i livelli della semi-rotazione precedente.

Con la lettera A non si nota.
Vi mostro la lettera B.
Photoshop
   



 
13
   

Qualcosa non va, vero?
già, ci sono due semi-rotazioni, ma al termine della seconda la B è capovolta e non si raccorda col primo fotogramma, dove la B è dritta. Bisogna fare qualcosa, ed ecco cosa:

Tornare su Photoshop.

Duplicare tutti i livelli di una semi-rotazione.

Collegare fra di loro questi livelli duplicati e ruotarli in orizzontale:
Modifica > Trasforma > Rifletti orizzontale.

Duplicare tutti i livelli dell'altra semi-rotazione.

Collegare fra di loro questi livelli duplicati e ruotatari in orizzontale:
Modifica > Trasforma > Rifletti orizzontale.

 
   

 
   

 

Ora funziona tutto. Per evitare un piccolo "sgancio" ho tolto di mezzo i due fotogrammi dove la B è in piano, sia dritta che capovolta. Funziona meglio, provare per credere.

Naturalmente la rotazione può avvenire in senso orario o in senso antiorario. Qui l'ho fatta al contrario rispetto alla A, tanto per rimettere la testa a posto

 

 

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