nebbiaenuvole
guide animazione 2D Photoshop, ImageReady, Swish Max
  
animazioni difficili
lente d'ingrandimento
___________________
quarta parte
___________________
 
lente

 

Lente d'ingrandimento.
Quarta (ed ultima) parte

L'animazione. Che l'era l'ora.

In prima battuta prepariamo l'animazione, poi finalmente muoviamo la lente sul testo.
Tutta la parte di lavoro su Photoshop è oggetto di una guida on-line. Che ha un difetto: mostra un testo differente da quello che abbiamo usato fino ad ora, ma non è importante. conta il procedimento.
E poi ne ha un altro: la cornicetta nera che indica l'inquadratura è diversa (più bassa) da quella che poi ho usato per il lavoro qui. Ma anche in questo caso si tratta solo di capirci.
Che di rifare l'on-line proprio manco se mi pagano, ecco.

Cliccando su riquadro Photoshop (appena qui sotto) si può vedere una guida animata (ma poco animata) che dovrebbe essere utile a chiarire i passaggi da eseguire, dal punto 46 al punto 51.
Una roba un poco artigianale, senza pretese, vedete voi.
(Quando uno mette le mani avanti -come in questocaso - è segno che quel che passa
il convento non è granchè).

 
     
Tutorial on line
         
      Photoshop          
46
   

Spiegone:

Per fa correre la lente (che se va del passo suo ci metto
un secolo) lungo il percorso ho due possibilità, visto che la lente si porta appresso il testo ingrandito.

O collego lente e testo e ne faccio tanti livelli quanti sono i fotogrammi (ma il PSD poi diventa pesantuccio),

oppure uso solo una lente (che muoverò poi su ImageReady) e faccio solo i livelli col testo (sopra al cerchio bianco che copre il testo piccolo).

Naturalmente il percorso è libero, più frames mettiamo, più l'animazione sarà fluida, ma anche più pesante.

Qui sotto ne ho messo uno di riferimento (senza il testo, solo i cerchi).
Per ogni cerchio ora devo produrre un livello, che sarà anche un fotogramma in animazione.
Il come farlo l'abbiamo visto al punto 41 e seguenti della terza parte, ma qui lo riassumo, almeno per un paio di fotogrammi.

 Photoshop
   


 
47
    Ridimensiono il file a 600 pixel di larghezza (altezza immutata)

Devo dare una spiegazione.
Il filtro distorsione > effetto sfera ingrandisce a partire dal centro verso i bordi della zona selezionata.
Se la lente non è TUTTA sullo schermo il filtro lavorerà in modo scorretto. quindi devo allargare il quadro per avere sempre la tutta la lente visibile.

Per comodità sull' immagine ho messo una cornicetta nera che indica l'inquadratura finale.

Sistemo la lente in posizione di partenza. In realtà la lente arriverà dalla sinistra, fuori campo. Per partenza intendo il fotogramma nel quale la lente si posa per la prima volta sul testo.

Collego lente, registro e ombra e muoverò i tre livelli più o meno come nella figura (se volete partire da qualche altra parte, muoveteli lì, neh)		  
   


 
48
    Preparo un cerchietto di registro che mi servirà lungo la corsa della lente:

Duplico registro (registro copia)
Seleziono la trasparenza di livello di registro copia
Usando la selezione, lo riempio di bianco (mi pare fosse grigino, se era bianco non serve riempirlo di bianco).
Riduco la selezione di 2 pixel
Menù > Selezione > Modifica > contrai
e poi traccio un perimetro di colore nero, di 1 pixel, interno:
Menù > Modifica > traccia

Oscuro lente. Da qui in poi non mi serve, la muoveremo in aminazione.

(Ho rimesso a posto il riquadro per non ridurre troppo l'immagine qui, sulla guida. La scritta piccola è opacizzata al 50%, sempre per la visibilità)		  
   


 
49
   

Duplico TESTO G (TESTO G copia)
Duplico registro copia (registro copia 1)
Dispongo i livelli:

TESTO G (lo oscuro)
registro copia (lo oscuro)

TESTO G copia
registro copia 1
Oscuro i livelli superiori (TESTO G - registro copia)
Mi serviranno per il prossimo step-fotogramma.

  
   

 
50
   

Seleziono la trasparenza di livello di registro copia 1
Seleziono il livello TESTO G copia (ho trasferito la selezione del cerchio sul testo)

Deformo il testo (Menù > filtri > Distorsione > Effetto sfera. distorco del 30%.

Inverto la selezione (catturo tutto quello al di fuori del cerchio)

Cancello il superfluo del testo (tasto CANC)

  
   


 
51
   

Step 3

Collego fra loro registro copia 1 e TESTO G copia (deformato).
Unisco i due livelli collegati (Menu' > Livello > unisci collegati)
Rinomino il livello: Frame 1 (Negli step successivi li chiameremo Frame 2, 3, etc)

Seleziono registro copia (quello oscurato allo Step 1) e lo muovo lungo il percorso (qui il secondo fotogramma)

Riparto dallo Step 1 per un nuovo frame e cosi' fino alla fine del percorso.

Importante: muovere il cerchio e poi duplicare, per avere una copia da cui ripartire nel frame successivo.
Prima di collegare registro copia x e TESTO G copia x, sistemate il TESTO G x al di sopra del registro.

Tutta questa parte è contenuta nel tutorial Photoshop.

  
   


 
1
  Fotogramma 1

Come detto in premessa le immagini riportano un testo differente, anche come colore. Non è importante, tanto più che i nomi dei livelli e le operazioni sono le stesse; è che mi piaceva lasciare la vecchia versione della guida (no, la verità è che non mi andava di farne un'altra, ma non ditelo in giro).

Anzichè generare automaticamente i frames dai livelli preferisco controllarei i fotogrammi.
Così i movimenti della lente (che vanno eseguiti qui) avverranno in successione, ripartendo, per ogni frame successivo, dalla posizione del frame precedente.

Lo schermo finale è quello bianco. La parte nera intorno deriva dall'ingrandimento del riquadro.

Sul pannello Livelli rendo visibile lente e ombra, li COLLEGO fra di loro.
(testo sarà sempre visibile per tutta l'animazione)

ImageReady
   


 
2
  Fotogramma 2 Duplico il fotogramma corrente (significa che inserisco 1 fotogramma dopo il fotogramma 1)
Ottengo il fotogramma 2 (quello evidenziato) identico al fotogramma precedente (1)
Dalla versione 7 il Fotogramma 1, se non si deseleziona l'opzione, propaga lungo tutta l'animazione i suoi contenuti, di livelli e di posizione. Preferisco partire dal Fotogramma 2, che non dà problemi.
  
   


 
3
  Fotogramma 3

Duplico il fotogramma corrente (significa che inserisco 1 fotogramma dopo il fotogramma 2)
Ottengo il fotogramma 3 (quello evidenziato) identico al fotogramma precedente (2).

I fotogramma 2 e 3 sono quelli che ora uso per il tweening. Per l'ingresso della lente sul palcoscenico, insomma.

  
   


 
4
  Fotogramma 2

Seleziono il Fotogramma 2.
Sposto lente e ombra (sono collegati, basta selezionare uno dei due livelli e l'altro lo segue) fuori schermo.

  
   


 
5
  Fotogrammi 12-13 Eseguo il tweening (10 fotogrammi)
Ed arrivo al fotogramma 13.
Ovvero: fotogramma 1, fotogramma 2, 10 fotogrammi di tweening, fotogramma 3 (13, dopo il tweening).

A questo punto elimino il Fotogramma 1.
Seleziono l'ultimo fotogramma (12) e rendo visibile Frame 1.		  
   


 
6
  Fotogramma 13

Duplico il fotogramma corrente (fotogramma 12) e ottengo una copia (fotogramma 13)

Sul pannello Livelli oscuro Frame 1 e rendo visibile Frame 2 (la posizione successiva)
Dovrò spostare la lente e l'ombra a registro su Frame 2.


  
   


 
7
  Fotogramma 13 Seleziono i livelli lente e ombra collegati fra loro (basta selezionarne uno, l'altro ci segue)
Li sposto a registro di Frame 2.
  
   


 
8
  Fotogramma 14

Duplico il fotogramma corrente (fotogramma 13) e ottengo una copia (fotogramma 14)

Sul pannello Livelli oscuro Frame 2 e rendo visibile Frame 3 (la posizione successiva)

  
   


 
9
  Fotogramma 14

Ho sempre in selezione i livelli lente e ombra collegati fra loro.
Li sposto a registro di Frame 3.

  
   


 
10
  Fotogrammi 15

Duplico il fotogramma corrente (fotogramma 14) e ottengo una copia (fotogramma 15) ....
... e così via, fino all'ultimo livello Frame x.

Alla fine, faccio uscire lente e ombra dal campo visivo, in un certo numero di fotogrammi. In essi oscuro l'ultimo livello Frame x (la lente non è più sulla scritta).

Ottimizzo (qui i ho usato il massimo, 256 colori e dithering 100%)
Salvo ottimizzato col nome ........ (fate voi)

  
   


 

fine
 
 


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
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/