This is the 4th part of the "AudioLink integration of VRSL" tutorial/wiki series. This page is a continuation of the previous tutorial with a slight deviation, VRSL AudioLink: Controlling Fixtures Part 1 Before you begin this page, ensure that you have gone through that tutorial first and been through all the prerequisites for that tutorial as well as many things may not make sense/will be shown without much context unless you have been through the previous tutorial. In this section, we will be looking at:
- Animating Colors And Other Shader Parameters For Fixtures
Animating Colors For Fixtures
It has been a while since the previous tutorial. As a result, we're going to just be using the example scene found in the base VRSL package. You can find that example scene at Packages/VR Stage Lighting/Runtime/Example Scenes/AudioLink-Scenes/VRSL-ExampleScene-AudioLink.
We're also going to spawn an extra spotlight in the middle for us to work on. We'll also create a new folder in the root Assets folder called VRSL Animating Fixtures Tutorial 2 to store our animations. Your scene should look something like this:
We'll make a new Animator Controller object in that folder and then attach it to the root of our spotlight.
First we're going to create a simple system where we can fade between a selection of colors based on an integer parameter we give the animator. This will allows us to select a color and fade to it. We're going to put this system in its own layer, so we'll start by making a new layer and calling it Colors (Make sure to set its layer weight to 1!):
And then we will also make an integer parameter named Color!:
Now it is time to make our first color animation!
Animating special properties with VRSL fixtures is as simple as animating the meshes that make up the fixture itself. Animations are interesting in unity because they preserve any GPU instancing, even after scripts have already set them up, so we do not need to worry about the script at all. You can think of animations as overriding the parameters that are set at the beginning by the script when the game launches.
To begin, we'll start by setting our light to red!
Start by creating a new animation called Spotlight-Red and saving it to your Color Animations Folder:
Make sure to remove its reference from the base layer in the animator to avoid any future issues!
Drag the animation from your project folder to the Colors layer to add it!
Coloring The Meshes
Now that your animation is set up, we're going to start by tinting all the meshes red! Let's start with the volumetric mesh (the large beam).
First click on the volumetric mesh object. You can select it from the hierarchy. It is a child of the root object of your spotlight (named MoverLightMesh-VolumetricPassMesh)! Open its material in the inspector after you selected it!
Scroll down until your see the Light Emission Color property. Go to the animation tab and click the red record button. Next, click on the Light Emission Color property and change its color to a red color! (note: HDR intensity is a factor, so do keep that in mind when choosing your color!)
Normally, this color property is overridden by the script, but since we are recording an animation, the animation will override whatever the script is doing.
You should now have a keyframe in your animation where the color of the volumetric is now red!
Lets animate the other meshes now! For the spotlight there is:
MoverLightMesh-LampFixture-BaseMoverLightMesh-LampFixture-LegsMoverLightMesh-LampFixture-HeadMoverLightMesh-VolumetricPassMeshMoverLightMesh-ProjectionPassMesh
While the legs and base aren't really necessary, its good to keep everything the same to ensure instancing doesn't break!
Go ahead and go through these objects in the hiearchy and record their color to red just like we did for MoverLightMesh-VolumetricPassMesh!
For the sake of reducing the chance of Unity being weird, lets duplicate all the key frames we made so that our animations is technically two frames long!
There we go! Congratulations, you've made your first color animation for a VRSL fixture!
When you hit play, you should notice your light flashing red now, even though the color in the script is white!
Now lets make more colors to select from! Duplicate your animation in the hierarchy and name Spotlight-Yellow. Drag the new animation into your Colors layer on your animator!
We're going to do the same as before, but this time we're going to make our spotlight yellow this time!
Select the Spotlight Yellow animation in your animation selection drop down on the animation tab then re-record your animations to be yellow! Make sure to overwrite the duplicated frame with your new ones as well!
Fixing The Constraints!
Sometimes when recording animations, the constraints controlling the legs of the spotlight may break and you may see something like this:
To fix this, go to the affected mes hand right click the top of the transform component in the inspector and click Reset:
Fixed!
Back to Coloring the meshes!
Okay we've just finished our yellow animation!
Now our spotlight has the ability to turn yellow, but our animation controller is set up only to play the red animation. We need to bind the which color animation is playing to our Color integer parameter we made before in our animator:
To do that, first we'll need to make some transitions!
First set up a transition from the red animation state to the Exit state, and another one from the Entry state to the red animation (The arrows should look stacked on each other for the entry state since red is also our default state) like so:
Now do the same for the yellow animation:
Edit our Entry transitions by clicking on the Entry State and looking at the list of transitions. Select the one pointing to Spotlight-Red and add a condition where the Color parameter needs to equal 0.
Do the same for the one pointing to the yellow animation, except set it to need to equal 1!
Now we need to look at the exit transitions. This is where the actual fade values can be set.
Click on the Spotlight-Red state and click its transition to the Exit state.
Open up the settings drop down and do the following steps:
- Disable Exit Time
- Enable Fixed Duration
- Set the Transition Duration to 1.0
- Transition offset to 0
- Interruption Source to None
- Set a Condition where
Colordoes NOT equal 0
It should look something like this:
Now do the same for the yellow except set the condition to where Color does NOT equal 1!
Now the spotlight is able to switch between Red or Yellow by changing the Color parameter!
Enter play mode and check it out (Disable audiolink in the script so you can see it better!):
By switching the Color parameter between 0 and 1, we can have a 1 second fade between both colors!
As you can see you can repeat this process to add a bunch of colors.
You can also control the AudioLink shader properties with the same method! In this clip, I made a boolean animation parameter that switches between two animations that sets the AudioLink toggle on the meshes. Just like before, this overrides the AudioLink toggle state in the script
This more or less concludes the "Controlling Fixtures" tutorial for now. A continuation may be created later to cover creating a basic script for controlling these animators!