08 março 2013

Como colocar sombra/borda/contorno colorido em imagem transparente PNG em editor ON LINE



Colocando borda em imagens em png transparente no PIXLR

Enquanto não fica pronto o próximo tutorial (continuem votando na enquete do blog, na barra lateral, sobre o "Próximo Tutorial") uma leitora do blog perguntou nos comentários como eu colocava "Bordas" coloridas nas minhas imagens em png com fundo transparente.
Como no exemplo da imagem abaixo:

http://1.bp.blogspot.com/-CdQu9xbjmZE/UY8LNcVA7-I/AAAAAAAAHAA/H8NXucS_pNA/s1600/exemplo.jpg

Esse tipo de borda/contorno/sombreado é muito fácil! E o que é melhor: Pode-se fazer on line sem precisar de programa baixado. E ainda aplicar vários estilos de bordas e sombras em imagens em png.
Graças ao site pixlr.com/ eu amo esse site ♥
Vamos começar?

Passo-a-Passo

Na verdade, nesse tutorial, vou ensinar a fazer 5(CINCO) Estilos de contornos/bordas/sombreados.
1º Abra o site pixlr.com/editor
Vai abrir na sua tela a seguinte imagem com 4 opções
Escolha a opção "ABRIR IMAGEM DO COMPUTADOR"


4º A imagem em png irá carregar em poucos segundos e abrirá assim a tela.
Localize do lado direito uma janelinha das "CAMADAS" o quadrado do meio


Nessa janela das "CAMADAS" procure um desenho, um ícone de um quadradinho e uma estrelinha o 3º ícone da parte de baixo da janelinha das "CAMADAS" e clique nesse quadradinho


 5º Vai abrir uma outra janelinha. A janelinha dos "ESTILOS DE CAMADAS"
Há 5 estilos de camadas que aplicando à imagem teremos infinitos efeitos de bordas/contornos e sombras nas imagens

6º Vamos  aprender a aplicar todos esses estilos de sombras e bordas/contornos?
Vamos começar pelo 1º estilo:

 "SOMBRA PROJETADA"

Clique no quadradinho da opção "Sombra Pojetada" para escolher e logo depois clique em cima da opção(do nome "Sombra pojetada")


Veja abaixo o resultado do efeito da "SOMBRA PROJETADA" ajustando conforme a figura abaixo.
Mas, só é uma sugestão. Você pode dar o seu próprio ajuste regulando a cor, opacidade, distância, tamanho, ângulo porque na hora dá pra ver o resultado! Se não gostar vai mudando ao seu gosto.

 Outro estilo de sombra é a  
"SOMBRA INTERNA" 

Não esqueça: clique no quadradinho dessa opção e depois em cima da opção(do nome "Sombra interna")
Dá um efeito legal na imagem em png.
Veja abaixo o resultado do efeito dessa sombra usando a cor que escolhi. 
Novamente aqui você regula ao seu gosto ou para combinar com seu layout ou montagem porque ao escolher a cor abre-se uma paleta de cores que você pode escolher ou colar o código HTML da cor que você está usando no seu layout. Bom, né?



O 3º estilo é o SOMBRA "CHANFRO"

Escolha esse estilo clicando no quadradinho desse estilo e em cima do nome "Chanfro"
Aplicando cores claras fica um efeito lindo pra compor montagens!










O 4º estilo é o de "BRILHO EXTERNO" 

Gosto muito desse efeito. Abaixo 2 sugestões de regular o efeito. Mas, você é que personaliza o estilo da sombra da imagem em png.






O 5º estilo de sombra é "BRILHO INTERNO"

Esse eu uso bastante pra suavizar o serrilhado quando tiro o fundo de uma imagem. Sabe, aqueles fiapinhos deixados quando você transforma em png transparente?















A dica é  ao  clicar nesse estilo escolha a cor através da paleta para combinar com a imagem ou com a sua montagem ou para esconder o serrilhado deixado por apagar o fundo.
Você ainda terá a ferramenta de um "CONTA GOTAS" onde automaticamente ao clicar em "COR" você leva o cursor para qualquer parte colorida da sua imagem que irá gerar a paleta de cores que melhor combinarão para contornar a imagem. Isso é divino!











Dá pra usar a criatividade e criar vários estilos de sombra!
Em breve postarei esse mesmo efeito de colocar sombras coloridas ou sombra em glitter no photoscape. Quem gostaria?
Então, aproveitem o tuto e boas montagens pra vocês!

SOMBRA ARCO-IRIS= JUNTARTODOS OS EFEITOS DE SOMBRA  DO PIXLR








12 comentários:

  1. Oi,adorei me ajudou muito!você pode fazer um tutorial de como fazer um cabeçalho parecido com o que está no seu blog atualmente ou tbm pode ser o cabeçalho que tava antes !
    obrigada,beijos

    ResponderExcluir
    Respostas
    1. Sim, vou ficar pensando na possibilidade de fazer esse tutorial.
      Beijos

      Excluir
  2. N consegui fazer esse ultimo... :( Foi o que +gosteiii

    ResponderExcluir
    Respostas
    1. O 5º estilo de sombra o "BRILHO INTERNO" foi?
      Ah, mas você vai conseguir. Você é capaz. Continuando treinando. das 1ªs vezes a gente se atrapalha qdo. é a 1ª vez q usa essa ferramenta.
      Abraços e obrigada por ler todinho o tutorial e comentar

      Excluir
  3. Amei as dicas,Obrigada faz tempo que queria aprender a fazer bordas nos meus pngs
    e graças a vc eu consegui
    Muito obrigada vc me ajudou muito
    Estou Grata

    Muito Obg!
    Grata!

    ResponderExcluir
  4. Respostas
    1. Além dessas dá pra fazer sombra com gliter, sombras inteiras coloridas ou pretas mas, não nesse editor. Esses tipos (gliter por exemplo) dá pra fazer no photoscape, phofiltre ou num photoshop

      Excluir
  5. Olá como vai ?
    então pode fazer um tutorial de como eu faço essa borda: http://imm.io/15hvq http://imm.io/15nRL
    xxxxxxxxxx

    ResponderExcluir
  6. Olá Lorena!
    Será que vc quer é esse tipo de borda?
    http://1.bp.blogspot.com/-CdQu9xbjmZE/UY8LNcVA7-I/AAAAAAAAHAA/H8NXucS_pNA/s1600/exemplo.jpg
    Se for vou te explicar por aqui:
    Acho que a borda que você me mostrou nos pngs da Selena e Demi é o 4º estilo "BRILHO EXTERNO ,aí de cima do tutorial.
    Vou te sugerir o que você pode mudar na janelinha de "ESTILOS DE CAMADAS" pra borda ficar como vc quer:
    Opacidade : 100
    Dureza: 8
    Tamanho: 23

    ResponderExcluir
  7. Não consigo, o fundo da minha imagem é branco. O que eu faço?

    ResponderExcluir
  8. Vc é ótima perfeita. Eu precisava muito aprender agr nao largo mais seu blog, continue atualizando please!!!! arrazouuu!

    ResponderExcluir