Scene Dancing in Virtual Reality: A Mini Tutorial
I love dancing. So naturally, I wanted to make something that I could dance to in Virtual Reality.
I’ll preface by saying that the experience isn’t that complex nor is it very safe (turns out that dancing with a headset on makes it quite hard to keep balance). That said, I decided to share this experience because I wanted to give a mini tutorial on how my scripting worked (see further below for a step-by-step). It’s also the sort of thing that can be used for pretty much anything and isn’t actually particular to dance.
My Scene Dancer is a simple blend of multiple skyboxes to make a user feel like they’re in traveling through different worlds. I was inspired by Guillermo Del Toro’s new film, The Shape Of Water, to create something that would make me feel like I was moving through a fantasy of worlds (I highly recommend that film!).
There were a lot of questions on the Unity Forums from people who wanted to know how to blend skyboxes together. There were also a number of different answers — a lot of which didn’t work for me. I tried many things before I found an easy solution for myself so hopefully this will be useful.
I first picked several, free, skyboxes that I liked from the Unity Asset Store. I then blended all my skyboxes together over time and finally, added a soundtrack (“All This Love” by JP Cooper). That’s pretty much it! I say that the experience is for dancing because that’s what I think about when I dance. I like to imagine I’m in the sky or by the mountains. That said, the experience can be used for pretty much anything. My brother uses it to relax and meditate! In the scene you may also notice that there are particle systems like fireworks and smoke. I created these so that users would have an idea of where they were in the scene since a skybox is an infinite environment. Without this perspective, users wouldn’t be able to tell whether they were moving forward or not. On that note, the scene also contains an Auto-Walk script that allows users to move around in the scene in the direction that they are looking. See below for a walkthrough of the scene. You can also check out the project on github. See below for a walkthrough of the scene. If you’re interested in learning exactly how to do this in Unity using C#, read on!
TUTORIAL:
How to Blend Unity Skyboxes Together:
The number one issue people face when trying to blend skyboxes together is that they try to blend two skybox materials together in their script. You actually need a shader first that can blend two different skyboxes together and then apply that shader to a new material. Fortunately, Unity’s Unify Community provides a script for blending shaders together in Unity. This is super helpful for anyone not well-versed in the scripting for shaders and is pretty much all you’ll need for this. You can check out the script here.
Step 1: Copy Unity’s “SkyboxBlended” Shader script.
Step 2: Create a new shader in unity and paste the script in it on Monodevelop.
Step 3: Create a new material for your skybox and add the shader to it.
Step 4: Edit the new material by adding the textures of your skybox. This is done by dragging and dropping all six texture sides of your skyboxes into the corresponding boxes. You’ll notice there 12 texture boxes. The first six boxes should be for the first skybox you want to have and the next six for the second skybox. When you create or import a skybox, there should be six textures labeled “Front”, “Back”, “Up”, “Down”, “Right” and “Left” that make up the skybox. These are the textures you want to drag into the inspector of your new material.
Step 4: You’ll notice a blend slider at the top of your inspector when the shader is selected. You can drag this between a value of 0 and 1 with 0 being the first skybox at full value and 1 being the second skybox at full value.
Scripting
So now we have a new material that is a blend of two different skyboxes. What we want to do is gradually change the blend value to get a smooth transition from one skybox into another. The means, increasing the blend value slowly from 0 to 1.
See below for an example of a script that blends one skybox into another.
Changing the value of the blendspeed will change how fast your scene blends. There are multiple ways you could think about blending a shader — this is just one way!
Adding more than 2 skyboxes to scene:
If you want to add multiple skyboxes as in my scene, you’ll need to create more materials following the steps above. Obviously if you want a smooth transition, the first skybox of the second material should be the second skybox from the first material. For example, if Material 1 starts with Skybox 1 into Skybox 2, Material 2 should start from Skybox 2 and go into your new skybox, Skybox 3. In your script, you should add more steps as above and call on them when you want the next blend to begin. Here’s how mine looked:
Again, there are many ways you could do this but this is just what I found easiest! If you wanted to have different blend speeds for different materials, just add more public floats with the desired speeds and use those instead of the blendspeed float.
Many people use the blending of skyboxes to change a scene from day to night so you could also use this method to do that or if you have a simple scene, add a Time.deltaTime rotation to your sun (Directional Light).
And that’s it! If you have any questions or suggestions, feel free to reach out to me. You can also check out the full project on github.
