Parallax mapping: Difference between revisions

From Valve Developer Community
Jump to navigation Jump to search
(branched from material tutorial)
 
(Fixed in new beta.)
 
(87 intermediate revisions by 37 users not shown)
Line 1: Line 1:
A parallax map (also know as a displacment or height map) will cause your flat material to look 3D. When you look at a parallax mapped material at an angle, the high points will obscure the low points behind them. This is only worthwhile for textures that have depth ranging at least a few centimeters, like deep-set bricks or stone. If you're not sure about using one, then don't bother.
{{LanguageBar}}


==Adding a parallax map==
[[File:parallax_mapping.jpg|thumb|400px|Example of parallax mapping.]]
{{warning|Parallax maps are disabled in every Valve game, although since {{asbranch|4}} and later, an (unfinished) shader exists named {{code|[[ParallaxTest]]}}, which can be used as an alternative.}}


'''1.''' Imagine your texture in 3D and create a new texture in grayscale where white corresponds to the pixels closest to you and black corresponds to pixels farthest from you. Save this as a TGA with _height at the end of the name and convert it to a VTF. Put it in the same directory as your texture.
'''Parallax mapping''' (also known as '''offset mapping''' or '''virtual displacement mapping''') is a shading technique that displaces the individual pixel height of a surface so that when you look at it at an angle, the high points will obscure the low points behind them, making it look three-dimensional. The height data for each pixel comes from a {{code|[[$parallaxmap]]}} texture, which needs to be created for each parallax mapped material.


'''2.''' Add these two lines to your VMF:
Parallax mapping is an enhancement of the [[bump mapping]] technique. It is only worthwhile for textures that have a depth of at least a few centimeters, like deep-set bricks or stone.


<code>"$parallaxmap" "''texture name''"</code><br/>
==Creating a parallax mapped material==
<code>"$parallaxmapscale" ''<scale value>''</code>


Fill in the path and name of your parallax map on the first line and a number between zero and one on the second line. This number affects how deep the texture will look. 0.05 is an appropriate value for bricks.
===Creating a heightmap===


If the bricks in the example brick wall texture were really thick and stuck out from the plaster, a parallax map might be appropriate. We would create a VTF as described above named brickwall_height.vtf and place it with the other texture files. The VMT would now look like this:
Regardless of the way you are going to render them, creating parallax mapped materials always starts with [[heightmap|creating a heightmap]].
<pre><nowiki>"LightmappedGeneric"
 
===Adding a parallax map with the built-in support for parallax maps===
{{warning|No official version of {{src|4.1}} has proper support for parallax mapping as it was removed during {{hl2|4.1}}'s development for unknown reasons (probably performance as hardware at the time are not powerful enough). Consider implementing other shaders listed on this page, if you want parallax mapping in your source engine project!}}
 
Add these two lines to your [[VMT|Valve Material (.vmt)]] file:
 
{{code|[[$parallaxmap]]}} <nowiki><texture></nowiki>
 
{{code|[[$parallaxmapscale]]}} <nowiki><float></nowiki>
 
 
Fill in the path and name of your heightmap on the first line, and a number between 0 and 1 on the second line. This number affects how deep the texture will look. <code>0.05</code> is an appropriate value for bricks.
 
 
Example VMT:
 
{{CodeBlock|<nowiki>"LightmappedGeneric"
{
{
     "$basetexture" "walls/brickwall"
     "$basetexture" "walls/brickwall"
     "$surfaceprop" "brick"
     "$surfaceprop" "brick"
     "$bumpmap" " walls/brickwall_normal"
     "$bumpmap" "walls/brickwall_normal"
     "$parallaxmap" "walls/brickwall_height"
     "$parallaxmap" "walls/brickwall_height"
     "$parallaxmapscale" 0.05
     "$parallaxmapscale" 0.05
    "$envmap" "env_cubemap"
}</nowiki>}}
    "$envmaptint" "[.5 .5 .5]"
    "$normalmapalphaenvmapmask" 1
}</nowiki></pre>


==See also==
===Adding a parallax map with the Parallax Occlusion Shader mod===
{{obsolete|type=shader}}
{{note|This mod is obsolete, it only works with the {{src06|4}} engine branch and does not work properly with [[HDR]]. There is [http://www.hl2world.com/bbs/1-vt46068.html a reincarnation of the Parallax Occlusion Shader mod] by the same author but that only works with models. A brush version is in the works. In the meantime, Parallax Occlusion Shader still works with HDR off.}}
 
First, in the [[VMT|Valve Material (.vmt)]] file, after the line
 
<code>"LightmappedGeneric"</code>
 
add this line:
 
<code>//"MN_PrlxLightmappedGeneric"</code>
 
When playing a map with your parallax mapped material, comment out the first line. When compiling a map with your parallax mapped material in Hammer, comment out the last line. This (according to the author of the mod) is a workaround to a glitch in Source SDK.
 
Finally, add this line to your [[VMT]] file:
 
<code>"$heightmap" "''texture name''"</code>
 
Other parameters you may need:
 
<code>"$heightscale"</code>, defines the "depth" of the effect, takes values 0.0&mdash;1.0, default=0.4<br/>
<code>"$heightmapsample"</code>, default=16<br />
 
Example VMT:
 
{{CodeBlock|<nowiki>"MN_PrlxLightmappedGeneric"
{
    "$basetexture" "walls/brickwall"
    "$surfaceprop" "brick"
    "$bumpmap" "walls/brickwall_normal"
    "$heightmap" "walls/brickwall_height"
}</nowiki>}}
 
===Adding parallax map with the PBR shader===
[[File:Thexa4 pbr parallax 1.png|thumb|300px|right|Parallax enabled.]]
Games running on {{strata|4}} or with Thexa4's PBR shader installed can use parallax mapping already. All '''Strata Source''' games use a similar method.
{{note| Follow the tutorial [[Adding PBR_to_Your_Mod|Adding PBR to Your Mod]] to implement the shader into your source sdk project. This shader is compatible with [[HDR]] and with {{src13|4}}.}}
{{warning|An [[$mraotexture]] is needed to use the PBR features.}}
[[File:Thexa4 pbr parallax 0.png|300px|thumb|right|Parallax Disabled.]]
To make the effect work you will need to have these 3 parameters in your [[VMT]]:
 
{{code|[[$parallax]]}} <nowiki><bool></nowiki> - Enables/Disables parallax mapping.
 
{{code|[[$parallaxdepth]]}} <nowiki><float></nowiki> - Controls the intensity of the parallax effect.
 
{{code|[[$parallaxcenter]]}} <nowiki><float></nowiki> - Center depth of the Parallax Map.
 
To make the parallax mapping work you will need to put your [[Heightmap]] into the [[Bump map]]'s alpha channel. See [[Creating PBR materials#Embedding the Heightmap|Creating PBR materials]] for a tutorial on how to do this.
 
Example VMT:
 
{{CodeBlock|<nowiki>"PBR"
{
"$basetexture"      "pbr/rock_color"
"$bumpmap"          "pbr/rock_bump"  //important you need to put your heightmap into the bumpmaps alpha channel
"$mraotexture"      "pbr/rock_mrao"
 
"$envmap"          "env_cubemap"
"$surfaceprop"      "Default"
"$model"            "0" //not needed for Strata games
 
"$parallax" "1"
"$parallaxdepth" "0.10" //controls the intensity of the heightmap. Higher values = more depth
    "$parallaxcenter" "0.65" //controls the height of the highest point on your heightmap. Higher values = Closer to the applied face. Make sure this is adjusted so the highest point is flush with the floor/wall!
}
</nowiki>}}
 
===Parallax occlusion mapping in {{bms|4}}===
'''Black Mesa''' has its own way of rendering parallax mapping, which was not used in the original campaign, but was used in {{bmsbs|4}} for brick walls and the likes. This material shader parameter can be used for {{code|[[LightmappedGeneric]]}} and {{code|[[VertexLitGeneric]]}}. Also works with {{code|[[Lightmapped_4WayBlend]]}}, useless however.
{{warning|Parallax occlusion mapping is an expensive pixel shader, meaning it has higher performance costs based on its sample count and occupying screen percentage, and should thus be used smartly.}}
{{bug|hidetested=1|Parallax occlusion mapping  UVs aren't sent to the [[gbuffer]]. This means that [[newlight_point|dynamic lighting]] will "fly" on a surface with POM.}}
 
 
To make the effect work you will need to have these 3 parameters in your [[VMT]]:
 
{{code|$pomscale}} <nowiki><float></nowiki> - Scale of parallax mapping.
<div style=overflow:auto>
{{expand|title=Examples|1=
<br>
<gallery mode=packed heights=310px>
File:PS1_weapon_headcrab.png |$pomscale 0.02, $pomminsamples 0, $pommaxsamples 300
File:PS2_weapon_headcrab.png |$pomscale 0.07, $pomminsamples 0, $pommaxsamples 300
</gallery>
}}</div>
{{code|$pomminsamples}} <nowiki><float></nowiki> - Min amount of depth samples. The minimum is used at steep glancing angles and far distances. Less samples means more performance, but also worse quality.
{{Note|Higher values have less height stepping far away, but an increased performance cost. Reasonable values are around 0.}}
<div style=overflow:auto>
{{expand|title=Examples|
<br>
<gallery mode=packed heights=310px>
File:PMin1_weapon_headcrab.png.png |$pomscale 0.09, $pomminsamples 0, $pommaxsamples 300
File:PMin2_weapon_headcrab.png.png |$pomscale 0.09, $pomminsamples 294, $pommaxsamples 300
</gallery>
}}</div>
 
{{code|$pommaxsamples}} <nowiki><float></nowiki> - Max amount of depth samples. The maximum is used at shallow glancing angles and close distances.
{{Note|Higher values have less height stepping upclose, but an increased performance cost. Reasonable values are < 100}}
<div style=overflow:auto>
{{expand|title=Examples|
<br>
<gallery mode=packed heights=310px>
File:PMax1_weapon_headcrab_.png |$pomscale 0.10, $pomminsamples 0, $pommaxsamples 10
File:PMax2_weapon_headcrab_.png |$pomscale 0.10, $pomminsamples 0, $pommaxsamples 500
</gallery>
}}</div>
 
To make the parallax mapping work you'll need [[Heightmap]]. This is not embedded in the Bumpmap, but is instead kept separate in it's own [[VTF]] image.


[[Creating Materials]]
Example VMT:


[[Creating Normal Maps]]
{{CodeBlock|<nowiki>"LightmappedGeneric"
{
"$basetexture"      "Tile/tilefloor001b"
"$heightmap"      "Tile/tilefloor001b_h"
"$pomscale" "0.07"    //controls scale of parallax mapping
"$pomminsamples" "0"  //controls min depth of parallax mapping.
"$pommaxsamples" "100" //controls max depth of parallax mapping.
}
</nowiki>}}
 
==See also==
* [[Adding PBR_to_Your_Mod|Adding PBR to Your Mod]]
* [[Creating PBR materials]]
* [[Material Creation]]
* [[$parallax]]
* [[Normal Map Creation]]
* [[Wikipedia:Parallax mapping]]


[[Creating a Material Tutorial]]
==External links==
* [http://www.fpsbanana.com/tools/4343 Parallax Occlusion Shader mod Download]
[[Category:Material System]]

Latest revision as of 03:18, 16 June 2025

English (en)Translate (Translate)
Example of parallax mapping.
Warning.pngWarning:Parallax maps are disabled in every Valve game, although since Alien Swarm engine branch Alien Swarm engine branch and later, an (unfinished) shader exists named ParallaxTest, which can be used as an alternative.

Parallax mapping (also known as offset mapping or virtual displacement mapping) is a shading technique that displaces the individual pixel height of a surface so that when you look at it at an angle, the high points will obscure the low points behind them, making it look three-dimensional. The height data for each pixel comes from a $parallaxmap texture, which needs to be created for each parallax mapped material.

Parallax mapping is an enhancement of the bump mapping technique. It is only worthwhile for textures that have a depth of at least a few centimeters, like deep-set bricks or stone.

Creating a parallax mapped material

Creating a heightmap

Regardless of the way you are going to render them, creating parallax mapped materials always starts with creating a heightmap.

Adding a parallax map with the built-in support for parallax maps

Warning.pngWarning:No official version of Source Source has proper support for parallax mapping as it was removed during Half-Life 2 Half-Life 2's development for unknown reasons (probably performance as hardware at the time are not powerful enough). Consider implementing other shaders listed on this page, if you want parallax mapping in your source engine project!

Add these two lines to your Valve Material (.vmt) file:

$parallaxmap <texture>

$parallaxmapscale <float>


Fill in the path and name of your heightmap on the first line, and a number between 0 and 1 on the second line. This number affects how deep the texture will look. 0.05 is an appropriate value for bricks.


Example VMT:

"LightmappedGeneric" { "$basetexture" "walls/brickwall" "$surfaceprop" "brick" "$bumpmap" "walls/brickwall_normal" "$parallaxmap" "walls/brickwall_height" "$parallaxmapscale" 0.05 }

Adding a parallax map with the Parallax Occlusion Shader mod

Obsolete-notext.png
This shader is obsolete. Its use is discouraged. It may only exist/function in older engine branches.
Note.pngNote:This mod is obsolete, it only works with the Source 2006 Source 2006 engine branch and does not work properly with HDR. There is a reincarnation of the Parallax Occlusion Shader mod by the same author but that only works with models. A brush version is in the works. In the meantime, Parallax Occlusion Shader still works with HDR off.

First, in the Valve Material (.vmt) file, after the line

"LightmappedGeneric"

add this line:

//"MN_PrlxLightmappedGeneric"

When playing a map with your parallax mapped material, comment out the first line. When compiling a map with your parallax mapped material in Hammer, comment out the last line. This (according to the author of the mod) is a workaround to a glitch in Source SDK.

Finally, add this line to your VMT file:

"$heightmap" "texture name"

Other parameters you may need:

"$heightscale", defines the "depth" of the effect, takes values 0.0—1.0, default=0.4
"$heightmapsample", default=16

Example VMT:

"MN_PrlxLightmappedGeneric" { "$basetexture" "walls/brickwall" "$surfaceprop" "brick" "$bumpmap" "walls/brickwall_normal" "$heightmap" "walls/brickwall_height" }

Adding parallax map with the PBR shader

Parallax enabled.

Games running on Strata Source Strata Source or with Thexa4's PBR shader installed can use parallax mapping already. All Strata Source games use a similar method.

Note.pngNote: Follow the tutorial Adding PBR to Your Mod to implement the shader into your source sdk project. This shader is compatible with HDR and with Source 2013 Source 2013.
Warning.pngWarning:An $mraotexture is needed to use the PBR features.
Parallax Disabled.

To make the effect work you will need to have these 3 parameters in your VMT:

$parallax <bool> - Enables/Disables parallax mapping.

$parallaxdepth <float> - Controls the intensity of the parallax effect.

$parallaxcenter <float> - Center depth of the Parallax Map.

To make the parallax mapping work you will need to put your Heightmap into the Bump map's alpha channel. See Creating PBR materials for a tutorial on how to do this.

Example VMT:

"PBR" { "$basetexture" "pbr/rock_color" "$bumpmap" "pbr/rock_bump" //important you need to put your heightmap into the bumpmaps alpha channel "$mraotexture" "pbr/rock_mrao" "$envmap" "env_cubemap" "$surfaceprop" "Default" "$model" "0" //not needed for Strata games "$parallax" "1" "$parallaxdepth" "0.10" //controls the intensity of the heightmap. Higher values = more depth "$parallaxcenter" "0.65" //controls the height of the highest point on your heightmap. Higher values = Closer to the applied face. Make sure this is adjusted so the highest point is flush with the floor/wall! }

Parallax occlusion mapping in Black Mesa Black Mesa

Black Mesa has its own way of rendering parallax mapping, which was not used in the original campaign, but was used in Black Mesa: Blue Shift Black Mesa: Blue Shift for brick walls and the likes. This material shader parameter can be used for LightmappedGeneric and VertexLitGeneric. Also works with Lightmapped_4WayBlend, useless however.

Warning.pngWarning:Parallax occlusion mapping is an expensive pixel shader, meaning it has higher performance costs based on its sample count and occupying screen percentage, and should thus be used smartly.
Icon-Bug.pngBug:Parallax occlusion mapping UVs aren't sent to the gbuffer. This means that dynamic lighting will "fly" on a surface with POM.


To make the effect work you will need to have these 3 parameters in your VMT:

$pomscale <float> - Scale of parallax mapping.

Examples

$pomminsamples <float> - Min amount of depth samples. The minimum is used at steep glancing angles and far distances. Less samples means more performance, but also worse quality.

Note.pngNote:Higher values have less height stepping far away, but an increased performance cost. Reasonable values are around 0.
Examples


$pommaxsamples <float> - Max amount of depth samples. The maximum is used at shallow glancing angles and close distances.

Note.pngNote:Higher values have less height stepping upclose, but an increased performance cost. Reasonable values are < 100
Examples


To make the parallax mapping work you'll need Heightmap. This is not embedded in the Bumpmap, but is instead kept separate in it's own VTF image.

Example VMT:

"LightmappedGeneric" { "$basetexture" "Tile/tilefloor001b" "$heightmap" "Tile/tilefloor001b_h" "$pomscale" "0.07" //controls scale of parallax mapping "$pomminsamples" "0" //controls min depth of parallax mapping. "$pommaxsamples" "100" //controls max depth of parallax mapping. }

See also

External links