Construct 3 icon

Construct 3

Documentation

Effects

Published 16 Aug, 2017
504 words
~2-3 mins

Effects change the visual appearance of objects. They can be added with the Effects dialog. Effects can also be added to layers and layouts, although effects which blend with the background cannot be used on layouts. Effects are also sometimes referred to as shaders or WebGL shader effects, since this refers to the underlying technology. Below is an example of the Water effect on an image.

An example of the Water effectAn example of the Water effect

Construct provides a library of over 80 effects. Adding effects also displays them in the Layout View if Preview effects is enabled in project properties. A number of examples of effects are also provided in Construct's examples which you can find by searching for Effects in the Start Page.

Multiple effects can be applied to a single object, layer or layout. In this case the effects are chained. The result of the first effect is processed by the second effect, then the result of that is processed by the third effect, and so on.

Note that the Free edition is limited to using two effects in a project only.

Blend mode

The Blend mode provides a simple set of pre-defined ways to blend the object with the background. Click here to open an example of blend modes in Construct. The image below also demonstrates the available blend modes.

The blend modes available in ConstructThe blend modes available in Construct

If multiple effects are used, the blend mode is applied only to the last effect. For example with three effects, the effect chain is processed normally, and the blend mode is only used to blend the result of the third effect with the background.

Changing effects at runtime

Objects supporting effects provide common actions to enable or disable effects, or set an effect parameter. This allows you to switch effects or adjust effect parameters at runtime, allowing for greater possibilities and creative uses. To enable or disable layout or layer effects, or change their parameters, use the relevant system actions.

Performance

Using too many effects can cause poor performance, especially on mobile devices. Try to only use effects when it is important to the appearance of the game.

Creating many instances of an object using effects can be very inefficient, since the effect must be processed repeatedly for small areas. If many instances need to use an effect, sometimes it is more efficient to place all the instances on their own layer, and apply the effect to that layer instead. This can improve performance whilst producing the same visual appearance.

Never use effects to process a static effect on an object. For example, do not use the Grayscale effect to make an object always appear grayscale. Instead apply the grayscale effect in an image editor and import a grayscale image to the object, without using any effects. This has the same visual result, and avoids performance-degrading effect processing. Effects like Grayscale should only be used for transitions or making objects only occasionally appear grayscale.

For more information, see the manual section on performance tips.