Particles SubUV Tutorial

Document Summary: A tutorial on creating sprite-based particle emitters that utilize sub-UV image selection for per-particle animation.

Document Summary: Created and updated by Scott Sherman.

Introduction

The Unreal Engine's Particle System provides an emitter TypeDataModule that allows for the selection of sub-images from a source texture to be displayed on its particles. It works by allowing you to select the sub-image to display for a particular particle as a function of the lifetime of the particle. See the UnrealCascadeReference^? for a general description of the Cascade Particle Editor.

This document assumes you are familiar with the Generic Browser, and with creating packages and objects within those packages.

Sample SubUV Emitters

Creating a Simple SubUV Particle Emitter

Create a new ParticleSystem

Start the editor, right-click in the Generic Browser, and select "New Particle System". The Generic New window will pop-up, prompting you for a package name, object name, and the factory as shown below:

Enter the following information:

[NOTE: If you have done other particle system tutorials, the MyEmitters package may already exist. In this case, if you do not want to lose the previous work and the package is not open, open the MyEmitters package and perform the right-click in the browser window for MyEmitters.]

This will result in the following insertion into your MyEmitters package:

Import a Texture

In this example, we will be using a simple `subdivided texture' called ColorQuarters. The texture consists of a simple quartered color square scheme, with the alpha channel embedding the numbers 1, 2, 3, and 4 in each sub-square from left-to-right and top-to-bottom. This image allows for simple verification that the sub-image system is working.

After importing the texture, MyEmitters in the browser should look similar to the shot below:

Create a ParticleSubUV Material

The next step is to create a material that will be applied to the sprites generated by the particle emitter. Right-click in the MyEmitters browser window and select "New Material". Name the material "SubUV_Mat" and open it in the Material Editor.

In the case of Sub-UV emitters, a special material expression, ParticleSubUV, must be used. Select this by right-clicking in the material editor window and picking it from the list as shown below:

The following material expression widget will appear in the editor:

The properties view will allow for the selection of a texture to use in this SubUV sampler. Use the generic browser to select the ColorQuarters texture that was inserted in the earlier step. You should have the following in the property panel once this has been done:

The next step is to `hook-up' the SubUV expression to the output of the material. In this simple case, just run the RGB output to the Diffuse input, and the Alpha output to the Opacity, as shown below:

If desired, the blend mode of the material can be set according to how you want the particles to be drawn. In this case, we will use "BLEND_Translucent", so select it as shown in the screen shot below:

The View So Far

Provided this tutorial was started with no MyEmitters package, the browser window should look similar to the following:

Create the Particle SubUV Emitter

To open the Particle Editor, Cascade, right-click on the ParticleSystem and select it from the menu as shown below:

Once Cascade opens, right-click the `emitter bar' and select "New ParticleSpriteEmitter" as shown below:

At this point, you should see the following view in Cascade, showing the newly created Emitter in the preview window:

The base emitter class contains the SubUV-related settings: the InterpolationMethod, and the Horizontal and Vertical sub-image counts for the texture. This information is contained in the "SubUV" section of the emitter property window, shown below:

Apply the Material and Set the Emitter Parameters

Select the emitter by clicking the "0: Sprite Emitter" box in Cascade. This will bring up the emitter properties in the lower-left panel of the editor. Enter the following information for the given fields:

At this point, you should see the following image in the editor preview window:

Setting up the SubUV parameters

Select the SubUV data type properties by clicking the "SubUV Data" box in Cascade. This will bring up the SubUV properties in the lower-left panel of the editor. Enter the following information for the given fields:

This informs the emitter that the sub-images are laid out in a 2x2 grid, and that the interpolation should be in a linear fashion between sub-images.

As you can see, the emitter is selecting the `first' sub-image for the supplied texture, as the default sub-image index will be a constant 0.

Setting the SubImage Selection

Select the "SubImage Index" module of the SubUV Emitter by clicking on it in the emitter window. The properties for this module will now be displayed in the lower-left panel of Cascade. There is only one piece of information contained in the SubImageIndex module, and that is a scalar distribution named "SubImageIndex".

By default, the index distribution will be set to DistributionFloatConstant. Expand the SubImageIndex property entry to display the "Constant" sub-field. Try changing the constant to 1.0, 2.0, 3.0 and finally back to 0.0. You can see the emitter switch through the four provided sub-images.

Switch the distribution to a uniform one by clicking the green arrow for the SubImageIndex entry., as shown below:

Set the Max value to 3.1 and the Min value to 0.0. NOTE: The sub-image system is 0-based, i.e. it starts at 0 and goes to <# of sub-images> - 1. 3.1 is used in this case to ensure that the 4th sub-image has the same likelihood to show up as the rest of the images.

You will see each particle changing the sub-image it is using each frame. [This behavior will likely be changed in the future to allow for the time between sub-image switches can be controlled by the artists.]

Finally, change the distribution type to a constant curve. Click on the small green `button' on the SubImage Index module of the emitter to add the curve to the curve editor.

Add a curve with data points at the following increments:

This will generate an emitter that smoothly transitions between all of the existing sub-images, giving each one approximately 25% of the lifetime of the particle. Below is a screenshot:

The MyEmitter package is available here.