INTRODUÇÃO
Como se trata de uma série, é essencialmente importante que, antes de iniciar esta matéria, você tenha visto a 2ª parte.
PRÉ-REQUISITOS
- Facilidade com o manuseio do Fireworks CS3
- Entendimento básico sobre briefing (maiores informações, acesse: BRIEFING)
- Ter feito o tutorial Banners Publicitários: Parte 2
OBJETIVO
Dar continuidade a criação um banner publicitário utilizando Fireworks CS3 e obedecendo formatos padrões para web.
CONCEITO
Relembrando, o formato escolhido para este 3º tutorial da série será o com dimensões 160×600 px, chamado de Wide Skyscraper, um banner vertical porsicionado nas laterais de grandes portais. Este banner é a continuação do tutorial anterior.
CONTEÚDO
Vamos concluir a criação dos efeitos no fundo deste banner para, em seguida, podermos inserir o conteúdo.
1- Organização
No painel Layers (Camadas), insiramos uma nova pasta (Efeitos – ela deve estar acima da pasta Fundo) e subpastas como na figura abaixo:
Fig. 01: Organização dos layers
2 – Efeito Trapézio 1
Vamos criar um efeito com a figura geométrica de um trapézio (devemos selecionar a pasta Trapézio 1 antes de criarmos a figura) utilizando a ferramenta Pen tool(caneta [P] ). Como a imagem exibe abaixo, façamos a geometria com borda na cor branca e preenchimento gradiente linear #FFCC00 para #FFFFFF.
Fig. 03: Configuração do efeito
3 – Efeito Trapézio 2
a) Vamos criar uma cópia do trapézio anterior e colá-la na camada Trapézio 2.
b) Em seguida, posicionemos a cópia como mostra a figura a seguir, utilizando a ferramenta Subselection tool (Subseleção [A] ):
4 – Efeito Raios
Agora, utilizando uma mesclagem entre as ferramentas pen tool e subselection tool, vamos criar imagens que pareçam com raios. Mas antes, não esqueçamos de clicar na camada Raios.
Dica: devemos variar as cores de cada raio juntamente com sua opacidade (20 a 50%). Além de aplicarmos o filtro Overlay.
Fig. 06: Aplicação de opacidade e filtro
5 – Efeito Barras
Vamos trabalha agora com efeito em barras.
a) Primeiramente, criaremos três retângulos idênticos, na cor branca, e os colocaremos na base do banner.
b) Com os três selecionados, vamos transformá-los em um objeto apenas, unindo-os. Para isso, devemos acessar o menu Modify > Combine Paths > Union ou pelo atalho CTRL+ALT+U.
c) Agora, utilizando um gradiente linear conforme a imagem e o filtro Overlay, faremos o acabamento da figura.
6 – Efeito Ondas
E para encerrarmos mais esta parte do tutorial, criaremos um efeito de ondas para o banner.
a) Com a camada Ondas selecionada, criaremos uma imagem curva e com as seguintes propriedades:
E está aí o resultado:
Fig. 11: Resultado do tutorial
Fonte: http://www.mxstudio.com.br/fireworks/banners-publicitarios-parte-3/