Visite o Blog: http://psmgdownloads.blogspot.

com/ e indique aos seus Amigos

Este Blog tem o maior Acervo de Edies de Vdeo e udio, Aberura de Vdeo animados, Vetores, programas de Webdesing, programas de Edies de Imagem e Vdeos, Vdeo Aulas, Programas e dicas do Photoshop e programas em gerais.

Criando um banner no ImageReady

Ol pessoal. Vou ensinar a criar um banner animado usando Photoshop e ImageReady. Todo site, seja de empresa, loja etc precisa anunciar na internet. Eles usam o meio de banners, assim recebem muitas visitas. Alguns banners so feitos em flash, mas o Photoshop juntamente com o ImageReady podem criar um banner no formato gif muito bom. Vamos comear? Abra um novo arquivo do tamanho 46860 pixels.

Vamos ter uma noo bsica de como criar um banner: - Voc precisa tem o logotipo do seu site; - O nome do site bom sempre vir no final da animao que voc fizer (a introduo); - Voc precisa de um slogan;

No decorrer desse tutorial vamos entender melhor tudo isso. Para continuar, vamos colocar um fundo legal no nosso banner. Se preferir, use o Gradient Tool (G), fica bem legal:

Criado o fundo, vamos colocar o logotipo. Faa o logotipo com fundo transparente, se voc j tiver um desenhado, coloque-o no banner com um tamanho proporcional. Para esse exemplo, coloquei o logotipo MxStudio (j possui o nome).

Agora vamos comear a fazer a propaganda do site, devemos separar todas as frases em camadas. Nesse exemplo, irei escrever 3 frases: - Tutoriais de Photoshop? - O que voc precisa est aqui! - Clique e conhea o MXstudio. Aqui vai como escrevi e a organizao das camadas:

Obs: Deixe visvel apenas uma camada de texto por enquanto, para no haver confuso:

Criamos tudo o que precisamos para o banner, agora vamos passar para o ImageReady. Aperte CTRL+SHIFT+M. Na tela do ImageReady, deixe abertas as janelas mais importantes: Animation e Layers (Animao e Camadas). Deixe visvel nas camadas o fundo, o logotipo e a primeira frase que voc quer que aparea (no meu caso, a frase tutoriais de photoshop). Logo aps, clique em Duplicates Current Frame.

Clicando nesse boto, aparecer outro quadro na janela Animao. Nesse quadro, tire a visibilidade da camada do primeiro texto (clicando no Olho ao lado da camada). Agora deixe visvel a camada do prximo texto. Temos 2 quadros:

Do mesmo modo que voc fez o segundo quadro e trocando as camadas de texto, faa a mesma coisa at terminar todos os textos. Estamos chegando ao final, vamos dar um toque de animao melhor para voc aprender a movimentar objetos. Crie mais um quadro na janela Animao (Duplicates Current Frame) e deixe somente o fundo e o logotipo aparecendo. Duplique esse quadro. Agora arraste o logotipo at o outro lado do banner (aqui seria para o lado direito). Voc tem 2 quadros quase iguais. Selecione-os e clique em Tween

Na janela tween, configure assim:

Explicao: Tween with selection = anima a seleo que fizemos dos 2 quadros;

Frames to add = quantos quadros ir usar para animar (no passe de 5 para seu banner no ficar pesado); Note que ele fez uma transio do logotipo, ele agora est animado! Agora crie uma camada de texto na janela Layers e escreva seu slogan:

Obs: O slogan que usei apenas para exemplo, no o slogan do MXStudio. Vamos agora configurar os tempos. Para cada quadro de texto use 3 segundos. Para os quadros da animao do logotipo use 0 segundos. Para o quadro final com o slogan use 5 segundos. Para mecher no tempo, clique na marcao em baixo do quadro na janela Animation. Selecione um dos tempos que ele mostra ou clique em Other para por o seu.

Agora s salvar. File (Arquivo), Save Optimized (Salvar otimizado). Preview:

Pronto, voc aprendeu a criar banner no ImageReady. Agora s usar a criatividade e fazer seus banners. isso a pessoal, um abrao. Autor: Eduardo Antunes.