SÉRIE EFEITOS – PARTE 31

 

Olá galera!

 

Vamos finalizar, neste tutorial, a criação do botão no estilo 3D iniciado no tutorial anterior. Falta apenas acertar os cantos dos retângulos criados para alcançarmos o resultado desejado.

 

A figura abaixo mostra o ponto onde paramos.

 

Figura 01: ponto de partida.

 

Siga os passos abaixo e finalize o efeito.

 

1) Selecione a ferramenta Distort tool e arraste o ponto superior direito do primeiro retângulo criado para a direita, até alcançar o retângulo menor. Veja:

 

OBS: Irá surgir uma caixa de diálogo informando sobre a conversão do objeto selecionado. Clique no botão OK.

 

Figura 02: ferramenta Distort tool.

 

Figura 03: distorção do primeiro retângulo.

 

2) Ainda com a ferramenta Distort tool selecionada, arraste o retângulo menor da seguinte forma:

 

Figura 04: distorção do segundo retângulo.

 

3) Para finalizar as distorções nos retângulos, selecione o retângulo horizontal superior e acerta sua aresta esquerda, como mostrado na figura abaixo.

 

Figura 05: distorção do terceiro retângulo.

 

Teremos o seguinte resultado:

 

Figura 06: resultado após distorções.

 

4) Selecione os três retângulos e agrupe-os, através do menu Modify, Group ou pelo atalho do teclado Ctrl+G.

 

Figura 07: menu Group.

 

Figura 08: retângulos agrupados.

 

5) Com os retângulos agrupados, aplique o efeito Drop Shadow, através do menu Filters (+), Shadow and Glow, Drop Shadow. Configure-o como mostrado na Figura 10.

 

Figura 09: filtro Drop Shadow.

 

Figura 10: configurações do filtro Drop Shadow.

 

Figura 11: resultado após aplicação do filtro Drop Shadow.

 

6) Para finalizar, insira o texto de sua preferência. Seguem as configurações que utilizei no texto deste exemplo.

 

- Fonte: Babylon5

- Tamanho: 16

- Cor de preenchimento: amarelo (#FFFF00)

 

Figura 12: inserção do texto no botão.

 

Confira abaixo o efeito final:

 

Figura 13: efeito final.

 

Pronto! Nosso botão 3D está criado. Use sua criatividade para aplicar este botão nos mais diversos projetos.

 

Espero que tenham gostado deste tutorial. Conto com o acesso de todos vocês nos próximos tutoriais.

 

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

 

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!

 

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. Clique Aqui para saber mais sobre o curso Fireworks Básico – Passo a Passo ou Clique Aqui para saber mais sobre o curso Fireworks – Aprenda na Prática.

 

Até a próxima!

 

Um cordial abraço a todos,

 

Fábio Almeida

 

webdesigner.pro@pop.com.br