Frictional Game Wiki

<h1>Translucent Material</h1> <div class="level1"> </div> <h2>Overview</h2> <div class="level2"> <p> Here it will be explained how to set up an entity with a translucent material. There is a lot of differetn techniques and programs that can be used to make the images used in this tutorial, so the focus will be mainly on using the engine's tools. </p> </div> <h2>Steps</h2> <div class="level2"> <p> <b>1) Setting up the model.</b><br/> First of all the model needs to be be set up and have a diffuse texture set to it (more info <a href="/doku.php?id=hpl3:engine:model_export#modelling" class="wikilink1" title="hpl3:engine:model_export">here</a>). The file we have are:<br/> <code>transbox.dae</code><br/> <code>transbox.dds</code><br/> Now we open transbox.dae up in the modelviewer and will see:<br/> <a href="/lib/exe/fetch.php?media=hpl3:tutorials:material_trans01.jpg" class="media" title="hpl3:tutorials:material_trans01.jpg"><img src="/lib/exe/fetch.php?w=300&tok=3e45ae&media=hpl3:tutorials:material_trans01.jpg" class="media" alt="" width="300" /></a><br/> The files we have are now: <code>transbox.dae</code><br/> <code>transbox.dds</code><br/> <code>transbox.mat</code><br/> <code>transbox.msh</code><br/> the ".mat"-file is generated by the modelviewer and is a solid material based upon the name of the diffuse texture (here "transbox"). Modelviewer can add further texture such as normalmaps, specular, etc if the files have the proper prefixes (for a list of those see <a href="/doku.php?id=hpl3:engine:materials#solid_diffuse" class="wikilink1" title="hpl3:engine:materials">here</a>).<br/> The "msh"-file is a binary version of the dae file that is much faster to load. No need to worry about that one in this tutorial. </p> <p> <b>2) Changing to Translucent.</b><br/> Now open up MaterialEditor (leave modelviewer open) and open "transbox.mat". Here change the type to "translucent" and the blend mode to "mul" (you can use other blend modes, but mul is often the best when dealing with translucent surfaces).<br/> <a href="/lib/exe/fetch.php?media=hpl3:tutorials:material_trans02.jpg" class="media" title="hpl3:tutorials:material_trans02.jpg"><img src="/lib/exe/fetch.php?w=300&tok=0180d5&media=hpl3:tutorials:material_trans02.jpg" class="media" alt="" width="300" /></a><br/> Chose "Save" in the file menu.<br/> You can now simply task switch to the modelviewer (no need to close and open) and the changes will appear).<br/> <a href="/lib/exe/fetch.php?media=hpl3:tutorials:material_trans03.jpg" class="media" title="hpl3:tutorials:material_trans03.jpg"><img src="/lib/exe/fetch.php?w=300&tok=5632bb&media=hpl3:tutorials:material_trans03.jpg" class="media" alt="" width="300" /></a><br/> </p> <p> <b>3) Adding Reflection</b><br/> The material looks a bit more translucent, but there is still a lot more that can be done. The next thing is to add a cubemap that will form an environment map for the material.<br/> </p> <p> First of all a cubemap needs to be created and converted to the dds format. This is best done using ATI's CubeMapGen (found <a href="http://developer.amd.com/archive/gpu/cubemapgen/pages/default.aspx" class="urlextern" title="http://developer.amd.com/archive/gpu/cubemapgen/pages/default.aspx" rel="nofollow">here</a>) or a similar tool. When creating the normal, just use some environment that looks sort of like what the object can be found in and blur it a lot (as long as it looks good in the modelviewer, it does not matter that much). When generating the cubemap it is very, very important to use a an edge fix, and to use an generator that can do this for mipmaps, or else there will be ugly visible lines in the seams between the six faces. Also make sure that the dds file contains mipmaps!<br/> Cubemaps are placed in "textures\environment" and NOT in the same folder as the dae, mat, etc files! This because one cubemap can be used for many different materials. Name the environment map like this: [environment]_env, eg: "livingroom_env.dds"<br/> </p> <p> Now in the MaterialEditor, check the CubeMap checkbox and then select the cubemap you have created. You will now see that box has gotten a reflection:<br/> <a href="/lib/exe/fetch.php?media=hpl3:tutorials:material_trans04.jpg" class="media" title="hpl3:tutorials:material_trans04.jpg"><img src="/lib/exe/fetch.php?w=300&tok=94934c&media=hpl3:tutorials:material_trans04.jpg" class="media" alt="" width="300" /></a><br/> You can now play around the the frensel properties to change how the reflection changes depedning on the slope of the surfaces. The default values are pretty good in most cases though.<br/> More importantly, if you have a rounded objects (unlike this cube) try changing the two RimLight parameters to get a nice glow around the edges that enchances the shape of the objects.<br/> Finally the AffectedByLightLevel parameter should be checked if you know that the object will be in an environment where the general light level change a lot. What it does is to make the opacity of the model depedning on the average light the model is in and makes it not seem glowing when in darkness. Can keep this off as default as it takes a bit cpu resources and turn on if it turns out it is needed. </p> </div>