sexta-feira, 3 de outubro de 2008

Imagem com fundo transparente usando GIMP

Saudações mais uma vez,

Hoje vou falar a respeito de como criar uma imagem com fundo transparente com o GIMP.
Eu criei um vídeo onde explico passo a passo, na prática, utilizando o GIMP 2.4.5 e linux Ubuntu 8.04. Mas acredito que na maioria das versões do GIMP (Windows ou Linux) o processo seja bem similar.



(Eu sei, minha voz é um tanto quanto engraçada no microfone, mas fazer o que né)

Agora vou descrever as etapas passo a passo, caso tenha ficado alguma dúvida.

Como funciona.

Para se criar a imagem com fundo transparente é bem simples, o conceito básico é colocar uma camada transparente por detrás da imagem e remover da imagem original as partes que deseja que fique transparente.

Adicionando canal alfa.

Para adicionar essa camada basta abrir a janela de camadas, clicar sobre a camada da imagem com o botão direito do mouse e selecionar a opção "Adicionar canal alfa". Isso fará com que a camada selecionada fique com o fundo padrão transparente.

Caso a janela de camadas não esteja aparecendo para você, abra no menubar da imagem o menu "Diálogos" e clique em "Camadas".

Removendo fundo da imagem.

Agora precisamos selecionar as partes do fundo da imagem que desejamos remover.

Como eu disse no vídeo, o jeito mais fácil de fazer isso é utilizando a ferramenta de seleção por cor, que se encontra na barra de ferramentas padrão do GIMP.

Ao clicarmos sobre a imagem ele selecionará todos os pixels que tiverem a mesma cor que a seleção. Para obtermos um melhor resultado, selecione no menu da ferramenta de seleção por cor a opção "Enevoar bordas", e ajuste para 4 o raio e 45 o limite. Isso servirá para ele selecionar também cores semelhantes as da seleção, para o caso de sua imagem tiver vários tons da cor do fundo.

Removendo e salvando.

Após isso basta clicar sobre a cor desejada e apertar a tecla "Delete" para remover (ou clicar em Editar -> Limpar).

Salve em uma extensão que aceite a transparência (exemplo: GIF, PNG), basta digitar a extensão desejada no nome da imagem na hora de salvar.

Os valores raio 4 e limite 45 são apenas uma sugestão que eu li em outros sites na internet como bons valores para essa tarefa, mas você pode alterá-los para melhor se adptarem a sua imagem.

Abaixo a imagem que foi resultado do exemplo do vídeo:


Vou aproveitar o post para divulgar que dia primeiro de outubro (antes de ontem) foi lançada uma nova versão do GIMP, o GIMP 2.6, confiram em http://gimp.org/downloads

[]s pessoal, até a próxima.

Links relacionados:

45 comentários:

Richard Leh disse...

E ae brunão... blzmaaa?

Orra... bem fácil fazer isso hein... mas o vídeo ta muito bem feito... gostei veio... parabéns pela a iniciativa do blog...

qnt mais informação melhor... neh n?

(é impressão minha ou passou um avião enquanto se tava fazndo o vídeo? huahsuuas)

Abraço :D

ღ єиєι∂α ღ ●~ઇ‍ઉ~● disse...

Olá,vc poderia dizer como fazer isso no photofiltre? eu fiz mas qdo salvo a imagem e coloco no meu site,ela aparece com um fundo branco :(

ღ єиєι∂α ღ ●~ઇ‍ઉ~● disse...

eu tentei colocar num blog o blogspot

Bruno Grasselli disse...

Olá,

Desculpa mas nunca trabalhei com o photofiltre (é um editor de imagens, certo?).

Uma dica: se você está trabalhando com imagens com extensão PNG, em alguns navegadores antigos a transparência não funciona, como no internet explorer 6. O ideal nesse caso seria usar extensão GIF ou o uso de algum javascript a parte para forçar a transparência do PNG.

Abraços.

Jack disse...

Olá bruno olhei seu video de como deixar a img com fundo transparente,muito bom parabéns.
Mas eu gostaria de fazer outra coisa em meu blog:
Gostaria de deixar as barras laterais ou sidebar como a desse blog aqui http://allgamesbr.com/,pois quando elas terminam ficam com uma transparência e não consigo fazer isso, se vc puder me dar um toque sobre isso seria legal,e existem muitas pessoas interressadas nesse assunto tambem.
O meu muito obrigado antecipado abração ate mais.
Jack
www.jack-maconha.blogspot.com
Lançamentos de filmes é aqui!!!

Aguardo ansiosamente sua resposta através de meu blog.

Bruno Grasselli disse...

Olá Jack,

Obrigado por entrar em contato, é sempre bom ouvir o que os visitantes do blog tem a dizer.

Não consegui identificar qual é a barra que você está se referindo. Poderia ser mais específico?

Abraços.

Artur C. Baldon disse...

Saudações!

Obrigado pela dica Bruno. Muito útil, era exatamente isso que eu estava procurando.

Parabéns, "good job" :)

Abraços.

Artur C. Baldon

Bruno Grasselli disse...

Artur,

Por nada.

É gratificante saber que o post está sendo útil. Obrigado pelo comentário.

Abraços,

Bruno Grasselli.

Eneas Oliveira disse...

Bruno, como vc disse sua voz no microfone não é lá muito simpatica, mas o tutorial está ótimo. Simples e objetivo. Valeu!

Aminon disse...

Ola Bruno!
So passei pra te desejar um otimo domingo e dizer muito obrigado por esse post. Eu tava precisando muito.
Ele deu certo pra metade do que eu queria a outra o Power point fez com o logotipo.
xau
Se cuida !

Mateus disse...

nossa gostei mtu do blog...até colokei nos favoritos para nao esquecer mais =D


antes eu apagava com a borracha o fundo e às vezes pegava um pouco a imagem...ficava horrível...agora fiko mtu mais fácil!


mtu obrigado...ta de parabééns!

Viviane disse...

Olá Bruno!

Parabéns pelo seu blog e pelo vídeo sobre como fazer uma imagem transparente usando Gimp.

Nem acreditei quando consegui fazer e deu certo.

Bruno, eu gostaria de saber como deixar a imagem com o fundo transparente, mas sem a borda.

Se você puder me explicar, meu
e-mail: viviane_607@hotmail.com

Abçs.

Viviane.

Anônimo disse...

Parabens Bruno pela sua iniciativa, pra mim tambem foi util o seu video, pois estou fazendo uma edição no PINNACLE 12 e este video que vc postou ajudou bastante, atraves dele coloquei um PIP com fundo transparente

meu email e joseluize10@hotmail.com

Helen disse...

Fiz exatamente como o tutorial, mas com a ferramenta tesoura...na finalização o que ficou transparente foi a área selecionada por mim e não o fundo, o que estou fazendo de errado?

Bayaty disse...

E$xcelente Grasseli! Muitissimo obrigada! Eu estava doidinha procurando um jeito de fazer essa transparencia, instalei montes de softwares e vc me ajudou de uma maneira tao simples e rapida! Muitos bonus no ceu pra vc! Abraços! Bayaty

Sayan Produções disse...

Vlw kara!!! Eu estava tentando descobrir como fazer isso a muito tempo e é fácil,fácil! E e vc é fã de Dragon Ball, se divirta com nossas sagas e video-tiras engraçadas Acesse: www.sayanproducoes.blogspot.com

Wagner Fernandes matos disse...

Estava procurando justamente isso. Mto útil. Abraço

D disse...

Mto obrigada!

Gérson Vagner disse...

Rapaz, uma grande "mão na roda" esse vídeo. Me foi muito útil, principalmente pela sua didática prática ali empregada.
Valeu!
Fica com Deus!

Abraço!

Marcelo disse...

Muito útil!
Eu estava precisando exatamente disso.
Parabéns!Belo trabalho e continue cada vez melhor...

Andres disse...

Valeu!
Meu ajudou muito!
Uso o SO Win7.

vicente disse...

excelente...não tenho como agradecer...

Gi disse...

Parabéns...muito obrigada..era isso que eu precisava!!!

Anônimo disse...

Excelente material, me ajudou muito. Você tem uma ótima didática.

Higo Matos disse...

Excelente, sou leigo em softwares gráficos e consegui retirar o fundo da imagem com Gimp no Mac OS.

Higo Matos.

Anônimo disse...

amei amei ameiiiii,,,perfeitoo
obrigada,,precisava muitoo
e parabéns pelo videoo
(e a voz é muito perfeita)

Anônimo disse...

ola bruno gostaria de agradecer , eu já estava quase excluindo o gimp do meu pc pois eu tentei varias vezes fazer a foto ficar com o fundo transparente e nunca tinha conseguindo . mais com a sua ajuda eu acabei conseguindo e ficou perfeito . muito obrigado pela dica um abraço e fique com deus

Marisa disse...

Oi Bruno td bem?Eu preciso da sua ajuda,preciso deixar as fotos com fundo transp.mas não estou conseguindo,como baixei o gimp faz pouco tempo não sei mexer em nada,trabalho numa fabrica de moveis,e quero postar essas fotos num cd que vamos montar com os moveis que fabricamos.Tem como eu te passar uma das fotos e vc montar pra mim, e depois me explicar passo a passo oque foi feito?Preciso de ajuda,ja entrei na comunidade do gimp no orkut,porem ainda não tive sucesso.Aguardo sua ajuda.

shaheensr disse...

Nao deu certo, eu segui o que voce escreveu. Acho que devo tentar com o video

Anônimo disse...

Muito obrigado dela ajuda.

Gloria disse...

Era isso que tava procurando!
espero que de certo!!!ficou
mto legal o seu logotipo.Eu
quero fazer um logo pra video,filmes
etc...mas só que fica esse fdo.branco
e a minha intenção é justamente essa:
Deixar do jeitinho do seu=) volto pra
dizer como foi.bjãoooo!

gloriacat disse...

Aiii Bruno não deu certo
=( eu segui passo a passo o
seu video-tutorial mas não sei pq deu erro!=( Eu 1º salvei em gif.como
vc recomendou e tals.mas depois fui
obrigada a mudar o formato pra bitmap
(pq eu to querendo fazer um logo para video como havia comentado) Será que foi isso??Vc pode me dá umas dicas?Agradeço mto!parabéns
pelo blog e pela boa vontade em ajudar!vlwwww *;*

Anônimo disse...

Bruno, fantástico seu tuto. Estou quebrando a cabeça para montar meu blog e um dos problemas era o logo que ficava com fundo branco. Muito obrigada e parabéns pelo blog!

Zélia C. ~ disse...

Olá Bruno, muito bom seu video, me ajudou bastante! :D

- cmmenna disse...

Pô, pode crer! Ajudou pacas! Valeu!

Ruthi *-* disse...

Muuuito util mesmo ! Ajudou muito bah! Valeu !!

zinco disse...

cara muito bom!

muito melhor que o photoshop.

ate mais!

Marcela disse...

Bruno!
Resolveu meu problema!
Obrigada por compartilhar!

caio halcsik felix disse...

Gostaria de saber se eu quiser tipo deixar o branco de dentro da imagem e so retirar o fundo e que estou querendo fazer uma sign e preciso do branco dentro do personagem e gostaria de saber como permanecer com o branco dentro dele obrigado e o tutorial foi mt bom

Mário Romeu da Silva Junior disse...

Muito Bom !

Simples e objetivo !

Abraços

Gabi Machado . disse...

oooi amei seu blog , já segui , se puder segue de volta se puder Beejos da gabbi http://gm-cinderelaaocontrario.blogspot.com.br/

Thiagop disse...

Muito obrigado cara.

Anônimo disse...

Oi td bem tenho uma imagem de um convite mas esta imagem tem um espaço para por a foto, mas o fundo onde coloca a foto esta em branco, no caso não fica aquele vasado entende? ai eu gostaria de saber se eu consigo cortar só o meio onde eu presciso por a fototentei fazer como vc mostra no video aula mas não obtive sucesso, pode me ajudar eu presciso destes convites pronto para esta semana ainda, se puder pode me responder por email. zeteteles_18@hotmail.com

Ademir Freitas Machado disse...

Obrigado pela informação. Era isso que eu queria há anos e não sabia que o Gimp fazia isso com tanta facilidade. Minha fé no software livre foi restaurada!

Anônimo disse...

Olá.. Fiz tudo certinho como vc explicou, mas na hora de salvar... No meu, não dá a opção de salvar GIF ou PNG. O que eu faço?