Refracting Textures

[Tutorial]

category
Texture Creation

description
Sexy shader effects.

keywords
refract, refracting, textures, texture, shader, shaders.

The Source engine has a lot of amazing looking shaders, and my personal favourite is the refraction shader. So without further ado, here is a simple tutorial on creating refracting materials in Source.

Create your texture in Photoshop or another paint application. I created this blue glass texture by using the Render Clouds filter and a Glass filter on top. I then used the Offset filter to make it tile properly. Once finished save it into the targa format as bglass.tga.




Create your normal map with the Nvidia normal map tool. Try to bring out the areas that you wish to be more bumped by playing with the colour settings in the plugin. Once complete, save it into the tga format as bglass_normal.tga.



Next step is to create your Du/Dv map. This part is essential to making your texture refract properly. Make sure you use the settings illustrated below in my example screenshot, improper Du/Dv settings can make for an ugly looking texture. Save this file into tga as bglass_dudv.tga



Drag and drop the files onto VTEX and compile them as you would normally. When it comes time to create the VMT, use these settings illustrated below.



Especially important is the REFRACTTINTTEXTURE line, without that, your texture will not show through and you will see only the refraction and normal, no colour. Instead of REFRACTTINTTEXTURE you can use REFRACTTINT and choose a colour to tint the transparent refraction instead if you wish. Also you can add this following code:

Code: Select all

"Proxies"
   {
      "TextureScroll"
      {
         "texturescrollvar" "$bumptransform"
         "texturescrollrate" 3
         "texturescrollangle" -90
      }
   }

after the REFRACTINTTEXTURE line to make your texture scroll, which is useful if you are making a waterfall texture. Once your VMT is ready to go load up Hammer.

In Hammer texture whatever you want with your new material and tie the brush to a func_brush or func_breakable. Under Render Mode set it to Additive. This is optional, some textures look better without changing the Render Mode. Place a cubemap nearby and build your map! Make sure once you are ingame to buildcubemaps or else your texture may look purple or have purple checkers.



This concludes my tutorial on refracting textures, hope you learned something.
-longshanks

[slayera]

Nice tut, much better explained that others I have seen on the same subject.

[Shr3d]

Excellent

[longshanks]

Thanks guys, I'll try and write up some more art tutorials in the future.

[Meotwister]

hey when i do this, i get a weird brown checkered texture in hammer and in game its brown. I've done exactly what you did multiple times. what would cause my condition?

[cfreak]

hey when i do this, i get a weird brown checkered texture in hammer and in game its brown. I've done exactly what you did multiple times. what would cause my condition?

I think you need cubemaps and be running in dlxevel 80+.

[EmptyClip]

I have the same problem as meotwister, but i have built my cubemaps and im running in an appropiate dxlevel, any ideas?

[longshanks]

Can you post a screen?

[Mufloniitti]

My texture is not scrolling!
My vmf:

"refract"
{
"$model" "1"
"$bluramount" "1"
"$surfaceprop" "Water"
"$refractamount" ".100"
"$scale" "[1 1]"
"$normalmap" "vesi_normal"
"$dudvmap" "vesi_dudv"
"$envmap" "env_cubemap"
"$envmaptint" "[.7 .7 .7]"
"$REFRACTTINTTEXTURE" "vesi"



}
"Proxies"
{
"TextureScroll"
{
"texturescrollvar" "$bumptransform"
"texturescrollrate" 3
"texturescrollangle" -90
}
}

Whats wrong?

[ORF!]

Really nice tutorial thx!

[longshanks]

Muflonitti, your braces are messed up. Put proxies inside the main brace like this:

Code: Select all

"refract"
{
"$model" "1"
"$bluramount" "1"
"$surfaceprop" "Water"
"$refractamount" ".100"
"$scale" "[1 1]"
"$normalmap" "vesi_normal"
"$dudvmap" "vesi_dudv"
"$envmap" "env_cubemap"
"$envmaptint" "[.7 .7 .7]"
"$REFRACTTINTTEXTURE" "vesi"

"Proxies"
   {
      "TextureScroll"
      {
         "texturescrollvar" "$bumptransform"
         "texturescrollrate" 3
         "texturescrollangle" -90
      }
   }

}

[Generalvivi]

the vmt is called refract

"refract"
{

"$model" 1
"$bluramount" "1"
"$surfaceprop" "glass"
"refractamount" ".100"
"$scale" "[1 1]"
"$normalmap" "vivi/refract_normal"
"$dudvmap" "vivi/refract_dudv"
"$envmap" "env_cubemap"
"$envmaptint" "[.7 .7 .7]"
"$refracttinttexture" "vivi/refract"
}

[Meotwister]

here's my .vmt
"refract"
{
"$model" 1
"$bluramount" "1"
"$surfaceprop" "glass"
"$refractionAmount" ".100"
"$scale" "[1 1]"
"$normalmap" "BSF/refract-glass_normal"
"$dudvmap" "BSF/refract-glass_dudv"
"$envmap" "env_cubemap"
"$envmaptint" "[.7 .7 .7]"
"$refracttinttexture" "BSF/refract-glass"
"$keywords" "glass"
}

I've tried getting rid of the model(is that necessary?) I compiled it w/ and w/o hdr. And a whole bunch of other things to try to find whats wrong but I don't know.
Here's a try I had changing the refracttinttexture to refracttint [.7 .7 .7]



Oh, and vivi you have a missing '$' on your refractionamount line.

[longshanks]

You guys tied them to func_brushes right?

Can I see your textures? Sometimes its just a small thing that makes all the difference when you work with refracting materials.

If you guys need more help than this you can contact me on msn at
longshanks@age-of-chivalry.com, i'll be glad to help you and check out your textures.

[longshanks]

Sorry for the double post, but after looking over your vmt Meotwister I noticed an error.

You have :

Code: Select all

 "$refractionAmount" ".100"

You want:

Code: Select all

 "$refractamount" ".100"

(if .100 isnt noticable try another scale like .25)