Criando um layout para se u site.. Click no Arquivo > novo para abrir um novo documento, ou simplesmente pressione CTRL + N

Transcrição

1 Criando um layout para se u site. Click no Arquivo > novo para abrir um novo documento, ou simplesmente pressione CTRL + N 2. Crie um retângulo para o topo do site com o tamanho de 779 Largura X 134 Altura com a cor de preenchimento em #8FD810 então ficara como na imagem abaixo (lembrando que ela está reduzida) 3. Agora crie um círculo na cor # em baixo do retângulo, então você vai selecionar a ferramenta selecionar secundário (setinha branca) ou simplesmente tecle a letra "A" para selecioná-la, repare que formou-se 4 pontinho em volta do círculo Com esta setinha branca selecionada, você vai clicar nos pontinhos brancos que se formou, onde ficará como na imagem abaixo.

2 5. então você clicará nos 2 novos círculos azuis que se formou e arrasta-los, onde o círculo ganhará novas formas conforme o seu gosto, mais tente deixá-lo como na imagem abaixo (lembrando que está reduzida) 6. Então você encaixa debaixo do topo verde... onde já dá pra ter uma idéia de como ficará o nosso topo, então ficará como na imagem abaixo 7. agora selecione o círculo (deformado) e dê um CTRL + C para copiá-lo, e depois um CTRL + V para colá-lo, então você terá 2 dessa forma (uma atrás da outra) selecione Ã* de cima e aperte SHIFT + Setinha para baixo do teclado para esta figura descer 10 pixels de uma só vez, o objetivo é descê-la 20 pixels, então você aperta 2 vezes, que ficará como na imagem abaixo. 8. Agora você vai copiar e colocar a forma que você acabou de levar para baixo, fazendo que você tenha 3 iguais.. (1 em cima e 2 20 pixels abaixo) você vai selecionar 1 das formas que estão em baixo e apertar SHIFT + click do mouse em cima do

3 retangulo verde para que 1 das 3 formas escuras e o retângulo fique selecionado juntos, agora você vai na barra de ferramentas lá em cima em Modificar > Combinar Tra ados > Perfurar, agora se você perceber o retângulo verde assumiu umas curvas na parte de baixo... Então ainda temos o retângulo e mais 2 formas, vamos prosseguir // caminho para perfurar 9. Agora você vai fazer a mesma coisa com as 2 formas que sobraram.. selecione 1 e aperte SHIFT + click do mouse em cima da outra forma para que as 2 formas escuras fiquem selecionados juntos, agora você vai na barra de ferramentas lá em cima em Modificar > Combinar Tra ados > Perfurar e ficará como na imagem abaixo 10. Bom, agora vamos dar uma textura, selecione o retângulo verde e dê um CTRL + C e depois um CTRL + V, agora temos 2 retângulos verdes, você pega o de cima vai na tabela de cores e clica no botão op ões de preenchimento como na imagem abaixo

4 11. Depois você escolhe a textura Retícula Cruzada 3 com opacidade de 21% da textura finalizando agora você vai no painel de baixo do fireworks e diminui a opacidade dele para 75% 13. Pronto agora já tem uma textura, agora vamos preencher o topo, você copia a imagem2 clicando aqui se preferir, para que coloquemos como um logo, ajeite em qualquer lugar do topo, agora usando a fonte Alien... você escreve com letras maiúsculas o nome do site ao lado da Imagem2 ou se preferir usar outra fonte... e com as letras minúsculas espalhe pelo topo verde...

5 14. Faça o download de uma imagem e um ET retire todo o fundo dele e vamos aplicar alguns efeitos nele para por no lado direito do topo, ao baixar a imagem você abre ele no fireworks use a ferramenta varinha mágica e clique na parte branca da figura e em seguida aperte Delete assim você vai retirar a parte branca da imagem 15. Agora você arrasta a imagem pro lugar onde você quer do topo e depois você vai no menu Comandos > Creative > Converter em tons de Cinzas 16. assim ele vai ficar preto e branco 17. agora você selecione o E.T clica no botão "+" de efeitos perto da opacidade, e escolha a op ão Converter cores > Níveis assim abrirá uma janela, no menu "RBG"

6 escolha "Verde" após a sua escolha você verá 3 botões com 1 conta-gotas em cada botão escolha o botão do meio leve o ponteiro do mouse para fora desta janela e click em qualquer área verde do topo para apontar ao programa qual tonalidade de verde que você deseja e dê OK Após o click no OK seu E.T está verde então vamos ajustá-lo para que combine melhor 18. primeiro pegue a camada do E.T e leve para trás da camada daquela Linha Escura do topo (como fa o isso? vá no quadro de camadas do lado direito) lembrando que algumas camadas que estão no meu projeto não estão no seu. 19. Agora vai ficar como na imagem abaixo...

7 20. Você vai manter clicado na ferramenta para que um círculo pontilhado apare a, então você escolha ele, caso não apareceu, não importa, quadrado também serve, então você vai selecionar aquelas partes do E.T que sobraram pra baixo da linha escura e depois dê Delete assim você apagará as pernas do E.T, deixando só a parte de cima da linha escura. Perfeito, seu topo está lindo... agora temos que fazer o resto do designer Bom o nosso topo está da seguinte forma 21. Vamos fazer 1 tra o de 3 pixel em cada lado do topo até em baixo na mesma cor da linha ondulada, agora faremos uma área para o banner de parceria, crie um retângulo onde ficará os banners, escreva parceiros, no meu caso eu coloquei 1 letra da fonte Alien. Em volta do retrangulo você faz 1 linha vertical, vai na tabela de cores da linha clica em op ões do tra o e escolhe a textura Linha Horiz 4 fará a mesma coisa com uma linha horizontal de baixo do banner.. coma textura Linha Vert 2 então ficará assim para o menu, vamos fazer 2 retângulos... 1 com o fundo da cor #F3F9E6 e

8 contorno # outro com a cor #DFE0DF sem contorno... e ficará assim agora vamos fazer as divisórias do menu... um retângulo cinza claro para a parte do conteúdo... e ondular ela como agente ondulou o topo... usando o Comando > combinar tra ados > perfurar então com ajustes pessoas ele ficará assim 24. faremos então o rodapé, que também é bem simples, fa a como o topo... desde o início... ajustando ele ficará assim...

9 Bom pessoal por hoje é só...