oque é um layout ?
A configuração de instalação (em inglês layout) estabelece a relação física entre as várias atividades. O layout pode ser simplesmente o arranjar ou o rearranjar das várias máquinas ou equipamentos até se obter a disposição mais agradável. No entanto, numa grande indústria, este procedimento não é tão simples, pois um simples erro pode levar a sérios problemas na utilização dos locais, pode originar a demolição de estruturas, paredes e até mesmo edifícios e consequentemente causar custos altíssimos no rearranjo. Para evitar tudo isto é necessário realizar um estudo, encontrando assim o melhor planeamento de layout. Pois, os custos relativos ao planeamento de um layout são inferiores aos custos relativos ao rearranjo de um layout defeituoso. Existem vários tipos de layouts e cada um deles se adequa a determinadas características, sendo uns mais vantajosos que outros. No planeamento do layout é necessário ter em conta todos os factores (os materiais, a maquinaria o Homem, o movimento, a espera, o serviço, a construção e a mudança, pois estes factores podem influenciar negativamente o planeamento do layout.iresmos usar um programa comun que todos devem conhecer o photoshop creio que qualquer versao funcionara
bem vamos começar
1. 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 #303730 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...
4. Com esta setinha branca selecionada, você vai clicar nos pontinhos brancos que se formou, onde ficará como na imagem abaixo.
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 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 + Ce 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
de11. pois você escolhe a textura Retícula Cruzada 3 com opacidade de 21% da textura finalizando...
12. 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 imagem 2 clicando aki 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 Imagem 2 ou se preferir usar outra fonte.... e com as letras minúsculas espalhe pelo topo verde....
a imagem abaixo é como está ficando, o texto do nome do site eu coloquei a fonte Kimbeley que está junto ao pacote de fontes, basta clicar aki para baixar, no texto eu coloquei um contorno verde e uma sombra, que você pode aplicar clicando no botão "+" que está perto da opacidade da figura acima....
14. Agora salve a Imagem 1 clicando aki 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"
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...
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...
22. para o menu, vamos fazer 2 retângulos... 1 com o fundo da cor #F3F9E6 e contorno #303730 outro com a cor #DFE0DF sem contorno.... e ficará assim....
23. 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...
24. faremos então o rodapé, que também é bem simples, faça como o topo... desde o início.... ajustando ele ficará assim...
