Texture Tutorial: Alpha to black

#1
Texture Tutorial: Alpha to black

Greetings. As many of you know, SoM uses pure black to create a see through hole in a texture.

I've recently had trouble with alpha channels in stock textures, and i couldnt find any guide or faq to indicate how to turn alpha into black. So i decided to make this tutorial, which will guide you through the conversion process.

You'l need GIMP (open source / free) and you're own stock textures. The one i'm using is free, and from a website.
Step 1

[Image: step1mm.jpg]

IMPORTANT: If you want the best image possible without gray/black pixels around the edges, resize you're image to you're needs now. My image is a much higher resolution for tutorial purposes.
SoM's maximum texture output resolution is 256x256.

Load up you're image into GIMP. Go to "Edit" and "Copy."

Step 2
Go to the "colours" tab in the top bar, select "desaturate" followed by the ok button. For this tutorial ill be using the default selection of lightness.
[Image: step2zn.jpg]

Step 3
[Image: step3.jpg]

Go to the "colours" tab again and select curves (1st reference). Drag the line from the middle to the top left corner, until you're texture turns white (2nd reference).
[Image: step4curvecombo.jpg]

Step 4
[Image: step5fuzzy.jpg]
Click on the magic wand lookalike icon in the toolbox, called the fuzzy select. Click anywhere on the white of the image and it should outline the whole white area.


Then click on "Edit" then "Paste into" while everything is still highlighted.

Step 5

Ok, heres the technical part.
Click ONCE inside the texture's area.
That should highlight what you are aiming for.
Now, click "Edit" and "Copy."

Step 6

Go to file, then new. Gimp automatically picks up what you're previous image size was, so dont worry about size adjustment. Click ok.

In the toolbox selection, go to the "Bucket" icon. Select 0 on every colour, like in my screenshot.
Bucket fill the area by clicking anywhere.
[Image: bucketfillblack.jpg]

Now go to "Edit" again and "Paste." Click anywhere on the texture to anchor the layer.

[Image: finalkjh.jpg]

You're image should have no issues. However bear in mind that if you choose to resize now, you will get gray/black pixels around the leaves in game.

I will show you how to have no gray/black pixels in more detail, in the next tutorial.

Cheers.

Verdite
Reply

#2
Just to say. Make sure you fill the white area with black in step 6.
Reply

#3
Good info- especially since GIMP is free so everyone here can have access to it.
Now I understand better what you meant when you mentioned this problem earlier.
I use Jasc PSP for editing graphics and it lets you replace the transparency with
black as a standard operation so I was being thick-headed and misunderstood :)
Reply

#4
Dont like to necro, but this is pretty important for GIMPists working with textures.

Removing interpolation

SOM uses the pure black 0,0,0 channel to allow for 'seethrough' effects in textures, saving potentially alot of vertices, hence why I made this tutorial for those who want to be efficient in modelling for SOM or similar.
Yesterday I was trying to make some plant textures with this method, however I needed to rotate the leaves in the texture to make it look effective, and after rotating them, I found alot of blurring occured around the edges, which can cause awful effects using the black transparency method in SOM. After searching the internet for a good while I found a solution, it was due to the interpolation being cubic, so set it to none and you can scale / rotate without adverse effects.

Magic wand threshold

Another quick tip, its simple, but if you are having trouble with the aforementioned magic wand tool, try adjusting the threshold. If you want to get a sharper edge around a texture space whilst removing the background colour, increase it to get a more prescise selection.
On the other hand, if you have accidentally created a black background and a gray part of the texture if being removed when you try to isolate the background, put the threshold down until you can de-select the background only.

Reply

#5
I just want to encourage everyone to put in the extra effort to get your black silhouettes perfect, and make sure there are no holes.

The silhouettes will look a lot better than many contemporary video games with \<span> site blocked, contact your administrator and sooner or later I am going to get around to hand coding a true 2D antialiasing filter for the alpha channel that best as I can figure should remove 90% or more of the bumpiness so that the edges will appear to be perfectly cut out not matter how close to them you get. I've never seen that even in a corporate game or demo.

If you really wanted to there is a way to do that already if you make your own texture and substitute it in for the one in the TXR/MDL files. You just need to find an imaging suite that can do it. Probably one of Adobe's would be the place to start looking (GIMP's AA filter is just a stupid kernel)


EDITED: It's impossible to find any information online about the kind of AA that is needed to make this work, because its such a special case, and its dwarfed by all the discussion of AA in video games. I don't even know if there is a section of Wikipedia for it.

But what's called for is really simple. You just need to take a length of pixels like ______| ‎  and gradually amp up the alpha channel until the next step up. That would allow for a perfect contour in the cutouts (which would be an impressive effect, that I think would even embarrass the bigwig game companies)
Reply

#6
Good info Ben and it works in other photo editors too. PaintShopPro that I use has a selection wand and has the same 'threshold' setting which it calls ‎  'tolerance'.

Since your post here brought this to my attention, I use the method here every time I make a texture with see-through parts!
Reply

#7
Found this today when querying GIMP's drop shadow. Might help.
https://answers.yahoo.com/question/index...709AAIfV9q
Reply

#8
Another trick if the magic wand isn't playing ball can be to split the channels into RGB and use one of those to combine to get the selection.
Reply

#9
Thanks Mark, I need to get the selection exact for game textures so any methods are appreciated.
Reply





Users browsing this thread:
5 Guest(s)