ef2-ubertools-gdk/Documentation/content/ldesign_terrain.html
2003-08-18 00:00:00 +00:00

432 lines
22 KiB
HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ÜberTools Game Development Kit</title>
<link rel="stylesheet" href="style.css">
<script type="text/javascript">
/***********************************************
* Switch Menu script- by Martial B of http://getElementById.com/
* Modified by Dynamic Drive for format & NS4/IE4 compatibility
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
if (document.getElementById){ //DynamicDrive.com change
document.write('<style type="text/css">\n')
document.write('.submenu{display: none;}\n')
document.write('</style>\n')
}
function SwitchMenu(obj){
if(document.getElementById){
var el = document.getElementById(obj);
var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change
if(el.style.display != "block"){ //DynamicDrive.com change
for (var i=0; i<ar.length; i++){
if (ar[i].className=="submenu") //DynamicDrive.com change
ar[i].style.display = "none";
}
el.style.display = "block";
}else{
el.style.display = "none";
}
}
}
</script>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<a name="top"></a>
<table width="702" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td colspan="3"><img src="../images/header.jpg" width="702" height="101" border="0"></td>
</tr>
<tr>
<td width=158 valign="top"><table border="0" cellspacing="0" cellpadding="0">
<tr>
<td valign="top" class="menu">
<!-- Keep all menus within masterdiv-->
<div id="masterdiv">
<img src="../images/navigation.jpg" width="158" height="27"><br>
UberTools GDK
<div class="menutitle" onclick="SwitchMenu('sub0')">&raquo; Introduction &amp; Contents</div>
<span class="submenu" id="sub0">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="../start.html">Introduction</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="../start.html#2">Utilities</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="../start.html#3">Source Files</a><br>
</span>
<br>Level Design<br>
<div class="menutitle" onclick="SwitchMenu('sub1')">&raquo; Setting Up UberRadiant</div>
<span class="submenu" id="sub1">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html">That Scary Error Msg</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html#2">General Tab</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html#3">Display Tab</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html#4">User Interface Tab</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html#5">Keyboard Shortcuts Tab</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html#6">Colors Tab</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_setup.html#7">Game / Paths Tab</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub2')">&raquo; Building Your First Room</div>
<span class="submenu" id="sub2">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html">Editor Interface Basics</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html#2">Choosing Your Textures</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html#3">Building The Room</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html#4">Adding a Light</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html#5">Adding a Player Start</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html#6">Compiling Your Level</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_firstroom.html#7">Viewing the Level</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub3')">&raquo; Constructing Terrain</div>
<span class="submenu" id="sub3">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_terrain.html">Setting up the Tools</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_terrain.html#2">Creating Terrain</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_terrain.html#3">Modifying the Textures</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="radiant_terrain.html#4">Adding More Terrain</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub4')">&raquo; Additional Reference</div>
<span class="submenu" id="sub4">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="ldesign_lighting.html">Lighting System</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="ldesign_terrain.html">Terrain Texture Blending</a><br>
</span>
<br>Scripting<br>
<div class="menutitle" onclick="SwitchMenu('sub5')">&raquo; Scripting Tutorials</div>
<span class="submenu" id="sub5">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_syntax.html">Scripting Syntax</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_waves.html">Spawning Waves</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_flying.html">Creating Flying Creatures</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_tripwires.html">Setting Up Tripwires</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub6')">&raquo; Global Script Synopsis</div>
<span class="submenu" id="sub6">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts.html">Introduction</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_accelmove.html">global_accelerated</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_accelmove.html">Movement.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_archetype.html">global_archetype.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_array.html">global_array.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_cinefx.html">global_cinematicFX.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_common.html">global_common.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_debug.html">global_debugUtils.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_flyin.html">global_flyin.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_math.html">global_math.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_ploadout.html">global_playerLoadout.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_soundpan.html">global_soundPan.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_spawnwave.html">global_spawnWave.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_transport.html">global_Transport.scr</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="scripting_globalscripts_tripwire.html">global_tripwire.scr</a><br>
</span>
<div class="menutitle" onclick="SwitchMenu('sub7')">&raquo; Classes Reference</div>
<span class="submenu" id="sub7">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="allclasses_g.html">Game Module</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="allclasses_cl.html">Client Module</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="allclasses_cg.html">Client Game Module</a><br>
</span>
<br>Older Documentation<br>
<div class="menutitle" onclick="SwitchMenu('sub8')">&raquo; Heavy Metal FAKK2</div>
<span class="submenu" id="sub8">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_camera.html">Camera Documentation</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_clientsidecmds.html">Client Side Commands</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_gui.html">GUI Documentation</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_ingameutils.html">In-Game Utilities</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_max2skl.html">MAX2SKL Reference</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_shadermanual.html">Shader Manual</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_soundsystem.html">Sound System</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="fakk2_tiki.html">TIKI Model System</a><br>
</span>
<br>Other<br>
<div class="menutitle" onclick="SwitchMenu('sub9')">&raquo; Web Links &amp; Credits</div>
<span class="submenu" id="sub9">
&nbsp;&nbsp;&nbsp;&nbsp;<a href="other_links.html">Web Links</a><br>
&nbsp;&nbsp;&nbsp;&nbsp;<a href="other_credits.html">Credits</a><br>
</span>
</div>
</td>
</tr>
</table></td>
<td width="13" background="../images/vert_line.jpg"><img src="../images/vert_line.jpg" width="13" height="1"></td>
<td valign="top" width="533"><p class="header"><br>
Terrain Texture Blending System Overview</p>
<p> Here is the system for creating, categorizing, and naming the terrain
blend preset images. It's designed to give a useful and uniform core set
of presets, allow for expandability without creating disorganized chaos.
</p>
<p class="subheader">Terrain Shaders</p>
<p> The terrain system is expanded to include alpha blending between two
textures. The includes the ability to control the alpha blend in real
time in Radiant. First you need to build special two stage alpha blend
shaders like the one displayed below.</p>
<blockquote>
<p class="menu"> //<br>
// Sample shader to demonstrate alpha blending between<br>
// two textures on a terrain brush.<br>
//<br>
textures/set_weathertop/rock_grass <br>
{<br>
&nbsp;&nbsp;&nbsp;&nbsp;// Make sure no light map is created for the
terrain brush.<br>
&nbsp;&nbsp;&nbsp;&nbsp;surfaceparm nolightmap<br>
&nbsp;&nbsp;&nbsp;&nbsp;// Both texture names must appear in the qer_editorimage
statement<br>
&nbsp;&nbsp;&nbsp;&nbsp;qer_editorimage textures/set_weathertop/terrrain-rocky-scrub.tga
textures/set_weathertop/gra_fl_pgrro.tga<br>
&nbsp;&nbsp;&nbsp;&nbsp;{<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// First stage renders
the first texture with vertex lighting<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;map textures/set_weathertop/terrrain-rocky-scrub.tga<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;rgbGen vertex<br>
&nbsp;&nbsp;&nbsp;&nbsp;} <br>
&nbsp;&nbsp;&nbsp;&nbsp;{<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// Second stage renders
the second texture with vertex lighting<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;// and the alpha blend
created in Radiant.<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;map textures/set_weathertop/gra_fl_pgrro.tga<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;rgbGen vertex<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;alphaGen vertex<br>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;blendFunc GL_SRC_ALPHA
GL_ONE_MINUS_SRC_ALPHA<br>
&nbsp;&nbsp;&nbsp;&nbsp;}<br>
}</p>
</blockquote>
<p> The surfaceparam nolightmap statement tells q3map not to calculate a
light map for the terrain brush. The qer_editorimage statement with two
texture names tells Radiant to display the both textures as a single shader
in the texture window. This second texture name is an optional parameter.
</p>
<p>The first texture in the qer_editorimage statement appears on the left
in the Radiant texture window and the second texture appears on the right
in the Radiant texture window. In addition, the first texture in the qer_editorimage
statment must be the first stage texture and the second texture in the
qer_editorimage statment must be the second stage texture. </p>
<p>The first stage of the shader renders the first texture with verterx
lighting and the second stage renders the second texture on top of the
first using the alpha blend data created in Radiant. The second stage
also applies vertex lighting to the second texture.</p>
<p class="subheader">Radiant Usage</p>
<p> Once a two stage alpha blend shader has been created, the alpha blend
on a terrain brush is editable in real time.</p>
<ol>
<li> Select a terrain brush in either the XY-window or the 3D-window with
Shift-LeftMouseButton.</li>
<li> Select a two pass blend shader in the texture window. Only the texture
displayed on the left in the texture window will be visible on the terrain
brush.</li>
<li> Press the F key and Radiant will switch to terrain alpha blend mode.
</li>
<li> Select a vertex with the left mouse button and drag the vertex upwards.
The vertex will not move but the texture will start to blend to the
one displayed on the right in the texture window. </li>
<li> Drag downwards to blend back to the texture displayed on the left
in the texture window.</li>
</ol>
<p> Preset blends may also be applied to terrain brushes. </p>
<ol>
<li> Load the textures in the blends directory.</li>
<li> Select a terrain brush in either the XY-window or the 3D-window.
(The terrain brush must have a two stage alpha blend shader on it.)</li>
<li> Select a blend texture in the texture window. The blend will now
be applied accross the terrain brush.</li>
<li> The blend can be selectively modified using the first alpha blend
mode described above.</li>
</ol>
<p class="subheader">Blend Preset Image Specifications</p>
<ul type="square">
<li> Blends
<ul type="square">
<li> Type_Method-Modifier
<ul type="square">
<li> Lin = Linear Ramp between A and B </li>
<li> Nos = Noisy transition between A and B </li>
<li> Wgt = Weighted transition between A and B
<ul type="square">
<li> Weighted means the blend falloff is weighted towards
the white or black end of the luminosity ramp.
<ul type="square">
<li> i.e.: <font color="#0000CC">Circ</font>_<font color="#009900">Wgt</font>-<font color="#990000">25</font>
.tga= <font color="#0000CC">Circular Blend</font>, <font color="#009900">Weighted</font>
at <font color="990000">25%</font> more White than Black
versus a linear ramp. </li>
</ul>
</li>
</ul>
</li>
<li> Wvy = Wavy transition between A and B </li>
</ul>
</li>
</ul>
</li>
</ul>
<p> The shader name for blend presets must be blends/presetimagefilename
(the shader name following &quot;blends/&quot; must be identical to the
Targa image's filename so Radiant can find the image from the shader's
name.</p>
<ul type="square">
<li> The shader name for the above example image should be blends/Circ_Wgt-25
</li>
</ul>
<p> Here are the basic blend types and methods:</p>
<ul type="square">
<li><b> Horizontal Gradient </b>
<ul>
<li> Horiz_Lin </li>
<li> Horiz_Nos </li>
<li> Horiz_Wgt </li>
<li> Horiz_Wvy </li>
</ul>
</li>
<li> <b>Vertical</b>
<ul>
<li> Vert_Lin </li>
<li> Vert_Nos </li>
<li> Vert_Wgt </li>
<li> Vert_Wvy </li>
</ul>
</li>
<li><b> Diagonal Upper Left to Lower Right </b>
<ul>
<li> DiagLR_Lin </li>
<li> DiagLR_Nos </li>
<li> DiagLR_Wgt </li>
</ul>
</li>
<li> <b>Diagonal Upper Right to Lower Left </b>
<ul>
<li> DiagRL_Lin </li>
<li> DiagRL_Nos </li>
<li> DiagRL_Wgt </li>
</ul>
</li>
<li> <b>Circular</b>
<ul>
<li> Circ_Lin </li>
<li> Circ_Nos </li>
<li> Circ_Wgt </li>
</ul>
</li>
<li> <b>Corners</b>
<ul>
<li> Crns_Lin </li>
<li> Crns_Nos </li>
<li> Crns_Wgt </li>
</ul>
</li>
<li> <b>Diamond</b>
<ul>
<li> Dmd_Lin </li>
<li> Dmd_Nos </li>
<li> Dmd_Wgt </li>
</ul>
</li>
<li><b> Bulge Upwards </b>
<ul>
<li> BlgUp_Lin </li>
<li> BlgUp_Nos </li>
<li> BlgUp_Wgt </li>
</ul>
</li>
<li><b> Bulge Downwards </b>
<ul>
<li> BlgDn_Lin </li>
<li> BlgDn_Nos </li>
<li> BlgDn_Wgt </li>
</ul>
</li>
<li> <b>Bulge Left </b>
<ul>
<li> BlgLt_Lin </li>
<li> BlgLt_Nos </li>
<li> BlgLt_Wgt </li>
</ul>
</li>
<li> <b>Bulge Right </b>
<ul>
<li> BlgRt_Lin </li>
<li> BlgRt_Nos </li>
<li> BlgRt_Wgt </li>
</ul>
</li>
<li><b> Irregular </b>
<ul>
<li> Irreg_Nos </li>
<li> Irreg_Spots </li>
<li> Irreg_?other? </li>
</ul>
</li>
</ul>
<p> Blend Preset shaders are completely separate from the Terrain shaders.
Every blend preset is a shader that blends between with 2 base images
referenced in a separate terrain shader entry. The first is the &quot;A&quot;
texture and the second is the &quot;B&quot; texture. The blend is from
&quot;A&quot; to &quot;B&quot; when in normal mode, and from &quot;B&quot;
to &quot;A&quot; when Inverse Blend is activated. </p>
<p>The actual blend texture must be a 9x9 24-bit targa file. Even though
depicted as a hue neutral (grayscale) image, the blend must be in the
red, green, and blue channels. Each blend preset shader must also have
a QEReditorimage that represents the blend. While terrain blend preset
images are 9x9 pixels, corresponding with the verts of a terrain tile,
this is too small to see in the editor and so QEReditorimages for blend
preset shaders need to be 64x64 so it is viewable in Radiant without changing
any settings.</p>
<p> The procedure to make a QEReditorimage for blend presets in PhotoShop
is:</p>
<ol>
<li> Create a new image of 64x64.<br>
<br>
</li>
<li> Make a pure red layer and a pure blue layer. Red represents image
&quot;A&quot; and blue represents &quot;B&quot;, so the red layer should
be above the blue layer in order.<br>
<br>
</li>
<li> Resize your grayscale blend image image to 64x64 using the nearest
neighbor interpolation method. <br>
<br>
</li>
<li> Copy the blend image to the clipboard. <br>
<br>
</li>
<li> Add a Layer Mask to the red layer (Reveal All mode if using PS6).
<br>
<br>
</li>
<li> Select the Layer Mask thumbnail on the Layers palette, and then select
the Channels tab. <br>
<br>
</li>
<li> Activate the visibility icon for the Mask channel and select the
Mask Channel.<br>
<br>
</li>
<li> Paste the blend image into the Mask Channel.<br>
<br>
</li>
<li> Save the file as a Targa in the QER folder using the naming convention
qer_blendimagename.tga.<br>
<br>
</li>
<li> Set up the blend preset shader, pointing to this QEREditorImage.</li>
</ol>
<p>&nbsp;</p></td>
</tr>
<tr>
<td colspan="3"><img src="../images/footer.jpg" width="702" height="36" border="0" usemap="#Map"><br>
<img src="../images/hor_line.jpg" width="702" height="1"></td>
</tr>
<tr>
<td colspan="3" class="legal"><table width="100%" border="0" cellspacing="0" cellpadding="4">
<tr>
<td class="legal"> Copyright &copy;2003 Ritual Entertainment, Inc. All rights reserved.<br>
Please do not email Ritual Entertainment with questions about the
UberTools Game Development Kit. It is provided as is and is not supported by Ritual Entertainment.</td>
<td><a href="http://www.ritual.com/tech/overview.html" target="_blank"><img src="../images/uber_logo.jpg" width="43" height="56" hspace="4" border="0"></a></td>
<td><a href="http://www.ritual.com" target="_blank"><img src="../images/ritual_logo.jpg" width="100" height="56" hspace="4" border="0"></a></td>
</tr>
</table>
<p align="center">&nbsp;</p></td>
</tr>
</table>
<map name="Map">
<area shape="rect" coords="601,10,693,28" href="#top">
</map>
</body>
</html>