Pular para o conteúdo principal

Crie uma estante 3d no photoshop

O photoshop é minha ferramenta número um quando se trata de criação. É fantástico o que ele, com um pouco de inspiração, pode fazer. Recentemente criei uma estante 3d, tipo essas do aplicativo ibooks, para incluir em um projeto. O resultado você confere abaixo nesse super tutorial


Faça o download da textura.

1ª passo - Criando o fundo

Crie um novo documento do tamanho que bem entender. Selecione a ferramenta Paint Bucket Tool, defina a cor para #cacaca e preencha o fundo.

Acesse o menu Filter / Noise / Add Noise e defina o Amount para 2, Distribution deixe como uniform e desmarque Moochromatic, caso esteja marcado.

Estante 3d - Passo 1

Temos um fundo levemente texturizado. Ele é muito bom para criar fundos de websites, twitters e outros. Experimente.

2º passo - Criando a estante

Importe a textura que disponibilizei no começo do tutorial para dentro do nosso documento.

Estante 3d - Passo 2

Selecione a ferramenta Rectangular Marquee Tool e faça uma pequena seleção na borda da textura.

Estante 3d - Passo 3

Dê um control + x para recortar, e em seguida um control + v para colar. A imagem recortada ficará em uma nova camada.

Estante 3d - Passo 4

Selecione a camada da textura maior. Acesse o menu Edit / Transform / Perpective e traga o ponteiro para o lado direito. Repare que ambos os lados ficarão iguais.

Estante 3d - Passo 5

Confirme a mudança e, logo em seguida, dê um control + T para redimensionar a imagem. Traga o ponteiro para baixo, fazendo com que a imagem diminua.

Estante 3d - Passo 6

Junte uma imagem em cima da outra e perceba que já temos um efeito bacana.

Estante 3d - Passo 7

Selecione a ferramenta Line Tool, e faça uma linha na cor branca do comprimento da textura com o efeito. Posicione a linha entre as duas texturas, como mostra abaixo.

Estante 3d - Passo 8

Mude a iluminação da camada para Overlay, e deixe a Opacity em 40%.

Estante 3d - Passo 9

3º passo - Aplicando sombras

Crie uma nova camada e a posicione abaixo das camadas anteriores.

Estante 3d - Passo 10

Selecione a ferramenta Eliptical Marquee Tool, defina o Feather em 5px e crie um círculo oval abaixo da estante.

Estante 3d - Passo 11

Selecione a ferramenta Brush Tool e escolha um pincel suave de tamanho médio. Ajuste o Flow para 50% e passe, apenas uma vez, o pincel dentro da marcação oval que criamos.

Estante 3d - Passo 12

Dê um control + D para desfazer o círculo, e posicione a sombra até que fique bem colocada abaixo da estante. Abaixe a opacidade da camada para 60%.

Estante 3d - Passo 13

Pronto! Agora salve seu documento e estude todas as técnicas e ferramentas empregadas neste tutorial.

Resultado final

Estante 3d - Final

Experimente alterativas. Use novas texturas. Diminua ou aumente o tamanho da estante. Sua imaginação é o limite.

Veja um outros dois exemplo que criei com essa técnica.

Estante 3d - exemplo 2

Estante 3d - exemplo 3

Como sempre, gostaria de ouvir sua opinião sobre o que achou do tutorial e o que mais gostaria de ver no blog. Deixe sua sugestão, elogio ou crítica.

Webtutoriais:C998A740

Comentários

  1. Muito bom! Você é praticamente um profissional!
    Aprendi muito com você e seus tutoriais, continue assim, concerteza mais gente aprecia e respeita seu trabalho.

    ResponderExcluir
    Respostas
    1. Obrigado meu camarada. Com certeza irei continuar.

      Excluir
  2. Parabéns, muito bom mesmo, andava a procura disto a um tempao, Parabéns mais uma vez....sei que não sou pro, mas se poderem visitar e dizer algo dos meus trabalhos agradecia...abraços
    http://pbfotografia.blogspot.com
    :D

    ResponderExcluir

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á.

Formulário de contato no blogger com o google docs

Como o blogger ainda não incluiu um formulário de contato nativo, temos que adaptar algumas maneiras para que isso seja feito. Há alguns tutoriais na web com widgets e serviços que funcionam de forma satisfatória, porém, neste tutorial, irei ensinar como usar o próprio google para realizar essa tarefa.Google docsO googledocs é uma suite de aplicativos assim como o Microsoft Office e o BrOffice (gratuito), com a vantagem de funcionar online direto do browser e de ser gratuito. 1º passoAcesse o site do Google docs e faça seu login. 2º passoClique em criar novo e selecione formulário. 3º passoNeste passo, iremos configurar nosso formulário. Entenda a estrutura e como irá funcionar: Nosso formulário terá 4 campos sendo eles: Nome, Email, Site e Mensagem. Os dois primeiros campos da imagem acima que eu não numerei são auto explicativos. Você define um título e se quiser um texto de informação sobre o formulário.1- Define o texto do campo. Deixe-o como nome. 2- Texto adicional, que po…

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.