sexta-feira, 18 de junho de 2010

Crie seu Layout.

01 . Abra seu PhotoShop (ohh!) §XD

Agora vá em 'Arquivo/Novo' (File/New) ou digite Ctrl+N.
Pronto, agora apareceu essa janelinha idiota... bom, ela mostra a resolução (ou medidas) do documento que você irá criar! Digite 780 em largura (width) e 450 em altura (height).
Prontinho! E só lembrando que, 780x450 pixels é o tamanho padrão para layouts. Mas você pode também abrir um outro arquivo com a imagem que deseja, mas aí é só copiar e colar ela na janela que você abriu para criar o seu layout... tá ligado? ^__^


02. Ahh que legal... mas você tem aquele wallpaper super show, que você a-do-ra e quer usá-lo como template do seu blog? Fácil! §=D

Ignore o 1º passo, e inicie logo clicando em 'Arquivo/Abrir' (File/Open) ou digite Ctrl+O e procure a figura. Agora vá em 'Imagem/Tamanho da tela de pintura' (Image/Canvas size) e faça como descrito no passo: 780x450. A figura será cortada para ficar do tamanho padrão: 780x450.
Ou então simplesmente recorte a figura do tamanho que desejares... mas o tamanho total da janela onde será elaborado seu layout tem que ter a as dimensões que citei, ok? §=)

Prooonto? Agora sim, vamos ao que interessa! §=}


03. Vamos desenhar os retângulos! (é onde irá fica o conteúdo do blog - post e perfil) ^_^ Humm, que a coisa tá ficanu boua!

Clike na ferramenta retângulo (U), e desenhe 2 deles onde você achar melhor. Observe os tamanhos (largura) pois que um será para os Posts e o outro p/ Perfil.
Pronto? Agora que tal escolher a cor de fundo dos retângulos? Vai ficar a sua cara! §=)~


04. Vá em 'Janela/Camadas' (Window/Layers). Com essa opção marcada, vai aparecer essa janelinha da esquerda. Dê duplo clike no quadrado onde aponta a setinha. Ele mostra a cor de fundo dessa camada (layer). Eu escolhi o branco. ^_^

Uffa.. e aí, gostou? Ah, você tá achando os retângulos muito opacos e sem-graça? Humm..
I have a good idea! §XD~


05. Agora alguns efeitos pra dar mais vida ao seu layout!
Vá na opção 'Opacidade' (opacit) e coloque um valor de 0 a 100%. Sendo que, 100% é totalmente opaco e 0% é transparente. Um valor próximo da transparência dá um efeito legal, já que não fica totalmente transparente, e ainda dá pra ver a cor original de fundo da camada (layer) do retângulo.

Legal né? Agora Clike com o botão direito nessa camada (layer) e em seguida em 'Opções de mesclagem' (Blending options) São várias as opções desta ferramenta, e como cada um tem seu gosto, eu vou só dar uma pequena idéia pra você. §=}


06. Continuando o passo anterior, após clicar em 'Opções de mesclagem' (Blending options) vai surgir bem na nossa cara, uma janela pra lá de enorme... Agora se prestar atenção, no canto esquerdo da mesma, tem uma opçãozinha parecida com essa que colokei aki. (ohh!) o_O'

Eu marquei as opções: 'sombra projetada'(Drop Shadow), 'brilho externo' (Outer Glow) e brilho interno' (Inner Glow), mas pode fazer do jeito que quiser ok? §;)

Mais uma coisa: não pense que é só marcá-la e pronto! na-na-na! §=D
Observe bem... pois como mostra na figura, eu marquei e clikei na opção 'Traçado' (Stroke). Pois bem, agora posso configurar a meu bel-prazer, essa opção. ^_^


07. Uhú! E num é que essa coisa tá ficando legal? §XD

Olha só: Eu configurei o 'Traçado' (stroke) nos valores: 2 para 'tamanho' (size) e cor #630354. Lembrando que no mundo html, as cores são conhecidas por códigos hexadecimais, ou seja, cada cor tem como "nome" um código de 6 números, que varia do preto= #00000 ao branco= #FFFFFF (se quiser saber mais, procura um tutorial de Html aew!) o_O'


08. Bom, quem é o Perfil e quem é o Post aki nessa bagunça? Vamos identificá-los né? ^_^
Clike na ferramenta (T) na barra à esquerda, e escreva oque quiser sobre os retângulos. Agora, usando a ferramenta
(V) ajuste as palavras onde e como desejar. §=)
Ah, e tome sempre o cuidado de manter a camada (layer) T acima da camada do wallpaper ou figura principal.


09. Novamente usando a ferramenta 'Opções de mesclagem' (Blending options), vamos repetir que fizemos com os retângulos! E agora que você já deve 'tá crake' nessa ferramenta, vou resumir, ok?

Pronto? Agora já nas configurações, eu marquei as opções:
'Sombra projetada' (drop shadow), 'chanfro/entalhe' (Benvel and Emboss) e 'traçado' (Stroke).
A configuração do 'traçado' ficou como: Size=3 e Cor= #ECD5DF


10. E aí, gostando? Bem, pessoalmente, eu sempre uso bastantes efeitos.. contradizendo esse meu tutorial, já que aqui tá tudo muito simples! ^__^

Quanto à qualidade do layout, isso depende da sua criatividade, ok?
Eu só mexi uns pauzinhos pra você ter uma idéia básica, de como se monta uma canoa! *rs §=D


E aí? Gostou? Mesmo? Conseguiu aprender algo? Uffa.. Eu espero que sim viu... senão vou aí virtualmente, lhe dar uns cascudos! §XD (rs)

Poiséé... mas não pense que acabou! na-na-na! §=P
Na próxima seção, você vai ver como dar aquele toque final no seu layout... afinal, ele tem que ficar a sua cara, né? ^__^

See ya! \o_

0 comentários:

Enviar um comentário