In this example, we will demonstrate how to implement an effect that changes the user's eye color using the pupil tracking feature.
First, go to File → Create new effect
Select the Root and in Node properties select the Position mode to Position in camera space.
Next, add the new node Node → Add Empty
Select that Node and in menu bar go to Add Component and select Face Position component
Backward incompatible, to fix an old version of this effect, move it to face space.
Now, we need to add two quads, for the left and right eye.
Select the Node and add the first quad Node → Add Quad
Select new Quad, click Node → Rename. Name the new quad "LeftEye"
Select the LeftEye quad and in Node properties set the Depth to 1
Do the same for a second quad:
Select Node in Node hierarchy and click node Node → Add Quad
Select new Quad, click Node → Rename. Name the new quad "RightEye"
Select the RightEye quad and in Node properties set the Depth to 1
The Node hierarchy should now look like this:
Next, select Root in the Node hierarchy
Go to File → Add FBX and select the eyes.fbx from the eye_color_example folder
Select the node RootNode → group → node in the Node hierarchy
In Node properties change the Mesh driver to Vertices 2D - Eyes
The LeftEye and RightEye quads will be used to display the new iris colors, and eyes.fbx will be used for eyelid occlusion.
To track the user's pupils:
Select the LeftEye quad
In menu bar go to Add Component and select Left Eye Position component
Do the same for right eye:
Select the RightEye quad
In menu bar go to Add Component and select Right Eye Position component
Next, add the texture:
In the Textures tab click Add → Texture
Select the iris_mask.png texture from the eye_color_example folder.
The iris mask texture has to be uncompressed (PNG 100%) to preserve the alpha channel
Different shaders and blending modes can be used, the following is our recommendation for the most natural-looking results.
Select the node RootNode → group → node in the Node hierarchy
In the Material properties disable the RGB write, Alpha write and Depth test options
Set any shader, we selected Unlit Color for readability.
Only depth will be used The eye mask should now be invisible if it is not, click Reload
Select the LeftEye quad
In the Material properties disable the Depth write option
Set the Blend mode to Screen
Set the Culling mode to Off
Set the Shader to Unlit Texture & Color
For the Diffuse texture select iris_mask.png
For Color set the hex value "001D38"
Select the RightEye quad
Repeat the above steps, we use the same color for both eyes in this example, for a heterochromia effect select a different color in the last step.
This is the final result:
Download this example with all assets