Pessoal desenvolver topo requer idéias, imaginação, ter o material que vai usar em mãos, imaginar como quer que fique e mandar a idéia para o Fireworks. Muita gente tem dificuldade nessa parte, mais com um pouco de calma consiguirá chegar no resultado.
Vamos para de falar e ir ao que interessa.
1º- Abre um novo arquivo no Fireworks dê 776 x 175 pixel´s.
Você poderá criar do seu tamanho. Mais lembre-se máximo do tamanho de largura 779, é a medida da configuração de 800 x 600, 779 pixel fica certinho, mais costumo usar 776 para não correr risco de dar barra de rolagem.
2º- Com o novo documento aberto. Pegue a ferramenta Rectangle Tool, crie o retangulo na medida de 776 x 80 pixel. Após criar o rectangle vá na propriedades de cores e jogue um linear. Veja a imagem abaixo:
3º- Após selecionar o linear. Selecione .
Irá abrir uma janela. Veja a imagem abaixo.
Configure seu Linear com as cores que esta na imagem acima.
4º- Depois de ter feito os passos acima sua imagem tem que estar igual, a imagem abaixo:
Após chegar nesse ponto vamos começar a dar modelo ao topo.
5º- Agora você pega a ferramenta Ellipse tool, e vamos criar a imagem no tamanho de 598 x 114. E posicionar em cima do rentgulo que você criou acima. Veja a imagem abaixo como ficou:
Deixe sua imagem parecida com essa de cima.
6º- Feito o processo acima. Selecione as duas imagem vai em Modify> Conbine Paths > Punch.
Após isso sua imagem deve ficar igual a esta:
7º- Selecione sua imagem e agora vamos mexer com as curvas da imagem. Veja na imagem abaixo:
Onde estão essas setas vermelhas, é onde vamos estar mexendo com as curvas usando a ferramenta Pen Tool .
8º- Primeiro selecione a ferramenta Pen Tool, vamos a primeira seta vermelha da sua esquerda para direito, selecione o e deixe o botão do mouse prescionado e puxe para sua direito com o Shift prescionado tambem para sua linha ficar reta.
Depois disso selecione o ponto do meio com a ferramenta Subselection Tool , puxe o ponto para sua esquerda com o shift prescionado tambem.
Sua imagem deve ficar mais ou menos assim:
Nossa primeira parte esta feita, é meio trabalhoso mais o resultado é outra coisa.
10º- Nessa passo você vai duplicar a sua imagem selecione ela e prescione Atl e araste uma cópia para baixo, ou da um Ctrl + c e depois um Ctrl + v.
Selecione a imagem que você feis a cópia, vai em Modify > Transform > Flip Vertical.
Posicione sua imagem abaixo.
Veja como devera ficar:
Estabdi assim dê um Ctrl+G para agrupar as duas imagens.
11º- Vamos agora exportar uma imagem para colocar de fundo e dar uma visão melhor.
File > Import ( Ctrl+R). Clique aqui para baixar a imagem que usei.
Após importar a imagem vai ficar em cima dos retangulos cinzas, selecione a imagem e prescisone Ctrl+Shift+ setinha para baixo. Sua imagem ira para o fundo, atrás dos retangulos cinzas. Depois disso selecione a imagem vai em Filters > Adjust Color > Hue/Saturation. Deixe as propriedades desse jeito abaixo:
Após esse passo de um Ok.
Ficando desse jeito:
12º- Agora vamos dar continuidade deixar esse topo mais cheio de coisas, como menu, logotipo e mais uma imagem.
Importe mais uma imagem vai em File > Import - ( Ctrl+R). Clique aqui para baixar a imagem que vou usar.
Importada a imagem deixa as propriedades da imagem, igual abaixo:
13º- Selecione os retangulos cinzas que estaão agrupados e prescione Ctrl+Shift+seta para cima, a imagem vai para baixo.
Feito isso selelcione a imagem vai em Command > Creative > Fade image.
Selecione a primeira opção igual a imagem abaixo:
Depois de adicionar o Fade Imagem, vai em Fliters > Adjust Color > Hue/ Saturarion.
Coloque as memas propriedades da imagem de fundo.
Sua imagem já com o Fade Image e o Hue Saturation, deve ficar mais ou menos assim:
Tudo certo nessa parte seu topo ja esta tomando o projeto final. Ele deve estar mais ou menos igual a este:
14º- Agora vamos desenvolver o menu.
Crie um retangulo no tamanho de 560 x 45, na cor branca coloque 60 de opacity
Veja abaixo:
Ja feito isso coloque as propriedades do seu retangulo igual a imagem abaixo:
Mais lembre-se que quando você desenhou o retangulo do menu ele ficou em cima dos rentangulos cinza agrupados, selecione os rengulos cinzas e prescione Ctrl+Shift+seta para cima.
Feito esses passos seu retangulo do menu vai estar em um lugar bom, agora é só por os links.
Veja como ficou:
Bom você pode configurar o menu onde desejar fica bom em varios lugares, tendo criatividade e imaginação consiguirá fazer coisas maneiras.
Agora dê uma encrementada no seu topo, pondo Logo Tipo e até da para por area de Login
Bom pessoal chegamos ao fim de mais um tutorial.
Espero ter ajudado muita gente ae com idéias.
Até a próximo tutorial.
Pessoal lembre-se Imaginação e criatividade é o que prevalece.