Dawn Of Shaders

Shaders, or FX offer a really awesome aspect of design, and control. It gives you the ability to do things you would normally only be able to do in an image editor, and animation they can't do.

This tut is an example of a variable blur. Its one of those effects you will find yourself trying to work in to make projects pop.

To control the blur we can add the Tween behavior to a background image.
Note: You might usually apply shaders to layers so that you don't have to use them on a bunch of different objects, but in this case there was only one object, and you can't apply behaviors to layers...


Apply the BlurHorizontal, and the BlurVertical effects to the background. Remember we need to refer to them exactly how they are spelled case and all to reference them in events.

Set the intensity down to zero.












+ System: On start of layout
-> System: Wait 1.0 seconds
-> fxSprite: Tween "blur" value from 0 to 100 in 0.5 seconds (Default, destroy: No, loop: No, ping pong: No, repeat count: 1)
-> Text: Tween "" property X to 29 in 0.25 seconds (Default, destroy: No, loop: No, ping pong: No, repeat count: 1)

+ fxSprite: Is Tween "blur" playing
-> fxSprite: Set effect "BlurHorizontal" parameter 0 to fxSprite.Tween.Value("blur")
-> fxSprite: Set effect "BlurVertical" parameter 0 to fxSprite.Tween.Value("blur")

So, on the start of the layout, wait.. and then start the tween "blur". We are only using the value.
For the next event we say while the tween "blur" is playing modify the two shaders to that value.

This will increase the blur amount. Its useful for directing when you want the user to look.

Find the source: here

Comments