CRIAÇÃO DE NEWSLETTER – PARTE 1

 

Fala galera, tudo bem com todos vocês?!

 

No tutorial anterior finalizamos a série Logomarca. O que vocês acharam desta série? Aprenderam muito? Está sendo útil no dia-a-dia o aprendizado passado? Espero que possam ter tirado o máximo proveito desta série.

 

Para esta semana, vamos aprender a criar uma newsletter. Dividi este tema em dois tutoriais para que possa passar um maior nível de detalhes a vocês.

 

Você sabe o que é uma newsletter?

 

Newsletter é um mecanismo, muito eficiente, de divulgação e propaganda de sua empresa. É como se fosse um panfleto eletrônico.

 

Verá que legal será construir uma newsletter. Preparado?

 

Então vamos lá. Ao final do segundo tutorial, teremos o seguinte resultado:

 

 

Muito bonita nossa newsletter, não é verdade?

 

Neste primeiro tutorial, vamos criar a parte superior (topo), o rodapé e inserir as imagens em marca d’água no fundo da newsletter.

 

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

 

» Largura: 500 pixels.

» Altura: 455 pixels.

» Resolução: 72 dpi.

» Cor da tela: Branco.

 

 

2) Vamos começar pelo topo. Selecione a ferramenta Rectangle tool e desenhe no palco um retângulo com as seguintes configurações:

 

» Tamanho: 500 x 52.

» Cor de preenchimento: verde (#B3FFC8).

» Cor de contorno: sem cor de contorno.

 

Ferramenta Rectangle tool

 

 

3) Duplique o retângulo criado, através do atalho do teclado Ctrl+Alt+D, e configure-o da seguinte maneira:

 

» Tamanho: 500 x 52.

» Cor de preenchimento: verde (#CCFFDA).

» Cor de contorno: sem cor de contorno.

 

 

Obs: Note que há um espaço entre os retângulos de dois pixels.

 

4) Selecione a ferramenta Line tool e desenhe no palco uma linha reta (pressione a tecla Shift durante a seleção) de 500 x 1 pixels.

 

 

5) Para importar a logomarca, acesse o atalho do teclado Ctrl + R e localize na janela sua logomarca e clique em Abrir. Veja sua localização no palco:

 

 

6) Para dar um efeito agradável ao fundo deste topo, desagrupe a logomarca, através do atalho do teclado Ctrl + Shift + G, e faça uma seleção apenas dos ovais da logo. Depois de feito a seleção, duplique-as e aumenta sua proporção pelo atalho do teclado Ctrl + T e mude sua propriedade Opacity para 50. Posicione-a da seguinte forma:

 

 

7) Vamos aos textos agora. Selecione a ferramenta Texto tool e digite no palco a palavra newsletter. Configure-a como segue:

 

» Fonte: Verdana.

» Tamanho: 30.

» Cor: verde (#006600).

 

 

Para dar uma aprimorada a esta palavra, insira o efeito Drop Shadow. Veja como ficou melhor após a aplicação deste efeito:

 

 

Para a frase “Novo Ebook do autor Fábio Almeida – Novidades no site www.juliobattisti.com.br - Acesse Agora !” utilizei as seguintes configurações:

 

» Fonte: Arial.

» Tamanho: 10.

» Estilo: Negrito.

» Cor: verde (#006600).

 

 

8) Para finalizar o topo da newsletter, selecione a ferramenta Line tool novamente e crie uma linha no palco medindo 350 x 1 pixels. Lembrando que para se fazer uma linha reta perfeita, deve pressionar a tecla Shift durante a seleção. Posicione-a da seguinte forma:

 

 

Para melhorar sua aparência, vamos alterar a propriedade Texture para Line-Vert 3 e configurá-la para 100.

 

 

Eis o resultado:

 

 

Nosso topo está prontinho! Vamos adiante, criar nosso rodapé.

 

9) O rodapé será bem simples de criar. Vamos lá. Selecione a ferramenta Rectangle tool e desenhe no palco um retângulo com as seguintes configurações:

 

» Tamanho: 500 x 20 pixels.

» Cor de preenchimento: verde (#CCFFDA).

» Cor de contorno: sem cor de contorno.

 

 

10) Duplique o retângulo criado e posicione a cima do que criamos no passo anterior. Mude sua cor de preenchimento para verde mais escuro (#B3FFC8).

 

 

Obs: Caso o retângulo seja duplicado a frente do retângulo criado anteriormente, clique com o botão direito do mouse sobre este retângulo e acesse o menu Arrange, Send to back.

 

11) Selecione a ferramenta Text tool e digite no palco a frase “www.juliobattisti.com.br - copyrigth 2006” e a configure-a da seguinte forma:

 

» Fonte: Arial.

» Tamanho: 10.

» Estilo: Negrito.

» Cor de preenchimento: cinza escuro (#666666).

 

 

12) Para finalizar, vamos inserir as duas marcas d’águas da logo no corpo de nossa newsletter. Para isso, basta selecionar os ovais da logo que usamos para construir o topo e duplicá-la para ser utilizada no corpo. As únicas alterações que faremos são mudar a cor de preenchimento para cinza bem claro e mudar sua propriedade Opacity para 10. Veja como deve ficar a disposição das marcas d’águas na newsletter. Lembre-se de acessar o atalho do teclado Ctrl + T para aumentar ou diminuir o tamanho da logo no palco.

 

 

No próximo tutorial vamos finalizar o desenvolvimento de nossa newsletter. Não deixem de acessar.

 

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 atendê-lo.

 

Pessoal, trago uma boa notícia a todos os que acompanham a série de tutoriais da série Fireworks aqui no site do Júlio Battisti. Já está a venda o curso de Fireworks Básico – Passo a Passo, 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 este curso.

 

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

 

Chegamos ao final de mais um tutorial da série Fireworks. 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,  envie 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