[Tutorial] Como fazer um Banner.Gif #2

[Pekenu]

http://i.imgur.com/u5PJ0tR.gif

 

Olá pessoal do fórum, venho aqui trazer outro tutorial movimento (efeito escrita) de banner.gif  (Simples), vou ensinar como eu faço, então vamos lá:

[Leia com atenção e vai clicando em "Show"]

 

Parte 1

 

Crie um novo arquivo:

  Mostrar conteúdo oculto

http://i.imgur.com/fJdeH2L.png

 

Coloca a LarguraxAltura que você deseja, no caso vou colocar "350x180":

  Mostrar conteúdo oculto

http://i.imgur.com/p9VrsiW.png

 
Obs: Você pode fazer com fundo transparente ou com uma cor que você deseja, eu vou fazer transparente.

 

Logo depois, você escreve o texto que você deseja para o seu banner.gif, palavra por palavra:

  Mostrar conteúdo oculto

http://i.imgur.com/5UahFRV.png

 

Depois disso coloque em ordem:

  Mostrar conteúdo oculto

http://i.imgur.com/0Ilyz5X.png

Coloque uma cor, fonte etc..deixe do jeito que você desejar. 

 

 

Parte 2

 

Vamos começar a fazer a gif, vai ter uma opção lá embaixo chamada "Criar linha de tempo de vídeo" ao lado disso terá uma seta para baixo, aí vai ter uma opção chamada "Criar quadro de animação" você clica nela:

  Mostrar conteúdo oculto

http://i.imgur.com/zuF9YDH.png

 

Continuando, duplique a frame e deixa todas as palavras invisíveis clicando o "olho":

  Mostrar conteúdo oculto

http://i.imgur.com/dqOG0WZ.png

 

Crie outra frame e deixe visível a primeira letra, crie outra frame e deixa a segunda letra visível...crie outra frame e deixa a terceira visível e vai fazendo o mesmo com o resto:

  Mostrar conteúdo oculto

http://i.imgur.com/j3yHe1f.png
 
http://i.imgur.com/0v5toA3.png

 

Segue este procedimento até ir todas as letras, no final vai ficar assim:

  Mostrar conteúdo oculto

http://i.imgur.com/OuH3eHi.png

 

Agora você clica no primeiro quadro da Linha do Tempo, segurando o Shift você clica no último quadro, depois clica na seta e coloca o tempo que deseja (eu vou colocar dois segundos), e clica em Uma vez coloque Sempre.

  Mostrar conteúdo oculto

http://i.imgur.com/CjBFlvV.png

 

Final

 

E seu Banner.gif está pronto, agora só falta salvar. Clique em "Arquivo", "Salvar para Web" (Alt + Shift + Ctrl + S), você pode ver como ficou clicando no play em baixo das Opções de loop.

  Mostrar conteúdo oculto

http://i.imgur.com/CQAYptL.png

 

E por fim, clique em "Salvar", selecione um lugar no seu computador para salvar e clica em "Salvar".

 

Resultado final:

http://i.imgur.com/wo8Fn1i.gif

 

 

Lembrando que foi um tutorial simples e existem vários movimentos para Banner.gif,

se quiser que eu faça outro, deixe seu like & comentário!

Críticas e dicas construtivas são sempre bem-vindas! Espero ter ajudado vocês.

 

 

NO RIP

[FireS2]

Bom tutorial Pekenu :v

[Pekenu]

  Em 12/08/2017 at 20:58, Firee disse:

Bom tutorial Pekenu :v

Valeu men! sz

[iceysaint]

Ótimo Tutorial anão sz 

[yFeeh]

Ótimo tutorial kena1 vou tentar fazer sz

[Pekenu]

  Em 12/08/2017 at 21:01, AnnaGN_ disse:

Ótimo Tutorial anão sz 

Valeu annão! sz

 

 

  Em 12/08/2017 at 21:07, Fvlipeloxx disse:

Ótimo tutorial kena1 vou tentar fazer sz

Valeu fivê, quero ver hein! sz

[Anjoh]

Ótimo tutorial!

[Cadelinha]

Ótimo tutorial

[yFeeh]

  Em 12/08/2017 at 21:09, Pekenu disse:

Valeu annão! sz

 

 

Valeu fivê, quero ver hein! sz

aqui lindãoo 

http://i.imgur.com/XhNOtrv.gif

[Pekenu]

  Em 12/08/2017 at 21:10, Anjoh disse:

Ótimo tutorial!

Valeu Predu! sz

 

 

  Em 12/08/2017 at 21:23, Poicu disse:

Ótimo tutorial

Valeu! sz

 

 

 

  Em 12/08/2017 at 21:58, Fvlipeloxx disse:

 

aqui lindãoo 

 

Ai sim fivê, agora é só usar a criatividade e fazer um banner.gif topper.

[bra2k]

Eu tentei, mas eu fechei o photoshop na metade do processo.

[MrErik_]

kkkk como eu so tao nub não sei de quase nada disso qual programa é esse ou qual site ?

[Pekenu]

  Em 30/08/2017 at 01:24, erikmaciel disse:

kkkk como eu so tao nub não sei de quase nada disso qual programa é esse ou qual site ?

Photoshop cs6 

[MrErik_]

VLW <3

[TristezaAll]

Ótimo tutorial.

Vai ajudar muito os iniciantes.

[_Fasster]

up up so pros cara aprender. Nice

[RrRyanBR]

No meu photoshop cs6 não tem essa opção ''Criar linha de tempo de video'' Oque eu faço?

[Eryn]

  Em 28/09/2017 at 01:03, RrRyanBR disse:

No meu photoshop cs6 não tem essa opção ''Criar linha de tempo de video'' Oque eu faço?

Vá em ''Janela'' e clique na ''Linha do Tempo''