SÉRIE EFEITOS – PARTE 19

 

Olá galera!

 

Vamos abordar, a partir deste tutorial, um tópico muito interessante no Fireworks. Trata-se da integração entre Fireworks e XML. XML é uma linguagem que faz o carregamento dinâmico das variáveis criadas. Qual a finalidade desta integração? Esta integração nos proporciona mecanismos facilitadores na exibição dos dados. Este tema pode estar um pouco confuso para você. Vamos, então, a um exemplo prático.

 

Iremos criar, a título de exemplo, neste tutorial um banner com tamanho padrão da web contendo variáveis que serão carregadas usando XML. Vamos, no primeiro momento, criar a base do banner e logo após programar os dados que irá preenchê-lo. A prática será mais fácil. Acompanhe.

 

Na primeira parte deste tutorial vamos criar a base de nosso banner.

 

1) Crie um novo documento com as seguintes configurações:

 

Figura 01: propriedades do novo documento.

 

2) Importe para o palco, através do menu File, Import..., uma logomarca ou imagem qualquer.

 

Figura 02: menu File, Import....

 

Figura 03: inserção da logomarca no banner.

 

3) Selecione a ferramenta Ellipse tool e desenhe no palco um oval da seguinte forma:

 

Figura 04: ferramenta Ellipse tool.

 

Figura 05: inserção do oval no banner.

 

4) Para incrementar o oval, insira o efeito Inner Glow, através do menu efeitos (+), Shadow and Glow, Inner Glow e configure como mostrado na figura a seguir.

 

Figura 06: menu de acesso ao efeito Inner Glow.

 

Figura 07: configurações do efeito Inner Glow.

 

Figura 08: oval após aplicação do efeito Inner Glow.

 

5) Vamos aplicar um contorno ao banner. Para isso, selecione a ferramenta Rectangle tool e desenhe no palco um retângulo com a mesma medida do arquivo, 468 x 60 pixels.

 

Figura 09: ferramenta Rectangle tool.

 

Figura 10: criação do retângulo.

 

6) Após criar o retângulo, temos que enviá-lo para trás para que os demais elementos fiquem por cima e alterar a cor do contorno para preto e retirar a cor de preenchimento. Acompanhe as etapas abaixo:

 

Para lançar o retângulo criado para trás dos elementos, clique com o botão direito do mouse sobre o retângulo e selecione o menu Arrange, Send to back.

 

Figura 11: efeito Sharpen More.

 

Após lançá-lo para trás, altere suas cores de preenchimento (sem preenchimento) e contorno (preto).

 

Figura 12: alteração da cor de preenchimento para transparente.

 

Figura 13: alteração da cor de contorno para preto.

 

Ao final teremos o seguinte resultado:

 

Figura 14: resultado após configurações.

 

Primeira fase concluída. No próximo tutorial vamos criar as variáveis que receberão os dados cadastrados e posicioná-las de acordo com o layout.

 

Conto com o acesso de todos para os próximos tutoriais!

 

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

 

Estou à disposição de todos! Envie suas críticas e/ou sugestões para o e-mail webdesigner.pro@pop.com.br. Terei todo prazer em respondê-lo.

 

Pessoal, trago uma boa notícia a todos os que acompanham os tutoriais da série Fireworks, aqui no site do Júlio Battisti. Já estão à venda os cursos Fireworks Básico – Passo a Passo e Fireworks – Aprenda na Prática, ambos de minha autoria. É uma maneira fácil e didática de se aprender esta maravilhosa ferramenta de design. São inúmeros exemplos práticos que irão te levar a um mundo totalmente real em se tratando de design em geral. Clique aqui para saber mais sobre o curso Fireworks Básico – Passo a Passo e acesse o site https://juliobattisti.com.br para saber mais sobre o curso Fireworks – Aprenda na Prática.

 

Galera, participem do Fórum de Fireworks no site https://juliobattisti.com.br/ e troque conhecimentos com diversas pessoas. Acesse já!

 

Caso tenha dúvida(s), entre em contato comigo através do e-mail webdesigner.pro@pop.com.br.

 

Para desenvolvimento de Sites, Layout, Apresentações, Flyes, Banners, Identidade Visual, Diagramação, Vetorização e Serviços Gráficos em geral, enviem e-mail para: webdesigner.pro@pop.com.br e solicite seu orçamento. Profissionalismo sempre!

 

Até a próxima!

 

Um cordial abraço a todos,

 

Fábio Almeida