Posapiano
__________________
Prima parte __________________
Seconda parte __________________
Terza parte __________________
Come navigare __________________

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


Animazioni digit ... ate

E mi spiego.
Qui tutto il movimento lo fate da tastiera, semplicemente utilizzando spazi e "a capo". Quello che si ottiene è un testo animato, nel senso che la scritta si muove lungo il percorso che avete deciso di realizzare.

La roba, l'idea, m'era venuta qualche anno fa, ma proprio per sbaglio. Succede spesso che maneggiando qualcosa in modo distratto uno faccia delle scoperte. Che poi non so neppure se è una mia idea o se l'ho pescata in giro senza rendermene conto. Ovviamente avevo visto testi che scorrono, titoli di coda, sottopancia, et similia.
Et similia sta per: e quant'altro ma a me di scrivere quant'altro (sarà mica quantaltro?) proprio non mi va.
Ma il testo che si modifica, nel senso che è la modifica delle lettere che genera il movimento, beh, proprio non me lo ricordo d'averlo visto, allora.

Tant'è che poi, alla fine del tutorial (scrivo tutorial che, se scrivo guida, su google col cavolo che ci si ritrova) magari vi racconto quello che m'è venuto in mente.

Questo capitolo qui ha all'interno un tot di pagine, con esempi che man mano vi mostro qui sotto, ma proprio appena qui sotto, non in fondo, così uno clicca su quello che gli va e non perde tempo ad usare il pulsantino triangolare in alto, ok?



 
   

Photoshop

   
 
1
_____________________________________________________    
 

 

Apro Photoshop. Creo un nuovo file, fondo nero, 400x325 pixel (le misure non sono obbligatorie)

Con lo strumento testo scrivo "Questo è un testo che si posa dolcemente sul fondo" di colore bianco, centrato in mezzo, corpo 30.
Il testo del testo (sic) ovviamente sceglietelo voi, come pure il colore, il font, il corpo, etc.
Naturalmente il testo sborderà ai lati dell'immagine (a meno che abbiate usato un corpo piccino piccino)

Qui la scritta di riferimento è quella in alto nella figura qui sotto.

   
 

 

 
2
____________________________________________________  
 


Duplico il livello del testo.
Trascino il testo (il livello) a destra, per vedere la parte iniziale (come nella parte bassa della figura qui sopra)

Doppio clic sull'icona T per attivare la funzione di modifica del testo.
Controllo il valore dell'interlinea sul pannello carattere. Ci metto un bel 30 (uguale al corpo del carattere) così evito brutte sorprese (tipo che il testo, alla prima interlinea mi finisce a Canicattì). Sistemata l'interlinea procedo ...

Clicco nella zona fra le lettere Q e
u e dò invio.

E mi capita una cosa strana: la Q sparisce ed il testo si sposta in basso.


 
 

 

 
3
____________________________________________________  
 


Dontuorri (che sarebbe niente paura) è solo l'effetto dell'interlinea che ha fatto scendere tutto il testo, tranne la Q.
Ma la
Q dov'è finita?
Beh, il testo è giustificato in mezzo, quindi la
Q si è messa in mezzo alla scritta, un'interlinea sopra.
La si potrà vedere spostando il testo verso destra.

 
 

 

 
4
____________________________________________________  
 


Riposiziono il testo verso destra e proseguo

Clicco fra le lettere u e e e dò invio, clicco fra e e s e dò invio, e cosi' via, fino alla fine del testo.
Alla fine sposto il testo in mezzo ed in basso

Questo livello lo chiamiamo
base, e ci servirà fra poco per riallineare i testi verso il basso. Ora non è chiaro ma fra poco lo sarà.

 
 

 

 
5
____________________________________________________  
 

Duplico il livello base
Doppio clic sull'icona T, porto il cursore appena dopo la lettera
d e tolgo l'interlinea (tasto CANC)
Il testo sale verso l'alto, accidenti.
Ancora dontuorri. Poi sistemiamo.

 
 

 

 
6
____________________________________________________  
 


Duplico il livello.
Doppio clic sull'icona T
, porto il cursore appena dopo la lettera n e tolgo l'interlinea (tasto CANC)
Il testo continua a salire.

Duplico livelli e tolgo interlinee. Ad un certo punto mi ritrovo nella situazione che se tolgo ancora un paio di interlinee il testo sparisce (Se volete accelerare potete fa scendere 2 lettere alla volta).

La situazione è più o meno questa dell'immagine qui sotto (Ho lasciato visibile la base, più scura)

Mi dimenticavo: se nel togliere l'interlinea le parole si appiccicano, metteteci uno spazio (è il caso di
sul fondo)

 
 


 
7
____________________________________________________  
 


Seleziono il livello base collego a quel livello gli altri livelli

Menù > Livelli > allinea collegati > bordi inferiori.
E tutte le righe di testo si allineano in basso.

Continuo di duplica livello e d interlinee. Ora vi mostro i livelli decisivi.
Da qui in poi la riga in fondo non si modifica più e si inizia a togliere l'interlinea sulla terza riga (qui la lettera
s)

 
 

 

 
8
____________________________________________________  
 


Da qui in poi le due righe in fondo non si modificano più e si inizia a togliere l'interlinea sulla quarta riga (qui la lettera u)

 
 

 

 
9
____________________________________________________  
 


Questo è il testo leggibile. In animazione gli daremo un tempo di permanenza che ne consenta la lettura.

 
 


 
10
____________________________________________________  
 


Ora dovrei far posare tutte le lettere sul fondo. Qui lo facciamo con più di una lettera lla volta, ma la tecnica è la stessa.

Per prima cosa duplico il livello.
Far scendere le righe è un po' più complicato. Si fa cosi':
Sempre dopo il doppio clic sull'icona T metto il cursore prima della lettera che voglio far scendere.
Dato che voglio far scendere è un , metto il cursore prima della è e dò invio

 
 

 

 
11
____________________________________________________  
 


Ora devo far risalire un testo che si ed anche l'altra riga che è finita sotto.
metto il cursore dopo la lettera è e cancello l'interlinea
(tasto CANC)

 
 

 

 
12
____________________________________________________  
 

Sposto che si posa sull'ultima riga: metto il cursore prima
della c
(he si posa) e dò invio

 
 

 

 
13
____________________________________________________  
 

Poi faccio risalire è un testo che
metto il cursore dopo la lettera
(ch)e e cancello l'interlinea (tasto CANC)

 
 

 

 
14
____________________________________________________  
 


A gruppi di una, due o tre lettere, faccio scendere tutto alla riga inferiore più o meno così:

Duplico il livello:
Questo è
un testo che si posa dolcemente sul fondo

Duplico il livello:
Questo
è un testo che si posa dolcemente sul fondo


Duplico il livello:
Questo è un testo che si posa dolcemente sul fondo

 
 

 

 
15
____________________________________________________  
 

Ora lo faccio sparire ai lati dello schermo, duplicando il livello precedenteper ogni passaggio


Per farlo ho due sistemi: o aggiungo spazi dopo ogni lettera (complicato, non fatelo)
oppure modifico l'interspazio, modificandone il valore (mettiamo il segno +, altrimenti si restringe) accanto all'iconcina sul pannello testi.

 
 

 

 
16
____________________________________________________  
 

Quando arrivo verso la fine, dato che oltre ad un certo valore di interspazio non si può andare, aggiungo spazi a mano fra le ultime lettere che ancora si vedono.
Se per caso (e vi capiterà, oh se vi capiterà) non sono simmetriche (cioè centrate sullo schermo),
sposto in orizzontale la scritta in modo che lo diventino.

Questo è l'ultimo livello. Il prossimo sarebbe vuoto.

 
 

 

 
17
____________________________________________________  
 
bien, c'est tout, è tutto. Passo ad ImageReady
 
   

 

ImageReady

   
 
______________________________________________________________________________    
 

 


Anche qui la cosa è semplicissima.

Per prima cosa uso la funzione: crea fotogrammi dai livelli
(per farlo cliccate e tenete premuto il triangolino in alto a destra sul pannello dell'animazione e scegliete l'opzione sul menù a comparsa, ok?)

ImageReady vi sbrodola un tot di fotogrammi sulla palette di animazione. e tutti mano il primo saranno col fondo trasparente, ed essendo quelli relativi ai livelli di testo, che è bianco, non vedrete una cippa. Ok, ora si fa così:
Selezionate tutti i fotogrammi (per farlo comodamente, sempre il solito triangolino e scegliete l'opzione sul menù)


   
 
______________________________________________________________________________    
   


Ora andate col mouse sul pannello dei livelli e rendete visibile il fondo. E come per magia ora li vedete i testi, si?

Selezionate il primo fotogramma, quello col solo fondo nero. Cancellatelo (basta trascinarlo sul cestino in basso sul pannello dell'animazione)
Se vi spariscono tutti i fotogrammi meno uno vuol dire che non avete selezionato SOLO il primo fotogramma, ma li avevati tutti in selezione.
Date undo (Menù in alto > Modifica > Annula cancella), selezionate il primo fotogramma e buttatelo (meno male che era semplice, neh?)

Se a questo punto provate a vedere l'animazione noterete che qualcosa non convince: il fatto che la fila di lettere sia già presente sul primo fotogramma, vero?

   
 
_________________________________________________________________________    
   


Io mi comporto così, e lo faccio per evitare che qualsiasi modifica sul primo footogramma incida sul resto dell'animazione.

Duplico il 1° fotogramma.
Duplico ancora il 1° fotogramma (il 2° in effetti, ma sono identici).

Ora ho tre fotogrammi uguali, in testa all'animazione.
E facciamo il tweening.


   
 
__________________________________________________________________________    
   


Per chi c'è già stato il tweening lo sa cos'è. Per chi non lo sa, c'è una spiegazione, riguarda un'altra guida, ma fa lo stesso: cliccate qui: tweening

Seleziono il 2° fotogramma. Passo sul pannello dei livelli e clicco sul penultimo livello in basso (fra l'altro è il solo, col fondo, ad avere l'occhiolino). Vado col mouse sull'immagine e, tenendo premuto il tasto SHIFT (MAIUSCOLO)
sposto il testo in alto, fino a farlo scomparire.

Ora seleziono il 2° ed i 3° fotogramma (per farlo prima clic sul secondo poi, pigiando sul tasto Ctrl, clic sul terzo).
Vado sul triangolino magico a destra in alto del pannello animazione, apro il menù a comparsa e scelgo l'opzione tweening.

Sul pop-up che si apre lascio tutto com'è, ma modifico il numero di fotogrammi da creare.
Io ho usato 8, il che significa che ImageReady mi genererà 8 fotogrammi fra i due che ho in selezione.

Diamo ok e vediamo di togliere un fotogramma di troppo, il primo, che lui è rimasti lì in posizione iniziale e proprio è fuori posto.
Seleziono il 1 ° fotogramma e lo butto via.

   
 
____________________________________________________________________________    
   


Resta da sistemare qualcosa nei tempi di animazione. Nel creare i fotogrammi ImageReady mette automaticamente un tempo 0 di permanenza del fotogramma. Il che va benissimo per tutti, salvo per il primo e per il .... non so quale sia per voi, ma è quello dove il testo è visibile su tre righe, quello della ottava (a partire dal basso)immagine di questa pagina
Seleziono il primo fotogramma e gli dò un bel 0,2 (clicco su 0 sec. sotto al fotogramma, si apre una tendina, scelgo 0,2) : Poi seleziono quell'altro, quello con la scritta su tre righe e gli dò uno 0,5, massimo 1 sec.

Il risultato lo vedete qui sotto.

   
   

 

   
         
fuori di ... guida
____________________________________________________  
 


Ora Il fatto a cui accennavo prima. Che non ha a che fare con l'animazione, ma ....

Beh, qualche anno fa giochicchiavo coi banner e m'ero stufato di far testi che slittano da sinistra a destra o viceserva (si, viceserva, volutamente viceserva) o vanno su e giù, ed allora, scocciato, avevo dato un invio di troppo sulla tastiera ed il testo si era ... mosso.
Ora nel riscrivere i passaggi mi è venuto in mente matrix.
Il film, cioè non tutto, solo quella parte con quelle file di lettere/numeri che non ricordavo bene se scorrevano dall'alto in basso o si limitavano a cambiare, dando l'impressione di un movimento (Allora propendevo per il cambio, tipo conteggio alla rovescia, per intenderci.).

E m'è venuto in mente di realizzare quell'effetto, solo col cambio di numeri da un fotogramma all'altro. Insomma fare un'animazione da tastiera. Ma tanto per non sbagliarmi sono andato in giro per il ueb (che sarebbe il web) a cercare qualcosa su quella sequenza, per rinfrescarmi la memoria.
Ed ho trovato di tutto, davvero. Sia filmati che tutor per schermate fisse, animazioni cortine (si, di un tre quattro fotogrammi) ma fra tutto quello che ho trovato non ce n'era una con l'animazione del testo.
Cioè, si, ci sono codici per programmare lo schermo del piccì, ma niente di ... trasportabile, ecco.
E quei pochi che si piccano di animare col solo movimento dall'alto in basso, si, quello che mi aveva stufato anni fa, ci mettevano anche l'indicazione: NON COPIARE.
Ma quando mai, ma COPIATE, porca l'oca.

Solo che vedere tutta quella roba mi ha fregato. Ho cercato di rifare quella, non quella che avevo in testa io.
Ed allora sono nate tre versioni di matrix. Dell'effetto matrix, come lo si chiama.
Una con tutto che scorre, un'altra con tutto che scorre, ma non va mai via, ed una terza con tutto fermo lì, ma sembra che scorra.
Non vi dò il link delle pagine qui nel posto, le sto preparando e quando saranno finite mi sarò dimenticato di quello che scrivo ora, qui, ma un link lo troverete di sicuro magari su incip.it o sulla bussola o su Photo_Stop ... urca, ma quante pagine ho già fatto?

Tutto questo, in verità, era per dire che uno non sa mai se un'idea è la sua o di un altro, che magari hai visto senza tanto farci caso e poi ti viene in mente proprio come fosse tua, ecco.
Per questo il: ma COPIATE, accidenti, che tanto lo facciamo tutti, sapendolo o no. C'est vrai? L'è vero?


 
P.S.:
____________________________________________________  
 


In tema di gratis e non gratis: di gratis non c'è niente in giro per il mondo. Qualcosa si deve dare. Qui ci dovete dare di olio di gomito, altrimenti, una volta copiata una roba, poi quella avete, non quella che avreste voluto fare, quella che immaginavate, quella che ... insomma, chiaro il concetto, neh?
Sorry, ma dirlo lo dovevo pur dire una volta o l'altra, no?


 
     
 
 
 
 
 
 
 
 
   
 
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/