Unity Shaders: Stylized Tree
In this last post of the "Stylized Look" series, I'd like to talk about trees and how to get that fluffy and smooth look typical of Studio Ghibli movies (yes, you should know by now I'm a huge fan of Miyazaki-san's works).
Here are the most important steps we have to take care to get the stylized look we're looking for:
There's a great post in Habrador's blog that explains how to model the leaves in a stylized way.
I followed his instructions to model the leaves for my tree. For the trunk and the branches I used Blender Mtree free addon.
The leaves texture also comes from Habrador's post, I only painted it white so I can decide the color of the leaves later in the shader.
The lighting model comes from Unity built-in Nature/Tree Creator Leaves shader. Since this shader is meant to be used with trees created with Unity Tree Editor that are already animated, the shader itself doesn't add any kind of motion to the trees.
This prevents me from using it as is since I want to use the tree I've modeled in Blender that is just a static mesh without any kind of animation.
That means I have to write a custom shader that adds motion to the trees (some kind of wind influence) and uses the TreeLeaf lighting model from Tree Creator Leaves shader.
Luckily enough, it's pretty easy to use the TreeLeaf lighting model in another shader, I only have to include UnityBuiltin3xTreeLibrary.cginc in my custom shader then tell the shader to use the TreeLeaf lighting model by adding surf TreeLeaf in the pragma directives.
To animate the tree, I've added two kind of motions:
To move the leaves, I use a noise texture to modulate the leaves UV coordinates over time.
I've put up a repository on Github if you want to test it out and take a look to the shader code.
Here's a video of the tree shader in action:
Here are the most important steps we have to take care to get the stylized look we're looking for:
- model the leaves the right way. Also export the model with smoothed normals
- use the right texture for the leaves
- use the right lighting model in the shader to get the smooth transition between light and dark tones
There's a great post in Habrador's blog that explains how to model the leaves in a stylized way.
I followed his instructions to model the leaves for my tree. For the trunk and the branches I used Blender Mtree free addon.
The leaves texture also comes from Habrador's post, I only painted it white so I can decide the color of the leaves later in the shader.
The lighting model comes from Unity built-in Nature/Tree Creator Leaves shader. Since this shader is meant to be used with trees created with Unity Tree Editor that are already animated, the shader itself doesn't add any kind of motion to the trees.
This prevents me from using it as is since I want to use the tree I've modeled in Blender that is just a static mesh without any kind of animation.
That means I have to write a custom shader that adds motion to the trees (some kind of wind influence) and uses the TreeLeaf lighting model from Tree Creator Leaves shader.
Luckily enough, it's pretty easy to use the TreeLeaf lighting model in another shader, I only have to include UnityBuiltin3xTreeLibrary.cginc in my custom shader then tell the shader to use the TreeLeaf lighting model by adding surf TreeLeaf in the pragma directives.
To animate the tree, I've added two kind of motions:
- sway back and forth (trunk and leaves)
- a separate wind influence that moves only the leaves
To move the leaves, I use a noise texture to modulate the leaves UV coordinates over time.
I've put up a repository on Github if you want to test it out and take a look to the shader code.
Here's a video of the tree shader in action: