Character Image Background transparency question

Discuss how to use the Ren'Py engine to create visual novels and story-based games. New releases are announced in this section.
Forum rules
This is the right place for Ren'Py help. Please ask one question per thread, use a descriptive subject like 'NotFound error in option.rpy' , and include all the relevant information - especially any relevant code and traceback messages. Use the code tag to format scripts.
Post Reply
Message
Author
SS_Spike
Newbie
Posts: 2
Joined: Mon Jul 13, 2009 7:33 pm
Contact:

Character Image Background transparency question

#1 Post by SS_Spike »

I have a problem with my character Images. I cant get the background of the image to be transparent so the background image is showing. I am using PNG format I just have no experience with the format, so... please and thank you

Also, Id like to know what progams you all use to draw you're character images...

thanks from a noob...

KimiYoriBaka
Miko-Class Veteran
Posts: 636
Joined: Thu May 14, 2009 8:15 pm
Projects: Castle of Arhannia
Contact:

Re: Character Image Background transparency question

#2 Post by KimiYoriBaka »

go into gimp or photoshop or something of the like, use duplicate layer to make a copy of your image that isn't considered "background". Then delete the background layer and erase the unwanted parts. There's another way that uses the "magic wand" tool, but it amounts to about the same thing. Oh, and when erasing the unwanted parts, you can use "select by color" combined with "clear" or "cut" to get rid of them quickly, as long as you fill them all in with a random color first (specifically one that isn't used anywhere else in the image, as the normal white is usually also in the eyes).

Xino
Regular
Posts: 78
Joined: Tue Jun 23, 2009 12:26 pm
Projects: W.I.P. Love Demon
Contact:

Re: Character Image Background transparency question

#3 Post by Xino »

Dstarboy helped me out with a similar problem.

IF you use GIMP. Load your image and follow these steps. (If you don't, you can always download it for free if you want)

-Use the fuzzy select tool.
-Select the white background.
-Hold Ctrl+Shift and select any parts that didn't highlight with the first click.
-Right click the image and go to "Select" and then "Invert" (This should highlight the whole image you want to keep)
-Ctrl+X
-Make a new layer and Ctrl+V
-Delete the original layer and erase any white outlines left behind!

Also, everyone I've talked to seem prefer ".png"s.
Want something drawn? Just ask~! I love to draw! Free of charge!

I <3 Ctrl+Z

dstarsboy
Veteran
Posts: 461
Joined: Mon Apr 27, 2009 4:58 pm
Location: Phoenix
Contact:

Re: Character Image Background transparency question

#4 Post by dstarsboy »

Yeah, really wierd how I couldn't just select the background in gimp and delete it, the only way I could make it transparent is to cut and paste the non-background portion onto a new layer. If anyone knows how to simply delete the background that would save quite a few steps.

Also, png is one of the best lossless image formats that supports transparencies. jpg and bmp do not support it. Gif does but I believe it's lossy.
Current Projects:
The Isle of St Marcus

lunasspecto
Regular
Posts: 160
Joined: Wed Aug 22, 2007 7:59 pm
Location: USA: New York City (school) and Massachusetts (home)
Contact:

Re: Character Image Background transparency question

#5 Post by lunasspecto »

As far as I know, GIF is actually lossless, but supports a very limited color palette.
from the virtual desk of Kazuki Mishima

SS_Spike
Newbie
Posts: 2
Joined: Mon Jul 13, 2009 7:33 pm
Contact:

Re: Character Image Background transparency question

#6 Post by SS_Spike »

Thanks for the help guys. It made things a helluva lot smoother getting started...

chronoluminaire
Eileen-Class Veteran
Posts: 1153
Joined: Mon Jul 07, 2003 4:57 pm
Completed: Elven Relations, Cloud Fairy, When I Rule The World
Tumblr: alextfish
Skype: alextfish
Location: Cambridge, UK
Contact:

Re: Character Image Background transparency question

#7 Post by chronoluminaire »

dstarsboy wrote:Yeah, really wierd how I couldn't just select the background in gimp and delete it, the only way I could make it transparent is to cut and paste the non-background portion onto a new layer. If anyone knows how to simply delete the background that would save quite a few steps.
This is probably because the GIMP image didn't have an alpha (transparency) channel.

If you go Image->Transparency->Add Alpha Channel, then when you cut away the background, it should turn to the checkered grey that indicates transparent.
I released 3 VNs, many moons ago: Elven Relations (IntRenAiMo 2007), When I Rule The World (NaNoRenO 2005), and Cloud Fairy (the Cute Light & Fluffy Project, 2009).
More recently I designed the board game Steam Works (published in 2015), available from a local gaming store near you!

User avatar
killdream
Veteran
Posts: 325
Joined: Wed Nov 05, 2008 1:05 pm
Projects: EVūL (WIP), insilo (WIP), Cute Demon Crashers!
Deviantart: robotlolita
Github: robotlolita
Location: World's End (aka Brazil)
Contact:

Re: Character Image Background transparency question

#8 Post by killdream »

Xino wrote:Dstarboy helped me out with a similar problem.

IF you use GIMP. Load your image and follow these steps. (If you don't, you can always download it for free if you want)

-Use the fuzzy select tool.
-Select the white background.
-Hold Ctrl+Shift and select any parts that didn't highlight with the first click.
-Right click the image and go to "Select" and then "Invert" (This should highlight the whole image you want to keep)
-Ctrl+X
-Make a new layer and Ctrl+V
-Delete the original layer and erase any white outlines left behind!

Also, everyone I've talked to seem prefer ".png"s.
I personally prefer to use masks instead of going all select/delete/erase.

And for PNGs, they're the only format supported by Ren'Py that has an alpha-channel (GIF uses color-key, what means that a pixel is transparent or not, they can't be semi-transparent).

Post Reply

Who is online

Users browsing this forum: Ahrefs [Bot], Bing [Bot], Google [Bot]