[Tutorial] Conceito Basico Animação

1º- Position

Nessa parte você vai aprender a fazer animações simples de movimento de texto ou caixas.

Essa é a nossa TIMELINE,
como vocês podem ver, ela tem varias opções para serem setadas como:
Position (posição dela na imagem), Opacity (opacidade no momento), Style
(estilo que você pode alterar dando 2 clicks na layer) e Text Warp (não
vou entrar em detalhes, pois não acho util no momento).



Agora você deve clickar no relogio que está na linha do Position, ao clickar ele gera um KEYFRAME de inicio que será o frame onde a sua imagem começará a fazer parte da animação.





Para adicionar animação basta mover a linha que marca o Timeline e depois mover a imagem na aréa de trabalho do photoshop. Como podem ver, é criado um Keyframe na timeline.


Depois de criar varios pontos sua animação vai estar assim (quanto mais longe os keyframes, mais lenta será a animação):


Caso você queira que sua imagens simplesmente apareceça do nada é só você marcar essa opção Hold Interpolation.


2º Opacity

Agora
é a hora da opacidade, é a mesma coisa que com o position, só que aqui
você regula a opacidade que ela irá aparecer, bom pra fazer "letreiros
piscando" ou seu nome/nick aparecendo e desaparecendo. Não vou detalhar
aqui, pois se você leu acima, vai entender a "lógica" desse.


Você
também pode fazer com que a opacidade o mesmo que foi feito com o
movimento, podendo mudar de opacidade instantaneamente, marcando como Hold Interpolation.


E ficará assim:


Agora os 2 juntos



3º- Styles
Nesse
momento acho que não existe mais nada a ser explicado, a não ser o que
são styles, para os que não sabem. Style são aquela coisinha que você
faz normalmente na sua tipografica pra deixar ela mais encorpada e
bonita. Para entrar no meu styles bata 1 duplo click na layer que você
quer editar e mudar conforme sua vontade. Agora o exemplo de style em
transição e style instantaneo, lembrando mais uma vez, que para fazer o
ultimo basta por Hold Interpolation.



E com Hold Interpolation



Agora os 3 juntos [Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]



4º- Passo

Salvando. Para salvar vá em Save for Web & Devices > Save.