Início
Loja
Procurar
Registar
Entrar[Tutorial] COMO FAZER UMA USERBAR ANIMADA
+9
Rafa_Show
Micael_uOLLL
Plank
Urielcastro
Tonito
Matheus
Fabricin__
Zangado
TheDrunK
13 participantes
Design
TheDrunK
Experiente
Nick in-game : TheDrunK
Mensagens : 129
Registro : 17/06/2013
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Empty](https://2img.net/i/empty.gif)
[Tutorial] COMO FAZER UMA USERBAR ANIMADA
Ter 23 Jul 2013 - 23:12
É bem simples, basta ter o Photoshop CS5.
Começando...
1º - Abra um novo documento com o tamanho 350×20 (se quiser com borda abra um com o tamanho 352×22.)
Eu vou abrir um documento com o tamanho 352×22 por que quero com borda.
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Z2n](https://2img.net/r/ihimg/a/img826/359/z2n.gif)
2º - Escolha uma cor para o fundo.
Aperte a letra G, para pegar o Balde de Tintas.
No caso, usaremos a cor vermelha.
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Hzw](https://2img.net/r/ihimg/a/img593/3845/hzw.gif)
3° Agora dá 2 Cliks na camada da imagen do projeto.
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Cp1](https://2img.net/r/ihimg/a/img198/5167/cp1.gif)
»![[Tutorial] COMO FAZER UMA USERBAR ANIMADA 9qw](https://2img.net/r/ihimg/a/img153/8991/9qw.gif)
4° Vá em (Sobreposição de Padrão) Dps escolhe um detalhe para a userbar fica mais animada eu vo escolher essa da print acho uma boa, dps clique em OK.
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Tda0](https://2img.net/r/ihimg/a/img4/6111/tda0.jpg)
Resultado:
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Dsm](https://2img.net/r/ihimizer/img713/190/dsm.gif)
Se não conseguiu que o seu projeto, ficasse igual ao meu, salve a imagem abaixo, abra com o seu PhotoShop, copie e cole em cima do seu projeto
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Photo](https://2img.net/h/imgs.vilasims.com/images/tutorials/891/s650/photo.jpg)
5º - Agora vem a parte escrita, recomendo que use a fonte Visitor (CLICK AQUI), no tamanho 14px, na cor Branca, e com Stroke em 1px.
No caso do meu projeto, estou fazendo uma Userbar Animada da NWD, então vou escrever NWD GAMES.
Escolha o local onde seu testo vai ficar.
Resultado:![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Gb9](https://2img.net/r/ihimg/a/img825/3940/gb9.gif)
6º - Escolha uma imagem (no caso, vou usar uma palavra), de preferência com fundo transparente, salve ela (não copie, senão o fundo vai ficar preto), abra com seu PhotoShop, redimensione, e coloque ela, de uma forma que ela não apareça na Userbar, ou seja, acima, ou abaixo...
Para mover a imagem, aperte a letra V , procure e marque a caixinha Show Transfom Controls, na parte de cima do programa...
Imagem:![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Ujq](https://2img.net/r/ihimizer/img15/3277/ujq.gif)
7° Agora vamos para a bater da movimentação pra userbar fica animada, bem para quem não tem ativada a (ANIMAÇÃO DE QUADROS) vá no menu do photoshop em » JANELA » CLIKA EM ANIMAÇÃO, Aparecera esse quadro aqui.
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Bol](https://2img.net/r/ihimg/a/img4/394/bol.gif)
8° Bom, agora fica dificil, mas nem tanto
Clique neste "![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Photo](https://2img.net/h/imgs.vilasims.com/images/tutorials/900/s650/photo.jpg)
" botão, para criar um novo Frame (cada frame, é um movimento da userbar), clique no Layer de sua Imagem que vai descer, aperte a letra V, e depois aperte 4 vezes, o botão pra baixo do seu teclado.
Vai fazendo isso sucessivamente : Criar novo frame, aperte 4 vezes pra baixo.
Faça isso até que a imagem suma.
Ajuste o tempo de transição de cada frame (recomendo 0 segundo ou 0,1 segundo), segure Shift no primeiro frame até o último para selecionar tudo.
Se tudo correr bem, o resultado vai ser este:
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA 6ts](https://2img.net/r/ihimg/a/img17/3613/6ts.gif)
Fico passando bem rapido pq fiz um bem simples.
9º - Salvando corretamente. Para salvar sua Userbar animada corretamente, você tem que ir em Arquivo (INGLES: File) » Salvar para a Web e Dispositivos (INGLES: Save fod Web & Devices) Dps click em "SALVAR"
Vai abrir esta janela:
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA 5e](https://2img.net/r/ihimg/a/img23/1268/5e.gif)
Bom espero quem gostem do tutorial, foi feito especialmente para pessoas que gosta de coisas bem animada, enfim quem gosto dá um gostei, quem acho algum erro min corrija.
TheDrunK
Começando...
1º - Abra um novo documento com o tamanho 350×20 (se quiser com borda abra um com o tamanho 352×22.)
Eu vou abrir um documento com o tamanho 352×22 por que quero com borda.
2º - Escolha uma cor para o fundo.
Aperte a letra G, para pegar o Balde de Tintas.
No caso, usaremos a cor vermelha.
3° Agora dá 2 Cliks na camada da imagen do projeto.
»4° Vá em (Sobreposição de Padrão) Dps escolhe um detalhe para a userbar fica mais animada eu vo escolher essa da print acho uma boa, dps clique em OK.
Resultado:
Se não conseguiu que o seu projeto, ficasse igual ao meu, salve a imagem abaixo, abra com o seu PhotoShop, copie e cole em cima do seu projeto
5º - Agora vem a parte escrita, recomendo que use a fonte Visitor (CLICK AQUI), no tamanho 14px, na cor Branca, e com Stroke em 1px.
No caso do meu projeto, estou fazendo uma Userbar Animada da NWD, então vou escrever NWD GAMES.
Escolha o local onde seu testo vai ficar.
Resultado:
6º - Escolha uma imagem (no caso, vou usar uma palavra), de preferência com fundo transparente, salve ela (não copie, senão o fundo vai ficar preto), abra com seu PhotoShop, redimensione, e coloque ela, de uma forma que ela não apareça na Userbar, ou seja, acima, ou abaixo...
Para mover a imagem, aperte a letra V , procure e marque a caixinha Show Transfom Controls, na parte de cima do programa...
Imagem:
7° Agora vamos para a bater da movimentação pra userbar fica animada, bem para quem não tem ativada a (ANIMAÇÃO DE QUADROS) vá no menu do photoshop em » JANELA » CLIKA EM ANIMAÇÃO, Aparecera esse quadro aqui.
8° Bom, agora fica dificil, mas nem tanto
Clique neste "
" botão, para criar um novo Frame (cada frame, é um movimento da userbar), clique no Layer de sua Imagem que vai descer, aperte a letra V, e depois aperte 4 vezes, o botão pra baixo do seu teclado.Vai fazendo isso sucessivamente : Criar novo frame, aperte 4 vezes pra baixo.
Faça isso até que a imagem suma.
Ajuste o tempo de transição de cada frame (recomendo 0 segundo ou 0,1 segundo), segure Shift no primeiro frame até o último para selecionar tudo.
Se tudo correr bem, o resultado vai ser este:
Fico passando bem rapido pq fiz um bem simples.
9º - Salvando corretamente. Para salvar sua Userbar animada corretamente, você tem que ir em Arquivo (INGLES: File) » Salvar para a Web e Dispositivos (INGLES: Save fod Web & Devices) Dps click em "SALVAR"
Vai abrir esta janela:
Bom espero quem gostem do tutorial, foi feito especialmente para pessoas que gosta de coisas bem animada, enfim quem gosto dá um gostei, quem acho algum erro min corrija.
TheDrunK
Zangado
Veterano(a)
Nick in-game : Zangado
Mensagens : 1412
Registro : 28/01/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qua 24 Jul 2013 - 5:51
Belo tutorial
- TheDrunK
Experiente
Nick in-game : TheDrunK
Mensagens : 129
Registro : 17/06/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qua 24 Jul 2013 - 17:19
VlwZangado escreveu:Belo tutorial
Fabricin__
Experiente
Nick in-game : Fabricin_
Mensagens : 218
Registro : 23/04/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qua 24 Jul 2013 - 22:18
Belo tuto bithc
up...
up...
Matheus
Veterano(a)
Nick in-game : Matheus
Mensagens : 1725
Registro : 11/12/2012
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qua 24 Jul 2013 - 22:55
Muito Bom.
Tonito
Experiente
Mensagens : 231
Registro : 15/03/2012
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qua 24 Jul 2013 - 23:48
Bom tutorial acho que vou tentar fazer uma aqui rsrs
- TheDrunK
Experiente
Nick in-game : TheDrunK
Mensagens : 129
Registro : 17/06/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qui 25 Jul 2013 - 15:55
fabricin__ escreveu:Belo tuto bithc
up...
Matheuzinho escreveu:Muito Bom.
Tonito escreveu:Bom tutorial acho que vou tentar fazer uma aqui rsrs
Vlw
Urielcastro
Experiente
Nick in-game : Urielcastro
Mensagens : 211
Registro : 14/02/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Sáb 27 Jul 2013 - 0:59
Boa!!!
Plank
Experiente
Nick in-game : Plank_
Mensagens : 411
Registro : 11/03/2012
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Sáb 27 Jul 2013 - 23:02
Na verdade ele fica passando bem rápido pq vc mandou ele mudar os frames em pouco tempo e não pq fez rápido, se deixar mais tempo entre a troca de frames ele se move mais devagar... e isso requer literalmente 1 clique pra mudar... mas é sempre bom ensinar a galera do fórum a usar recursos diferentes no PS então vou deixar um joinha
Ah vc falou pra corrigir os erros... então tem que melhorar essa digitação ai coleguinha... "min avisa" é tenso
Ah vc falou pra corrigir os erros... então tem que melhorar essa digitação ai coleguinha... "min avisa" é tenso
- TheDrunK
Experiente
Nick in-game : TheDrunK
Mensagens : 129
Registro : 17/06/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Seg 29 Jul 2013 - 2:13
Obrigado pelos Elogios, é vlw pelas dicas
Micael_uOLLL
Comentador(a)
Mensagens : 70
Registro : 02/02/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Seg 29 Jul 2013 - 17:39
Bom Trabalho Mlq Continue Assim
Rafa_Show
Novato(a)
Mensagens : 45
Registro : 26/01/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Sex 2 Ago 2013 - 1:28
Muito bom seu tutorial Estava pensando em criar um mais vi que já tinha tenho grande Experiência com Designer de Avatar's e Userbar.
Glenn_.
Experiente
Nick in-game : Glenn_.
Mensagens : 411
Registro : 21/04/2012
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Sex 2 Ago 2013 - 16:35
UP pra vc muito bom
Haype
Experiente
Nick in-game : Haype
Mensagens : 194
Registro : 18/02/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qui 15 Ago 2013 - 0:13
Otimo Tutorial.
Kaiiz![[Tutorial] COMO FAZER UMA USERBAR ANIMADA A9xj1eI](https://i.imgur.com/A9xj1eI.png)
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA Empty](https://2img.net/i/fa/empty.gif)
Nick in-game : Kaiiz
Mensagens : 4905
Registro : 27/07/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Qui 22 Ago 2013 - 19:07
Vou experimentar 
Olá Convidado, seja bem vindo(a) ao fórum NWD Games !
O fórum foi criado há 4428 dias e já conta com 73100 tópicos e 401940 mensagens.
Temos 8344 usuários registrados, o último usuário registrado atende pelo nome de Venom2.
Sex 19 Abr 2024 - 7:32
Hardwell![[Tutorial] COMO FAZER UMA USERBAR ANIMADA YpJWrVg](https://i.imgur.com/ypJWrVg.png)
Nick in-game : Hardwell
Mensagens : 1995
Registro : 13/03/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Sáb 31 Ago 2013 - 14:34
Muito Bom
![[Tutorial] COMO FAZER UMA USERBAR ANIMADA 1ro65d10](https://i.servimg.com/u/f74/19/83/54/94/1ro65d10.png)
Rafaela Cruz é Baile de Favela
Sara Siqueira é Baile de Favela
'' A gente nasce F*did* na vida, e morre se fodendo. '' - Dalvan frases
- Hardwell
Nick in-game : Hardwell
Mensagens : 1995
Registro : 13/03/2013
Re: [Tutorial] COMO FAZER UMA USERBAR ANIMADA
Sáb 31 Ago 2013 - 14:37
Muito Bom
Você está recebendo um aviso por violar as regra do fórum.
Regras Violadas:
Postagens múltiplas
Evite ser Alertado, Lêia: Regras do Fórum
Att.
AnjuXtreme - Coordenador/Designer
Você está recebendo um aviso por violar as regra do fórum.
Regras Violadas:
Postagens múltiplas
Evite ser Alertado, Lêia: Regras do Fórum
Att.
AnjuXtreme - Coordenador/Designer
Permissões neste sub-fórum
Não podes responder a tópicos|
|
|