Layout no fireworks

1ª Parte - Criação do Topo
| |

Vamos começar!

Primeiramente crie um novo documento com 900px de largura por 1000px de altura com fundo branco (#FFFFFF).

Com a ferramenta Rectangle tool (U) crie um retângulo com 880px de largura, 100px de altura e. Posicione-o com aproximadamente 10px de distância do topo e da margem esquerda.
Em cor, selecione Gradient > Linear e coloque as cores #FFFFFF e #C8C8C8 de cima pra baixo e borda 1px na cor #CCCCCC.
Coloque também uma sombra. Para isso vá em Filters > Shadow and Glow > Drop Shadow com cor #333333 e com as seguintes configurações:
[pic]

Sua imagem deve estar assim:
[pic]

Feito isso vamos finalizar nosso topo fazendo uma barra de pesquisa.
Crie um retângulo com 330px de largura e 40px de altura e com os cantos inferiores arredondados e borda de 1px na cor #CCCCCC e cor Gradient > Linear #FFFFFF e #EBEBEB de cima pra baixo.
Sua imagem deve estar assim:
[pic]

Feito o fundo da barra de pesquisa vamos criar a caixa de texto. Para isso, com a ferramenta Rectangle tool (U) crie um retângulo com 250px de largura e 25px de altura e defina a propriedade Rectangle Roundness com valor 30 com fundo branco e bordas na cor #CCCCCC.
Sua imagem deve estar assim:
[pic]

Agora vamos fazer o botão onde o usuário ira clicar para fazer a busca. Faça um retângulo com 50px de largura e 25px de altura e defina a propriedade Rectangle Roundness com valor 30 com fundo branco e bordas na cor #CCCCCC.
Com a ferramenta Text tool (T) digite “Busca” com letra Arial tamanho 15 e na cor #666666.
Sua imagem deve estar assim:
[pic]

Finalizamos nosso topo. Você pode trabalhar melhor com cores e formas e deixar o topo cada vez melhor, ai vai da criatividade de cada um.

2ª Parte - Criação do Menu
|