Actualmente muitos designers gostam de dar um estilo mais natural e não tão digital aos seus sites, usando elementos relativos à sua profissão – régua, lápis, borracha, pincel, wacom, bloco de notas e papel.. papel.. E que melhor para dar ao papel a aparência de papel que papel rasgado?

Então decidi fazer este artigo a mostrar como fazer texturas de papel rasgado de boa qualidade em vez das simulações digitais no Photoshop que a maior parte usa..

Se quiserem fazer o download dos ficheiros, cliquem aqui para ir para o fundo do artigo onde está o link para o download

Mas para os que querem ver o que se passa nos bastidores, continuem a ler =D

Material Necessário:

- Papel de embrulho de uma cor sólida (eu comprei um vermelho por €0,40 e só usei um pouco)
- Papel A4 de uma cor que tenha muito contraste à do papel de embrulho (eu usei roxo)
- Régua e Tesoura/X-acto (todos facultativos)
- Scanner

Eu escolhi papel de embrulho por ser barato em relação a muitos tipos de papéis, por ser fácil de encontrar nas mais diversas cores e por ter cada lado da folha de uma cor (uma colorida e uma branca)

Aqui está o que eu usei:

Passo 1

Então vamos lá começar a rasgar..

Cortei uma fita de papel, dividi-a em quatro e experiementei rasgar os pedaços de 4 formas diferentes: com e sem régua e com a parte colorida virada para cima e para baixo

A técnica que resulta melhor é com a parte colorida virada para cima (sem comparação) e com régua faz uma parte rasgada demasiado perfeita, por isso mais vale rasgar á mão..

Então rasguei depois vários pedaços de vários tamanhos do papel e fui digitalizar tudo.. Para digitalizar, ponham o papel rasgado no meio do scanner com a parte colorida a ser digiralizada e depois coloquem a folha de cor contrastante por cima, para depois vermos a diferença entre a parte rasgada (branca) e o fundo (agora da cor da folha.. sem folha seria também branco)

Eu usei estas características na digitalização:

Então depois de digitalizar, obti isto que vou guardar para se poder usar nas imagens que quiser depois..

Passo 2

Normalmente este estilo é usado para simular papel normal branco  ou pautado de caderno.. Mas nós vamos mais longe e vamos usar uma imagem para parecer que está imprimida e que o papel está rasgado.. Por isso precisamos de uma imagem.. Eu vou usar esta:

Vou criar um novo documento do Photoshop que vai ser a imagem final.. Vamos imaginar que é a header de um site, por isso vou criá-lo com a resolução de 550×200..

Arrastem a imagem que querem usar (eu vou usar a dar ondas) para o novo documento..

Agora vamos ao documento do scanner e com a Rectangular Marquee Tool vou seleccionar uma zona com melhor aspecto e vou pressionar Ctrl+C para copiar..

No novo documento documento, pressiono Ctrl+V para colar e depois redimensionei e posicionei com a Move Tool:

Vou ao documento do scanner e copio uma parte para a zona de baixo da imagem e colo na nova imagem..

Passo 3

Agora vamos usar a Clone Stamp Tool para criar os lados e o centro da imagem =D

Junto as duas layers do papel numa só (seleccionem a de cima e pressionem Ctrl+E)

Então com a Clone Stamp Tool vamos escolher um pincel suave pequeno (cerca de 20px) e vamos escolher uma zona do lado da imagem e colar na parte que falta..  Para escolher o local de origem, Pressionem a tecla Alt e cliquem onde querem.. Depois é só clicar noutro local, e ele vai colar lá o que seleccionaram:

Fazemos então isto para os dois lados da imagem, e depois para o centro:

Agora temos que substituir a parte roxa pelo nosso fundo e a parte vermelha pela nossa imagem..

Fundo primeiro..

Passo 4

Vou criar uma layer com o findo final da imagem.. Vou preenchê-lo com azul, uma mancha de branco no meio, preto dos lados e imenso gaussian blur (Filter>Blur>Gaussian Blur) para ficar com um gradiente =D

Agora ponho esta layer abaixo de todas as outras, ponho a da imagem das ondas invisível e vamos tratar da de papel..

Com a Eyedropper Tool, vou seleccionar o roxo que está à volta do papel.. Agora vamos ao menu Select>Color Range e isto vai seleccionar todo o roxo na nossa imagem.. Quanto mais baixo for o valor que escolhermos, mais próximas do nosso roxo vão ser as cores que ele vai “aceitar” na selecção criada.. Vamos escolher um valor de forma a que a parte rasgada (branca) fique a cinzento escuro (se ficar branca, não se vai ver depois.. se ficar preta, vai ficar demasiado opaca – o que também não queremos uma vez que essa parte é apenas algumas fibras de papel e por isso é ligeiramente transparente)..

Aceitamos a selecção e com a layer do papel seleccionada, clicamos no botão de criar uma máscara para a layer:

Como seleccionamos a parte roxa, e a máscara depende da selecção, agora só vemos a parte roxa da imagem, por isso vamos clicar na máscara, e com ela seleccionada pressionar Ctrl+I para inverter.. Agora já deve aparecer o inverso.. Só a parte de papel =D

Agora a parte vermelha..

Passo 5

Mesma coisa: Eyedropper Tool, seleccionar o vermelho, ir ao menu Select>Color Range e seleccionar de forma a ficar todo o vermelho incluído:

Clicamos em Ok, e desta vez, seleccionamos a imagem que queremos que apareça no papel (a das ondas) e  criamos a máscara lá.. Temos de ter essa layer acima da que tem o papel obviamente, ou não se vai ver =P

Na minha imagem ainda se notavam alguns pixeis vermelhos, por isso seleccionei a máscara da imagem das ondas e pressionei Ctrl+L para editar os levels:

Que tal está o resultado final?

Claro que não está muito realista porque não tem sombras..

Passo 6

Podemos adicionar umas sombras e até algum Warp como no tutorial dos selos =D

E o resultado foi este:

Mm.. Talvez o Blur tenha sido demasiado..

De qualquer maneira, agora já sabem fazer imagens destas =D

Para fazerem o download do ficheiro com o papel já pronto a usar e com transparência e tudo, cliquem aqui.

Espero que tenham gostado e até à próxima =D