Desenhando layout

Série: Desenhando um bom layout

Página inicial do projeto:
[pic]
Página interna do projeto:
[pic]
Como vocês viram, o layout não tem nada de muito complicado. A idéia principal é criar um trabalho limpo, bonito e combinando as cores. Vamos à primeira parte do trabalho:
Crie um novo arquivo no Fireworks, com as seguintes medidas:
[pic]
Desenhe um retângulo e configure da seguinte maneira:
[pic]
Vamos trocar o tipo de preenchimento para Linear, sendo a primeira cor #E7F3C2 e a segunda #99CC00, deixando o degradé configurado da seguinte maneira para o resultado abaixo:
[pic]
Desenhe outro retângulo para fazermos o topo e siga as configurações:
[pic]
Preenchimento: Linear
Primeira Cor: #FFFFFF
Segunda Cor: #0867BC
Linha com espessura: 2
Cor da Linha: #287BC5
Vamos adicionar o filtro Inner Glow
[pic]
Cor do efeito: #287BC5
Chegaremos ao seguinte resultado:
[pic]
Para finalizar a primeira parte, vamos importar as imagens: Logo e Imagem 1.
Posicionamento das Imagens:
Logo: X: 29, Y: 14
Imagem 1: X: 516, Y: 22
[pic]
Terminamos a primeira parte do nosso artigo, espero que tenham gostado
Desenhe um retângulo de cantos arredondados modificando os cantos utilizando a tecla ALT. Em sequência aplique as configurações abaixo:
Preenchimento: Gradiente Linear nas cores: #7CCACA e #009999
Contorno: espessura = 2 e cor: #009999
[pic]
Agora duplique o retângulo criado, mantendo-o na mesma posição. Com a ferramenta Caneta (Pen tool) edite para chegar ao resultado abaixo:
[pic]
Foi necessário fazer algumas alterações no preenchimento do retângulo duplicado, alterando as cores para preto e branco, sem contorno, opacidade 26% e Blend Mode para Screen.
Precisamos acrescentar os itens do menu: A Academia, Profissionais, Saúde, Novidades, Tabela de Horários, Fotos e Contato.
[pic]
Utilizando os procedimentos citados acima criem as outras caixas:
[pic]
Cores e efeito utilizado:
Caixa 1:
Preenchimento: #FFCC00 e #FF9900;
Contorno: #FF6600 e