[TUTORIAL]Efeito Fogo

[_Vinny_]

Vou postar um pequeno tuto de como fazer um efeito fogo em num banner. Este efeito aprendi no curso de webdesign que fiz em 2007/2008, e vi que me encaixei mais no Fireworks do que no Flash e Dreaweaver. Vamos começar:

--------------------------------------

Efeito Fogo - Fireworks(MX ou 8)

Abra o Fireworks.

Tecle Ctrl + N ou selecione File > New.

Ajuste as dimensões de Canvas para:

Largura: 450 pixels - Altura: 250 pixels

Canvas Color: Custom, cor PRETO(#000000) | Tecle OK.

Exemplo:

• Começando

Faça um retângulo que ocupe a metade inferior do documento com cor de preenchimento branca e sem linha de contorno, conforme mostrado na figura abaixo:

Selecione o retângulo e transforme-o em bitmap. Comando Shift + Ctrl + Alt + Z no teclado ou use o menu Modify > Flatten Selection. Pronto, está transformado. =D

• Smudge Tool

Clique encima do retângulo e selecione a ferramenta Smudge Tool ajustando os parâmetros: Size, Edge, Shape e Pressure conforme mostrado.

Ajuste:

Size: 35

Edge: 50

Shape: Circulo |

Pressure

Com a ferramenta escolhida, arraste a parte superior do retângulo branco para cima em direção ao palco preto e para os lados. Pratique um pouco e você conseguirá facilmente obter as "línguas de fogo" em cima do retângulo branco.

Construa algumas poucas destas línguas espaçadas uma da outra. Altere o valor Size da ferramenta para 25 e construa mais algumas línguas espaçadas. Altere novamente o valor Size da ferramenta agora para 15 e construa mais algumas línguas.

Você irá perceber que para cada valor Size vai obter "linguas" menores. Pratique um pouco e procure acertar o aspecto das "linguas" o mais próximo possível do real.

No fim você obterá algo talvez até melhor do que eu obtive e mostro a seguir:

• Hue/Saturation

Clique no retângulo e abra o menu Filters(Alt + i) > Adjust Color> Hue/Saturation. Ajuste os parâmetros do efeito conforme mostrado na figura e tecle OK.

• Duplicate Layer

Siga a numeração na figura.

01. Clique em Option do painel Layer para abrir um menu suspenso.

No menu que se abre escolha Duplicate Layer.

02. Marque Before current layer (antes do layer atual);

03. Tecle OK.

Pronto, espero que gostem.

Creditos: boa parte desse tutorial foi retidara da minha apostila de webdesign, desenvolvida por Salomão Alcolumbre. Acho que brevemente ele colocará esse tutorial em seu site comercial. Vou deixar os sites dele:

Site pessoal: http://www.salomao.cjb.net <- Download da apostila no rodape do site

Site comercial: http://www.webcenterna.com/

Editado Outubro 3, 2009 por _Vinny_

[marianah]

Imagens off!