Pular para o conteúdo principal

Criando o efeito long shadow no photoshop

O cenário web tem se modificado bastante ultimamente. Uma das tendências é o efeito Long Shadow, ou traduzindo, sombra longa. Já existem diversos tutoriais ensinando como aplicar o efeito, eu optei pelo mais simples para que todos consigam acompanhar.


Passo 1

Crie um novo documento com tamanho de 400 x 400 px de fundo branco.

Passo 2

Crie uma nova camada e preencha com a cor #9b59b6.

Passo 3

Pressione as teclas control + T para ativar o modo free transform. Deixa o botão shift pressionado e mova a extremidade do quadrado para cima conforme imagem abaixo e dê ok.

Passo 4

Volte para ferramenta move tool, dê um control + A para selecionar todo trabalho e alinhe o quadrado que acabamos de redimensionar ao centro.

Passo 5

Crie uma nova camada, selecione a ferramenta custom shape toll. Aqui usaremos o trevo. Crie um na cor branca. Repita o passo do alinhamento anterior e deixe-o centralizado.

Passo 6

Ative as réguas do photoshop com o comando control + R, e arraste três linhas conforme a imagem.

Passo 7

Crie uma nova camada e arraste para baixo da camada do nosso trevo. Selecione a ferramenta peen tool configure para shape layers. Define a cor para #8e44ad.

Passo 8

Agora com a peen tool selecionada, crie um shape conforme mostro abaixo. Não se preocupe se ele ultrapassar nosso trabalho, irei explicar.

Último passo

Com a tecla ALT pressionada, dê um clique na linha que divide nosso quadrado e a sombra de nosso trevo. Repare que agora ela está presente dentro de nosso quadrado.

Resultado final

Criem variações, usem e abusem da criatividade. A imaginação é o limite!

É isso pessoal, espero que tenham curtido. Mostre o que conseguiram fazer por comentário, ficarei muito grato.

Comentários

Postar um comentário

Postagens mais visitadas deste blog

Seleção brasileira iphone wallpapers

Em clima de despedida de copa, apresento o mais novo conjunto de wallpapers para o seu iphone. Vista a camisa e junte-se a nova seleção que ressurgirá.

Crie um elegante menu com css e html

Neste tutorial você vai aprender como criar um elegante menu utilizando a dupla Html e Css em poucas linhas de códigos. Lembrando que o tutorial é voltado para o usuário iniciante, que está se aventurando como desenvolvedor front-end ou que desenvolve por hobbie.

Criando um rodapé com 3 colunas

O rodapé de um site não pode ser esquecido, deixado de lado contendo apenas uma data e uma assinatura copyright. Com o passar do tempo ele ganhou força, estilo, e pode ser tão relevante quanto a barra laretal.Neste tutorial, você irá criar um rodapé de três colunas com poucos códigos.