Alpha Textures

Thankyou Paul. I shall continue to experiment by trying different values and checking the final result in the simm. I find the appearance of graphics/textures differ in Trainz compared to MSTS for the same model export, hence the trial and error approach.
Cheers, Fender <!– s:) –><img src="{SMILIES_PATH}/icon_e_smile.gif" alt=":)" title="Smile" /><!– s:) –>

This really isn’t a tutoruial, just some notes and ideas on how I use alpha channels and alpha textures to achieve an effect.
If anyone would like to add any of their own ideas together with an image, please do so.
I can only touch on some of the techniques, it’s one of those subjects that you could easily write books on and still not cover everything.
Trial and error seems to be the way to achieve new efects.

One of the problems you will have, if you try to re-create any of these effects is…
At the moment 3DC doesn’t support any of the texture and material blend modes required to get some of the effects and you can’t set materials to be full bright and not to receive any light.
This doesn’t mean you can’t use 3DC to build and texture models that use alpha related textures.
What it does mean is, that where you need a blend mode to achieve an effect you will have to export the model from 3DC into an application or 3D engine where you can set the blend mode for certain textures or materials.
More on this later.
I’m not sure how this will effect train sim users, you would need to check things out to see how blend modes are handled within your given train sim.

Maybe some comments from the train sim guys would help clear up what you can and can’t do.

Alpha channels and alpha textures are not the same thing.

Alpha channels…..
To create a texture of say a tree or some railings where certain areas of the image need to be fully transparent, you have to use a file format that carries, what is called an alpha channel.
The alpha channel, in effect, masks off the areas of the image you want to be transparent.
The two main file formats used for this are .tga and .png

The difference between the tga and png file formats is….
With a .tga file you have to create the alpha channel in your paint app, it’s optional.
So you can have a . tga file with or without an alpha channel.
With a .png file the alpha channel is part of the file format, you don’t have to create it and it’s optional as to whether you use it or not.
There are other differences but for now this is all the info we need.

I think most of the train sims use the .tga file format but you need to check this out.
Most other 3D engines and 3D modelers will use both .tga and .png files…it’s your choice.
I prefare the .png format simply because it’s easier to use, not having to create the alpha channel every time.

Here’s a pic of a recent section on my Port Daniel line which is still a bit WIP but demonstrates the use of an alpha channel to create all the trees and grasses etc.
You couldn’t possibly model this lot, the poly count would go through the roof.

[img:mmy4vc75]http&#58;//img519&#46;imageshack&#46;us/img519/3747/achannel1ge8&#46;jpg[/img:mmy4vc75]

Alpha Textures….
These are used in a completly different way.
They can be any file format you wish…bmp, jpeg, tga, png etc but rail sim users may have to use .tga.
They don’t need an alpha channel.
They are can be both greyscale or colour.
With an alpha texture, black is fully transparent.

They’re uses are endless, you can use them to…..
Get the dirty glass effect on your windows
Create grime and dirt effects on your models.
Use them in your paint app to create endless effects with textures.
Use them with a particle engine/system to create smoke/steam effects, explosions, water droplets, flames etc.

Although not strictly speaking an alpha texture, you can use greyscale images to create..
Bump maps in most 3D modelers.
Height maps for creating terrains.

Only your imagination restricts what you can do with them.
If you’ve ever used any of the Effects in your paint app, especially Texture Effects then you are already using alpha textures. More on this later.
A good collection of alpha textures is invaluable.

I’ll try to cover as much as I can here, the alpha textures are by far the most interesting so will take up most of the tutorial.

A sort of three in one pic, showing some alpha textures in use..it’s a bit of a gloomy scene but it’s meant to be.
The dirty glass, the glow on the light and the areas on the walls where a picture may have once hung are all created with alpha textures
You can see the textures at the bottom of the image
I use a similar dirty glass texture for all my loco and carriage windows.

[img:3296qwsa]http&#58;//img519&#46;imageshack&#46;us/img519/4264/atexture1ck3&#46;jpg[/img:3296qwsa]

First the boring bit……
Creating .tga and .png files with an alpha channel in PaintShopPro and Photoshop

TGA files in PaintShopPro…
1) Create a new file and fill it with a background colour.
2) Paint the design you want in a different colour. (I’ll go into this in more detail later)
3) Next select the area of the image you want to be visible.(The bit you just painted)
If it’s a complicated design select the background colour and invert the selection.
4) In the Selects menu choose Load/Save selection and Save Selction to Alpha Channel.
5)Then save the file as a .tga file…thats it.

TGA files in Photoshop…….
1) Create a new file, fill it with whatever colour you wish.
2) Create a new layer, draw/paint the details you wish to be visible.
3) With layer 1 selected open the Select menu and click Load Selection, click OK.
4) Open the Select menu again and click Save Selection, click OK.
5) If you now look in the channel palette an Alpha channel has been added.
6) In the File menu choose Save As, choose tga, type a name, click OK, choose 32 bit, click OK.
Thats it… Remember the saved file will not retain the layers so save the file out as a Photoshop (psd) file as well just in case you need to make changes.
If you need to make some altertions at a later date just load the .psd file… make the changes and run through the above steps again after deleting the current alpha channel from the channel palette.

PNG Files in PaintShopPro….
There are a couple of ways to do this in PSP…Method1…
1) Create a new file, fill it with whatever colour you wish.
2) Draw/paint the details you wish to be visible.
3) Create a new layer leave it empty and drag it down in the layers palette so it becomes the bottom layer
4) Go back to the layer with the image on it.
5) Select the background colour and in the Edit menu choose Clear
6) Thats it…choose Save as and save as a .png file

Method 2…
1) Create a new file, fill it with whatever colour you wish.
2) Draw/paint the details you wish to be visible.
3) Make sure the background colour is selected as either your background or foreground colour.
4) Shoose Save As in the file menu and in the file requester select PNG
5) Click the Options button at bottom of the file requester and then the Run Optimizer button
6) Click the Transparency tab in the PNG Optimizer window.
7) Tick the Alpha Channel transparency option and…. Areas that match this colour
8) Right click the colour swatch and choose your image background colour
9) There is also a Tolerence setting you can adjust
10) Click OK and save the file

PNG Files in PhotoShop….
1) Create a new file, fill it with whatever colour you wish.
2) Draw/paint the details you wish to be visible.
3) In the layers palette, right click on the Background layer and choose… Layer from background
4) Create a new layer leave it empty and drag it down in the layers palette so it becomes the bottom layer
5) Go back to the layer with the image on it.
6) Select the background colour and in the Edit menu choose Clear
7) Thats it…choose Save as and save as a .png file

There should be a method 2 for PS as well similar to Method 2 for PSP but for the life of me I can’t work out how to do this in PS…if anyone knows let me know..PLEASE

You can make further adjustments simply by loading the .png file back into either PSP or PS…make the alterations and save the file.

Thats all the boring stuff over with.
Practice creating and saving some TGA and PNG files and applying them to some basic primitives in 3DC.

Here’s an example….
On the left is a basic test image created in PSP and exported as both a TGA and a PNG texure with an alpha channel.
On the right are both the TGA and PNG files applied to two sides of a cube primitive in 3DC

[img:308hdg1q]http&#58;//img519&#46;imageshack&#46;us/img519/4990/achannel2mu2&#46;jpg[/img:308hdg1q]

My main usage for alpha channel textures is for trees, shrubs, grasses etc.
First an ultra lowpoly tree/shrub thingie.
These won’t take close inspection from the camera, but are great for creating hedgerows and trees as long as the camera doesn’t get to close to them.

Fig 1…
Is a .bmp image which I use to create either the .tga or .png file, note the green background.
This .bmp file is my master copy.
One of the problems with both .tga and .png files is that you usually end up with a one pixel wide border of the background colour surrounding the final image.
So I try to get my background colour to match the colors of the texture, but you have to be careful here, the colour must be one that isn’t used by the main part of the texture.
If I had used a black background here, the leaves would have ended up with a one pixel wide black outline and it looks terrible on trees.

Fig 2…
The file was saved as a .png file in PSP using Method 2 in from the last post.
I used the Create Face plugin then Paul’s Double Sided plugin to give me a single face with two sides and applied the texture.
It looks ok but there’s a problem…
Obviously this single face doesn’t have any depth to it, and whilst the tree looks ok when viewed from the front or back, when viewed from the side or even just at a slight angle the camera gives the game away and you can see the tree doesn’t have any depth.

This is the main problem with using alpha channel textures, there is one other but more on this later.
So with things like railings and fencing for example as soon as the camera gets at an angle to the texture it’s obviouse the railings or fence doesn’t have any depth.

Fig 3 and 4…
There is a way around this for items that are cylindrical then viewd from above such as trees and shrubs.
The most popular way to do this is to create crossed planes/faces as in Fig 3. ( a perspective view from above)
For this to work the trunk of the tree must be central in the texture.
Here I used three planes, each rotated through 60 degrees.
You can use more planes if you wish but three is usually enough for something like this.
All you need to do is to select the first plane object, right click the Duplicate tool, set XYZ Shift to zero and Y Rotation to 60.
Duplicate the plane object then repeat for the third plane.

In Fig 4, I made the first plane the parent object and dragged the other two planes onto it in the heirarchy panel.
I selected each plane in turn and rescaled it slightly.
I then right clicked on the parent object and from the drop down menu chose Select Heirarchy, you can now scale the whole tree as you wish.

So what you now have is a very low poly shrubby tree which can be viewed from just about any angle, except from above.
The object only has 12 polys so you can have loads of these…just rescale some of them but be careful here because you also rescale the size of the leaf.
Again, remember, this method won’t stand up to really close examination from the camera.

[img:386r0kdo]http&#58;//img519&#46;imageshack&#46;us/img519/3664/achannel3ep5&#46;jpg[/img:386r0kdo]

I don’t want to get into tree construction here but suppose you want a tree that’s a bit more up market then the last one.
You can use the same principle but this time you need a texture of a branch…not a full tree.
This would also make a good subject for one of Paul’s plugins if he ever runs out of ideas.

Fig 1
The idea is you use a very basic trunk and attach ‘ branch planes’ around the trunk to form the tree.
This trunk used a 10 sided cylinder as a start, it was extruded and scaled along it’s y axis just to give a basic shape.
You don’t need to model any tree branches for this method although you can if you wish.
Delete the two cylinder end caps when you’ve completed the trunk.

Fig 2…
The texture used for the branches.

Fig 3….
Yes I know it’s not a very good tree but it only took 30 mins to complete.
Take your time with this method and you can produce some very realistic looking trees.

To make things a bit easier, when you create the first branch plane, scale it roughly to the size you want and use the shift tool to move the axis to the base of the plane. It makes it much easier to rotate and position each branch.

With this style of tree you can rotate the branch planes around any axis to get the effect you want.
The camera will view these mainly from below so keep tilting the camera in 3DC to give you an idea of how things are coming along.
It comes out at only 144 polys which ain’t to bad.

You can build most types of species trees with this method, oak, elm, ash etc.
You need to model some of the main tree branches to get the effect so the poly count starts to creep up.

Thats just about it for alpha channel textures as mentioned earlier they are a bit restrictive as to what you can use them for due to the lack of depth…they work quite well for windows..distant objects, weather cocks, trees etc.

[img:iobb2nab]http&#58;//img519&#46;imageshack&#46;us/img519/5082/achannel4lh0&#46;jpg[/img:iobb2nab]

There is one other problem I should mention regarding alpha textures both with and without an alpha channel.
It’s called z-ordering
Graphics cards have a problem when drawing objects to the screen in a 3D world that have some kind of transparent texture applied, especially if the alpha textures have been applied to a SINGLE MODEL…ie

Suppose you built a railway station scene in 3DC, the station windows use an alpha channel texture so you can see through them.
Outside the windows are some railings and some trees again using a texture with an alpha channel.
You export the whole scene form 3DC using the Export DX Object from the Component menu.
Even though you built all the objects within the scene as seperate items, by exporting as a DX object they now become just one object.

So the player walks into the station building and looks out through the window…what he should see are some railings with trees behind them.
More than likely what he will see, is a tree with a window and some railings behind it, or some wierd combination of this.
The graphics card can’t sort out which object should be drawn in front af the other and more often than not gets it all wrong.

Most 3D engines have ways around this problem, but you need to check this out before exporting say a block of shrubs using an Alpha channel texture.
The most common way around this, would be to export the station building, the railings and the trees as seprate objects.
They are then loaded into the 3D engine seperatly so they are no longer all one object.
Now your graphics card should now be able to sort out the order in which they should be drawn to the screen.

However this isn’t always possible…you couldn’t export every blade of grass a seperate object.
I’m not going to delve into all this here..it gets complicted, but check out what is required from your 3D engine regarding alpha textures.

Now the really interesting part…Alpha textures…
When you use an alpha texture instead of a texture with an alpha channel, darker areas of the texture become more transparent than lighter areas.
Full black becomes completly transparent, full white becomes completley opaque.

If your a PSP user take a look in the Paint Shop Pro directory, in the Textures folder then either of the Art Media, Geometric or Photo folders.
These are all alpha textures used to create most of the stuff in the Effects menu.
Notice some of these are .png files and others .bmp files.
The file type doesn’t really matter (unless your a Photoshop user)
These are nearley always greyscale images with varing degrees of black through to white thats all that matters.
You can load some of these into PSP to have a closer look if you wish, you can even create your own.

Photoshop is bit differnet ( wouldn’t you know)
In the Photoshop directory go to the Presets folder and then into the Textures folder.
You will find both Photoshop .psd and .jpg files here.
Only the .psd files are used as alpha textures.
If you want to create some of your own they must be saved as .psd files.
Again you can load some of these back into PS to take a closer look.

A good way to start creating your own alpha textures in either PSP or PS is to load one of the alpha textures from the texture folder…save it under another name and see what you can come up with.
More on this later.

Many of the effects you get from alpha textures are quite subtle, these are not the easiest to get screenshots of.
However ‘ in game’ they do make a big difference to the overall appearence of a model…sort of nice little touches that don’t jump out of the screen at you, but your eye takes them in anyway.

Dirty/discoloured glass is one of these.
It can of course be as grimmy as you wish but most times you just need enough discolouration to give the appearnce that there is some glass in a window frame.
It’s quite easy to achieve.

Here’s the effect on the cab windows of my latest hall class loco.
In the center of the image, surrounded by the orange box is the texture as used, represented full size 64×64.
It can be any format you wish…bmp, jpeg, tga, png etc.
Quite often a small texture works best, here, by stretching it over the glass area you can get the streaky effect.

Fig1 and 2 are screenshots from 3DC….

Fig 1….
The texture is applied as the Primary texture with the Miscellaneaous Colour at 190,190,190
But you can’t see through it…so…

Fig 2….
You load the SAME texture again but this time into the Translucency Map tab.
So you now have the same texture loaded as the Primary texture and as a Translucency map with the Miscellaneous colour as above.
Now you get the dirty glass effect.

In the lower part of the image is a screenshot from Blitz, inside the cab, looking out.
By adjusting the brightness/contrast of the glass texture in your paint app you can vary the amount of visible grime.
Also try adding just a SLIGHT hint of orange…maybe the driver is a heavy smoker…HeHeHe

[img:3n9zdmhn]http&#58;//img519&#46;imageshack&#46;us/img519/7228/atexture3eg0&#46;jpg[/img:3n9zdmhn]

Whilst I’m on about see through windows.
At one time I just used to use a .png file with an alpha channel making the glass area fully transparent and just leavng the window framing opaque.
This never really looked right for any windows the camera could get close to.

Also for different size windows you really needed an extra texture.
If you just use the same alpha channel texture and apply it to a larger window, you scale up the window framing as well.
So I needed a different approach, especially as I wanted to apply a dirty glass alpha texture to the glass, but of course not to the window framing.

With a standard window design this is quite easy with a few extrudes and the poly count is quite reasonable…

Make sure you are in Edit using object coords…. on the top toolbar
Fig 1…
Assuming the blue areas are part of the building.
Select the window faces and do a negative extrude to form the window recess

Fig 2…
The window recess.

Fig 3…
To create the window frames and faces for the glass texure.
Select the two window faces you see in Fig 2 and click the Insert Operation.
This gives you two inserted faces.
Scale these up till they look something like Fig 3

Fig 4..
Do a negetive extrude the depth you want the window frame.

Now all you need to do is to apply the alpha glass texture to the windows and the frame texture to the frames.

[img:30eauk0s]http&#58;//img519&#46;imageshack&#46;us/img519/2406/window1wy6&#46;jpg[/img:30eauk0s]

BUT…suppose you want a window with multiple panes as in Fig 1.
It would be a complete waste to build all these faces into the structure of the main building just so you could apply individual textures to the window frames and glass.
This is how I do it…
First create the window recess as in fig 2 of the last post and delete the recessed glass faces.

Make sure you are in Edit using object coords…. on the top toolbar
Fig 2…
1) Use the Create Face plugin to creat a new face and scale it to fit the window recess.
2) Divide to create the number of glass panes you want…here I’ve just gone for 4
3) Use the Insert Operation on each of the divisions

Fig 3….
1) Scale each insert in both the X and Y direction by the same amount, leaving a narrow face around the edge to create the outer frame.
Scale the first insert…make a note of the amount you scaled it by, and do the same to the other inserts.
2) Select all the edges marked with a red arow and scale along the Z axis, to match the width of the outer frame.
3) Select all the edges marked with a yellow arow and scale along the Y axis, again, to match the width of the outer frame.
4) You don’t have to extrude these window frame faces you can get just as good effect with a texture.

Fig 4….
1) Create two small textures something like these…one for the horizontal frames and one for the vertical frames.
Apply these with the brush tool.
2) Load the dirty glass texture as the Primary and Tranclucency map texture.
3) Select all the glass faces and click the Apply material to selection operation.

This method does increase the poly count, takes longer to construct, but the visual appearence is far better than anything you will ever achieve using an alpha channel texture.
Take another look at the pair of doors in the second post.
I used the above method to construct the window panes.

[img:34ahf4h5]http&#58;//img519&#46;imageshack&#46;us/img519/2474/atexture4ob8&#46;jpg[/img:34ahf4h5]

It’s a bit difficult to get some example images of the glass effect.
Here’s two more pics from the murky hotel scene….

The standard window frame method is used on the left hand window.
Note the gas cloud, this is another alpha texture applied to particles.
I use a similar alpha texture for all my loco steam effects.

On the right hand side is a window constructed using the second method.

[img:34ahf4h5]http&#58;//img519&#46;imageshack&#46;us/img519/2711/atexture5yp4&#46;jpg[/img:34ahf4h5]

Alpha textures don’t have to be subtle they can be ‘in your face’ and jump right out of the screen at you.
The jet exhaust from this space ship fighter thingie is a good example.
You can’t get this effect to well in 3DC because you can’t set any blend modes for the textures or materials.
Nore can you set materials to be full bright and to receive no light so you can’t get the glow effect in 3DC
Maybe this could be included in a future 3DC update.

So this image is from Gile and uses one of Psionics free model downloads for the fighter.
[img:27zveerk]http&#58;//www&#46;psionic3d&#46;co&#46;uk/gallery/thumbnails&#46;php?album=2[/img:27zveerk]
<!– m –><a class="postlink" href="http://www.psionic3d.co.uk/gallery/thumbnails.php?album=2">http://www.psionic3d.co.uk/gallery/thum … hp?album=2</a><!– m –>

The texture used to the create the exhaust flames is top left, surrounded by the orange box.
Remember, black is completly transparent.
It was applied to a pair of crossed planes/faces, similar to the trees so they could be viewed from any angle.
These were then scaled/stretched along their Z axis , which also stretched out the texture as well.
The texture flags were set for colour and alpha and the blend mode for the material was set to additive.
In game, these exhaust flames rotate around their Z axis giving quite a nice effect.

I’ll go into blend modes a bit next, you really do need these to get some of the effects.
If you are exporting to a 3D engine you should still be able to apply these textures in 3DC then set the blend mode in your 3D engine.
Or you could do as I do and use an app like Gile
which allows complete control over blend modes for textures and materials.

[img:27zveerk]http&#58;//img519&#46;imageshack&#46;us/img519/7223/atexture6hk4&#46;jpg[/img:27zveerk]

Here’s an in game shot that is packed full of both alpha channel and alpha textures, in fact there are more alpha related textures used here than standard ones.

The cosmos is created using three low poly spheres each scaled larger than the last.
The outer sphere has the nebula gasses applied as an alpha texture.
The middle sphere has a distant starfield texture applied as an alpha texture.
The inner sphere has a starfield texture with larger stars applied as an alpha texture.
So you get quite a good appearence of depth for the cosmos.

The meteorites use yet another alpha texture applied to sprites ( a single face) and coded to always face the camera, they circle the planet slowly and rotate around their own axis.

The bright white light is another small alpha texture applied to a single plane which is scaled up and positioned close the the inner starfield sphere.

The three hostile fighters at the top right of the image use the exhaust alpha texture described in the last post.

The fighter at the bottom left of the image uses an alpha channel textures for all the decals.
These are applied to single planes and pushed up against the fuselage and wings.
This way you can have similar fighters but with different numbers etc.
The engine glow uses the same texture as for the exhausts but applied to a single plane.

[img:269vspt6]http&#58;//img519&#46;imageshack&#46;us/img519/9163/atexture7vo7&#46;jpg[/img:269vspt6]

Blend Modes….
This can be a complicated subject to grasp, simply because of the numerous combinations you can use to get different effects.
The most commonly used blend modes are Alpha, Add and Multiply…there are others but these will do for now.
You’ll find these used in your paint app as well.
At the moment 3DC doesn’t support these modes so your only option is to export the model from 3DC to an app/tool the does…I use Gile but there are others.

These blend modes can be applied to a base texture AND to a material using this texture.
Rather than go into a detailed description for each of these modes I’ll use some images from the transparency demo from the Gile
site, and a text description from the Gile help file.
The text descriptions, I find, are difficult to grasp and the images may give you a better understanding of the effects.

But here goes….

When applied to a base TEXTURE….
Alpha blending….
Blocks the COLOUR form underlying textures, vertices and base material colour.

Multiply….
Is the default blend mode for textures, it DARKENS all underlying textures, veritces and base material colour.

Additive…
Brightens all underlying Colours.

When applied to a MATERIAL…..
Alpha….
This is the default blend mode for materials. With an alpha level of 1 the material is fully opaque (Visible).

Multiply….
This will darken MODELS placed behind a model that uses this blend mode.

Additive…..
This will lighten MODELS placed behind a model that uses this blend mode.

NOW isn’t all that helpful…HeHeHe…about as plain as mud if your mind is anything like mine.
But don’t worry about it for now, just move onto the next post and take a look at the images

It gets worse, as you can combine any of these three texture blend modes, with any of the material blend modes.
Add to that that there are also more than 3 blend modes for the textures, and very soon your mind can be spinning.
But you do need all of these options to cover the different effects.

The following images are from the Gile Transparency demo.

Suppose you want to get a ‘ sunlight coming through a fancy window effect’, casting a reflection of the window onto the floor.
In these images a directional light has been placed behind the ‘ windows’.
This is the base texture….

[img:12mo62pm]http&#58;//img519&#46;imageshack&#46;us/img519/9702/mosaicwindowgp9&#46;jpg[/img:12mo62pm]

With the MATERIAL set to ADDITIVE….
1) The Base Texture is set to Additive and the material colour changed to red 255,0,0
2) The Base Tetxure is set to Multiply and the material colour changed to yellow 255,255,0
3) The Base Tetxure is set to Alpha and the material colour changed to white 255,255,255
Note how the reflection on the floor also changes with each blend mode.

[img:12mo62pm]http&#58;//img519&#46;imageshack&#46;us/img519/4317/atexture8kx6&#46;jpg[/img:12mo62pm]

With the MATERIAL set to ALPHA….
1) The Base Texture is set to Additive and the material colour changed to red 255,0,0
2) The Base Tetxure is set to Multiply and the material colour changed to turquise 0,255,255
3) The Base Tetxure is set to Alpha and the material colour changed to purple 255,0,255
Note how the reflection on the floor also changes with each blend mode.

[img:12mo62pm]http&#58;//img519&#46;imageshack&#46;us/img519/9766/atexture9lw1&#46;jpg[/img:12mo62pm]

With the MATERIAL set to Multilpy….
1) The Base Texture is set to Additive and the material colour changed to red 255,0,0
2) The Base Tetxure is set to Multiply and the material colour changed to turquise 0,255,255
3) The Base Tetxure is set to Alpha and the material colour changed to white 255,255,255
Note how the reflection on the floor also changes with each blend mode.

[img:12mo62pm]http&#58;//img519&#46;imageshack&#46;us/img519/8708/atexture10xe4&#46;jpg[/img:12mo62pm]

Still confused?
Well to be truthfull, so am I most of the time.
Luckily you only usually need to understand two or three of these blend modes and they will cover most of the effects you want.

You must be logged in to reply in this thread.

23 posts