Tutorial: Dissolve Material Effect

[ameyp]

Good job dude, nicely done

[Moodydata]

I am obviously doing something wrong, I have made the material, and the instance and set it up all in kismet but its not working on my skeletal mesh.

And the thing is I have followed the tutorial all the way through.

[shot]http://img837.imageshack.us/img837/844/wtfs.jpg[/shot]

thats what comes on screen but the model does not actually appear going from 0 - 1.

[JiffOrange]

Yeah I had the same problem to be honest. Luckily in my game I only needed to apply it to NPC's with a head and a body material so I just did the same material effect twice. I haven't gone back to this effect since then to expand upon it and I cant think of a way to apply it without replacing the whole material, sorry

I may have a look over the weekend if I get some time.

Just thought I tell you if the UDK Central is your site (If not let me know who is) as it's been spammed I found one here:

http://udkc.info/index.php?title=Tut..._snow_and_rain

Under the tut. Didn't find any other but thought it should be pointed out to somebody before who ever gets all over it and spoils it for everybody.

Cheers,

Jiff

P.S. Nice material, will have a play with that

[phale]

awesome tute, thanks

i'm using scalar MIC in matinee for multuile objects. Can i individually control when / to whon each happens, or will changing the scalar param effect every instance (which atm it does)

i want like, 3 similar objects all of the same type / material, but to change their scalar params individually. Will i need 3 different MICs?

[mikesdk]

Yes phale, since you want them to change differently they are essentially 3 completely different objects, and thus need an MIC for each.

[arielapp]

im having some hard time, why isnt it working for me?
i did everything you said

[Sir. Polaris]

You might get some help if you describe your problem in more detail

[arielapp]

the wall just doesnt dissolve

[Wyldhunt]

...
Yes. You've mentioned that it doesn't work.
Can you post a screenshot of your material and/or kismet that controls it?
Or, give details as to how you tried to use it?
Anything that could possibly be useful in helping you figure out what you did wrong?

[thommie]

since UDKC is down now and i'm in the process of putting all of its tutorial on http://unrealdb.com/ i thought i'd go ahead and put it here.

 

Spoiler

Introduction

The actual effect is created inside of the material editor and only requires a simple texture which you can make inside of Photoshop, if you don’t have Photoshop don’t worry as I’ll also provide the material which you can find here. Texture Download. To create the 3 layered cloud map in Photoshop, make a new image with a size of 512x512. Go into the channels tab, next to the layers, click on the red channel and then go to Filter > Render > Cloud. Do the same for all 3 colours, then save the file as a .TGA (Targa) and make sure it’s 24bit.

The Material

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/2/2d/Dissolve_Mat_1.jpg[/SHOT]

This image shows the entire material, not as complex as you might have thought. So let’s break this into parts.

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/c/c2/Dissolve_Mat_2.jpg[/SHOT]

What we’re doing in this part of the material is creating some variation in the overall effect. The top and the bottom lines are basically using the clouds map that we created at the start of this tutorial and altering them to give them a bit of difference so we’re making two images from the same original texture.

The “Param ‘opac’” may be an expression that you haven’t used before. All it is, is a Scalar Parameter and to create one just pick it from the list on the right or right click anywhere in the light grey area and click (UDK) Parameters > New ScalarParameter.

Click on the new ScalarParameter expression that you just created and in the properties box change the Parameter Name to anything you would like, in my example I called it opac, which is short for opacity. What does this name do? Well by adding a name here, we can reference this expression outside of the material editor by creating a “Material Instance Constant” or MIC for short. An MIC is just a copy of the material which allows you to change certain factors and nodes that you have setup in the material. By using this technique, artists can create many different materials all from the same parent material. Not only does this save a lot of time and let you create some cool effects, but more importantly it saves your texture memory pool resources.

Both Cloud materials are then multiplied by the ScalarParameter, which depicts how visible they are. You can put any value you want into the ScalarParameter for now, I like to use 0.5 as it gives me the most visible feedback throughout the material as its half way through the effect.

Expression Values

Bottom right constant: 2

Middle Constant: 4

Rotator: Center X: 0.5, Center Y: 0.5, Speed 0.25

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/0/06/Dissolve_Mat_3.jpg[/SHOT]

In this group of expressions, we are taking the result of adding our slightly different cloud expressions together and then adding them to our original ScalarParameter to add more contrast to the scene. We then feed that into a Power node and multiply that expression by 100. What this does is really brings out the contrast of the image and gives us the nice sharp edges that we’re looking for. Although, there may be occasions where you don’t want to use the power node, and that’s fine as you can get softer effects without it, I leave it up to you to think of new ways to use this material. The result of the Power node is then fed into the Constant Clamp. The Constant Clamp is an expression which will clamp a value between the numbers you put in the expression. This stops images becoming to bright or too dark, or if you need a result to remain within a certain range. We’re using a Constant version of the Clamp as we don’t need to change the values.

What have we achieve so far? We have pretty much set up how the material works now. If you link what we have up into the diffuse channel and change the ScalarParameter we set up at the beginning, you’ll see how the effect actually works. All we need to do now is find a way how to animate the number so that it rises from 0 to 1 and we also need to find a way to make the edges emmisive. Also, as this is a dissolve material, we’ll also hide the material which we are dissolving.

Expression Values

Constant: 100

Constant Clamp: 0 and 1 (default values)

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/a/a5/Dissolve_Mat_4.jpg[/SHOT]

Ok, the last part of the material. If you’re new to both programming and the material editor, then you might not have heard of the IF node, but its concept is very easy to understand. It operates by taking in to variables, A and B. It then has 3 nodes which depict what the expression should output based on the difference between A and B.

A > B: The input here is the result of the operation if A is greater than B

A = B: The input here is the result of the operation if A is equal to B

A < B: The input here is the result of the operation if A is less than B

So what values do we want for A and B? Well in one of our values we want the output of our expression we just created. In the other we want a single constant, I choose 0.25 but you can experiment, anything between 0.1 and 0.9 will give pretty much a similar effect.

A quick explanation of what’s going on here, as we have created such a contrasted imaged in the expression we made earlier, there is only a minute amount of grey in the image and it is right between the white and the black parts and this is exactly what we need for a dissolve effect. With this, we can then add inputs for what happens based on how much grey there is in the image. The values we want to use in the 3 nodes below are

A > B: Constant 3 expression with values 100, 10, 1

A = B: Constant 3 expression with values 0,0,0

A < B: Constant 3 expression with values 0,0,0

The 100, 10, 1 constant is our actual dissolve effect.

Expression Values

Top Constant: 0.25

Top 3 Constant: 100, 10, 1

Bottom 3 Constant: 0, 0, 0

Now we just need to link it all up to the main expression. Link the Constant Clamp into the opacity node and the IF expression into the Emmisive node. We then also need to change the material’s blend mode to BLEND_Translucent. If we didn’t do this then we couldn’t change the opacity of the image. That’s the actual material finished. Save your material and your package and we’ll move on.


Material Instance Constant - MIC

Now we’ll create the Material Instance Constant we talked about earlier, to do this, right click on the material you just created in the content browser and choose “Create new Material Instance (Constant)”, call it what you want.

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/2/23/Dissolve_Mat_5.jpg[/SHOT]

Once that’s done, double click your newly created MIC and look for Scalar Parameter Value, expand it and tick the ScalarParameter you created earlier, I choose the name ‘Opac’ Remember. Set the value to 1. This makes the material start fully opaque. If you wanted to have the dissolve go the other way and the material to appear, then you would set the value to 0. The rest you can leave

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/b/b3/Dissolve_Mat_6.jpg[/SHOT]

Apply the MIC to an object in your level so we can watch the effect in action a bit later on.


Finishing Touches

Ok, we’re nearly there! Now we need to find a way to alter the MIC in game so we can make something dissolve! To do this, go into the Actor Classes tab in the generic browser and look for “MaterialInstanceActor”. With this highlighted, go back to your level, right click somewhere and choose “Add MaterialInstanceActor Here”. Open the actors properties by either double clicking it, or selecting it and pressing F4. Inside the properties, expand the MaterialInstanceActor tab and then press the magnifying glass to the right, next to the green arrow and the pale blue square. This will open up the generic browser for you, look for your MIC that you created and highlight it. Now go back to the properties screen and this time press the green arrow next to the magnifying glass that you pressed before. This should create a link to your MIC

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/7/76/Dissolve_Mat_7.jpg[/SHOT]

We now have everything in the level set up, all we have to add now is a tiny bit of scripting, but don’t panic! It’s only in Kismet, if you’ve never used it before, it’s a visual scripting system which means it’s all done just like the material editor, we just connect wires and the engine will create the code for us behind the scenes. To access Kismet, click the Green “K” at the top of the screen

Right click anywhere in the grey area and then choose “New Matinee”. If you’ve never heard of Matinee before, for now think of it as the way to animate anything in your level. Examples include characters, lifts, doors, user interface, particles, lights, sounds etc. If you haven’t used it before I’d urge you to play around with it at some point. It’s a really powerful tool, especially if you’re creating single player games.

Now before we open the matinee, close or minimize your Kismet screen, and back in your level, select your MIC. Open back up the Kismet screen and then double click your matinee. The reason we selected it before we went into Matinee was that the engine will link that to the Matinee for us, if we didn’t have it selected we would have to close the matinee, select the object and then in kismet right click and choose “New Object Var Using MaterialInstanceActor_0” or whatever number your MIC got designated. This isn’t a tutorial on Matinee per se, so I’m only going to show you what to do to get the dissolve effect working. On the left hand side, in the dark grey area right click and choose “New Empty Group”, call it “Dissolve”. Then right click on the group you just created and choose “Add New Float Material Param Track” This will create a new animation track underneath.

[SHOT]http://web.archive.org/web/20110928224143im_/http://udkc.info/images/1/1c/Dissolve_Mat_8.jpg[/SHOT]

Click on the new “Float Material Param” and in the properties box along the bottom; click the magnifying glass on the right hand side of “Material”. Locate the MIC in the content browser that you created, come back to the Matinee and press the green arrow; this will link this to the matinee. Then in the “Param Name” section, change the value to “opac” or whatever you called ScalarParameter, without the “”.Now click on the “Float Material Param” track again, just to make sure it’s selected, and move the slider to 0:00. Press “Enter” and it should add a keyframe, depicted by a red triangle. Right click the triangle and make sure the value is 1. Now create another Keyframe at around 4 seconds, this time right click on the triangle that was just created and change the value to 0. You can now close the matinee. Back in Kismet we need to find a way for the material to transition to activate. To do this, right click and click “New Event > Level Loaded”, and link the node from “Loaded and Visible” to the “Play” node on the matinee.

So what have we just done?

The level loaded expression gave us an event to start the matinee. In the matinee we created a new track and linked that with the MIC we created earlier. We then created 2 keyframes, one at 0:00 and one at 0:04. We had the first one at a value at 1 and the last at a value of 4. The matinee then created an interpolating animation between the two, in our case it would have gone from a value of 1 to a value of 0 in 4 seconds. Why did we choose 0 and 1? Well remember we set up a ScalarParameter and the value of that, between 0 and 1, will decide how much of the object is transparent.

Now save your level and your package, sit back and test your new effect in action. It should start to run as soon as you started your level. I hope you learned something from this tutorial,

Regards
Chris Cook – “Piranhi” on the Epic forums.

[evernewjoy]

"The actual effect is created inside of the material editor and only requires a simple texture which you can make inside of Photoshop, if you don’t have Photoshop don’t worry as I’ll also provide the material which you can find here. Texture Download. "


Does anyone have this texture download now that udkc is down?



Rama

[Kelt'ar]

*snipped*

Does anyone have this texture download now that udkc is down?



Rama

I have it. I'll trade ya.

[Kelt'ar]

Oh u meant the link. Nvm then.

[Kelt'ar]

I'v got the same issue, I'v found trying to apply this to a pawn with two materials doesn't give the right results but runs correctly with all my bots that have a single material.

U can make a parent material with the effect and make material inst constants for the various material slots

[gdebojyoti]

Udkc.info seems to be down. Can someone please link me to the above tutorial, or a similar one?