Coluna de Fireworks – Layout da Dólar House

Introdução

Depois de algum tempo sem postar colunas de Fireworks, pensei em algo bem legal, para poder trazer para a comunidade, depois de algum tempo, vi que o pessoal está precisando um artigo, que explique bem o layout de um site, nessa coluna vou fazer o layout da empresa ficticia Dólar House. Chega de conversa e vamos ao artigo! Let’s Go!

Pré-requisitos

O tutorial foi desenvolvido no Adobe Fireworks 8, mas é compatível com qualquer versão do software Adobe Fireworks.

Objetivos

Vamos fazer um layout, fazendo uma logo, escrevendo os textos, enfim, vamos fazer o layout da empresa Dólar House.

Dólar House

Parte téorica:

Para fazer um layout para alguma empresa, ou para algum cliente, você vai precisar ter conhecimento sobre o que o cliente/empresa necessita. Quando você trabalha para uma empresa (comercial), mais conhecido como design comercial, você vai ter que trabalhar na simplicidade, mas também na inovação. Olhar sempre bem atento para as cores à serem usadas, sempre usar fundos de cores branca ou preta. A nossa parte teórica, é bem pequena, pois iremos aprender mais na parte prática.

Parte prática:

Em primeiro lugar, vamos abrir um novo documento, eu particularmente, prefiro um site, com menores proporções.

Abri um documento de 700 x 450, com fundo branco.

Logo:

Quando pensamos em dinheiro, logo vem na nossa cabeça, o simbolo $.

Então, vamos usar isso para fazer a logo.

A minha logo ficou assim:

Agora, vou mostrar como essa logo foi feita.

Em primeiro lugar, pegue a ferramenta Rounded Rectangle = .

Segure SHIFT(para aumentar igual dos lados), e faça o retângulo.

Com o retângulo selecionado, aperte CTRL + SHIFT + T, uma nova janela vai abrir, selecione Rotate, e ponha 30, para melhor visualização, olhe essa imagem:

Agora, quando pensamos em dinheiro, que cor lhe vem na cabeça?

VERDE ( Me vê umas verdinhas ai! )

Então, escolhi a cor. #90C541
E uma cor secundária. #638929

Agora, selecione o nosso retângulo, que foi criado anteriormente, e ponha essa cor: #90C541

Escreva “$”, a fonte usada foi “ArtBrush”

Com a escrita selecionada, aperte CTRL + SHIFT + P, para transformar em Path.

Aperte CTRL + SHIFT + G para desagrupar, e ficar melhor de trabalhar.

Selecione o retângulo (meio quadrado ^^’) e a escrita junto, vá em <Modify> <Combine Paths> <Punch>

Eu particularmente, não gostei dessa coisa “chapada”.

Por isso, a cor secundária. Duplique a layer do retângulo (CTRL + SHIFT + D), ponha nessa cor #638929, dê dois toques na seta para baixo no teclado, e outro dois toques para direita. Ponha essa layer abaixo da outra (Painel Layers [F2]).

Outra coisa que pode ser feita, para não deixar muito “chapado” , é colocar o Feather, entre 2 ~ 4.

=

Mas, eu não gostei muito assim, então vou deixar como antes.

Agora, vamos escrever o nome da empresa.

Eu preferi escrever com a mesma fonte usada anteriormente “ArtBrush”

Escreva dolar, com essa cor: #638929

Logo após duplique (CTRL + SHIFT + D), e dê um clique no para baixo no teclado, e um para direita, ponha essa cor: #90C541

Agora, escreva House, com essa cor: #90C541

Logo após duplique (CTRL + SHIFT + D), e dê um clique no para baixo no teclado, e um para direita, ponha essa cor: #638929

Obs: Não é preciso, usar essas cores, não é preciso seguir o artigo à risca.

Considerações finais

Vimos nesta coluna como fazer uma logo, e continuaremos trabalhando sobre esse assunto (Dólar House) durante as próximas colunas, espero que possam aproveitar essa coluna e aprender algo à mais.

Espero que vocês tenham gostado desta coluna e até a próxima.
Firewoks, nothing is impossible

Autor: João Castro – jpcastrobr – Colunista de Fireworks e Photoshop do MXstudio

Qualquer dúvida envie um email para jpcastrobr@mxstudio.com.br ou acesse o nosso fórum.