Caminho de Navegação Fireworks / Artigos / Topo no fireworks

Nenhuma avalição
Indique ao Ueba Indique ao BlogBlogs Indique ao Delicious Indique ao Technorati Indique ao Google Bookmarks Indique ao Newsgator
TAGS

Nenhuma tag foi definida ainda!

Defina as tags para esta página preenchendo o campo abaixo.

  • Máximo de 100 tags
  • Cada tag deve ter até 20 caracteres.
  • Separar as tags com virgula. Ex.: php, sql, html, xml, fireworks
COMENTAR

INDICAR
Nome do amigo: E-mail do amigo: Comentário:
REPORTAR ERRO Descreva o erro:

Topo no fireworksPostada em: 17/08/2005

vicente Elias
Por: vicente Elias Nº de Visualizações: 4752.



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.