Published on

Make Vroid model look Anime Style in Universal Render Pipelin [Real Toon / Unity URP]

Authors
  • Evelyn

Please share this article if you like!

There are even animated movies made with Unity these days, like the Disney movie Baymax!

I want to use the Vroid model to create a video in Unity too!

I'll show you how to change a Vroid 3D model to Aime Style using an asset called RealToon.

RealToon is a paid asset, but I highly recommend it because it supports all rendering pipelines.

There are also videos explaining how to use the assets, so if anyone has difficulty understanding the text information alone, please check out Youtube!


Table of Contents

Importing and setting up RealToon

First, let's create a new project and import RealToon.

I created a Universal Render Pipelin project.

Next, double-click on the unitypackage file for the rendering pipeline.

My environment is version 10 URP, so I will import RealToonURP (URP10).

Create a helper script that turns the Vroid's MToon Material into a RealToon.

This script is not perfect, but I think it will make your work much easier.
RenderPipelineHelper.cs
// RenderPipelineHelper
// by Andy Miira (Andrei Müller), November 2020

using UnityEngine;
using UnityEngine.Rendering;

namespace MirrorMirai.Helpers
{
    public enum RenderPipelines
    {
        BuiltIn,
        URP,
        HDRP
    }

    public static class RenderPipelineHelper
    {
        public static RenderPipelines CheckRenderPipeline()
        {
            if (GraphicsSettings.renderPipelineAsset)
            {
                if (GraphicsSettings.renderPipelineAsset.GetType().ToString().Contains("HDRenderPipelineAsset"))
                {
                    // HDRP active
                    Debug.Log("HDRP active");
                    return RenderPipelines.HDRP;
                }
                else
                {
                    // URP active
                    Debug.Log("URP active");
                    return RenderPipelines.URP;
                }
            }
            else
            {
                // Built-in RP active
                Debug.Log("Built-in RP active");
                return RenderPipelines.BuiltIn;
            }
        }
    }
}
MToonToRealToonShaderSwapper.cs
// MToon to RealToon Shader Swapper for Unity
// by Andy Miira (Andrei Müller), October 2019
//
//
// [IMPORTANT]
// You must add the file RenderPipelineHelper.cs to your project, linked below:
// https://gist.github.com/andreiagmu/b862ae47ef91be05f61ae2da26627a01
//
//
// [INSTRUCTIONS]
// 0) Add this script inside an "Editor" folder in your project.
// You must create this folder if it doesn't already exist.
//
// 1) Open Unity, then click on
// "Tools -> Mirror Mirai -> RealToon Helpers -> MToon to RealToon Shader Swapper" at the menu bar.
//
// 2) Drag and drop your model's Prefab/Game Object with MToon materials in the "Model Prefab" field.
//
// 3) You can optionally override the "Environmental Lighting Intensity" property from RealToon,
// by enabling the "Set Env Light Intensity" option and typing the override value in the field below.
//
// 4) Finally, click on the "Swap Shaders" button.
// In ALL of the model's materials that use MToon shader, the shader will be swapped to RealToon.
//
// Usage example:
// https://twitter.com/andymiira/status/1189735251813294082
//
//
// Check out more Unity scripts and utilities at:
// https://gist.github.com/andreiagmu

using MirrorMirai.Helpers;
using UnityEditor;
using UnityEngine;

namespace MirrorMirai
{
    public class MToonToRealToonShaderSwapper : ScriptableWizard
    {
        public GameObject modelPrefab;

        [Tooltip("If enabled, swap \"MToon\" shader with \"RealToon Lite\" shader.")]
        public bool useLiteShaders;

        // Shader properties overrides
        // If enabled, these overrides will be set in ALL of the prefab's materials!
        [Space]
        [Tooltip("If enabled, can override \"Main Color\" property with the value below. " +
                 "This will be applied to materials with MToon's default color value (Color.white), " +
                 "and will not be applied to materials with custom colors.")]
        public bool setMainColor;

        [Tooltip("The value to override \"Main Color\" property.")]
        public Color mainColorOverride = new Color(0.6886792f, 0.6886792f, 0.6886792f, 1);

        [Space]
        [Tooltip(
            "If enabled, can override \"Environmental Lighting Intensity\" property (from RealToon Default) with the value below.")]
        public bool setEnvLightIntensity;

        [Tooltip("The value to override \"Environmental Lighting Intensity\" property.")]
        public float envLightIntensityOverride = 0.65f;

        // MToon cached property indexes
        private static readonly int BlendMode = Shader.PropertyToID("_BlendMode");
        private static readonly int MToonMainColor = Shader.PropertyToID("_Color");
        private static readonly int ShadeColor = Shader.PropertyToID("_ShadeColor");
        private static readonly int BumpMap = Shader.PropertyToID("_BumpMap");
        private static readonly int RimColor = Shader.PropertyToID("_RimColor");
        private static readonly int EmissionMap = Shader.PropertyToID("_EmissionMap");
        private static readonly int EmissionColor = Shader.PropertyToID("_EmissionColor");

        // RealToon cached property indexes
        private static readonly int MainColor = Shader.PropertyToID("_MainColor");
        private static readonly int OverallShadowColor = Shader.PropertyToID("_OverallShadowColor");
        private static readonly int NormalMap = Shader.PropertyToID("_NormalMap");
        private static readonly int RimLightColor = Shader.PropertyToID("_RimLightColor");
        private static readonly int EnableTextureTransparent = Shader.PropertyToID("_EnableTextureTransparent");
        private static readonly int GlossTexture = Shader.PropertyToID("_GlossTexture");
        private static readonly int GlossColor = Shader.PropertyToID("_GlossColor");

        private static readonly int EnvironmentalLightingIntensity =
            Shader.PropertyToID("_EnvironmentalLightingIntensity");


        [MenuItem("Tools/Mirror Mirai/RealToon Helpers/MToon to RealToon Shader Swapper")]
        static void CreateWizard()
        {
            DisplayWizard<MToonToRealToonShaderSwapper>("MToon to RealToon Shader Swapper", "Swap Shaders");
        }

        void OnWizardCreate()
        {
            var renderers = modelPrefab.GetComponentsInChildren<Renderer>();

            var renderPipelinePath = "";
            var currentRenderPipeline = RenderPipelineHelper.CheckRenderPipeline();
            var shaderCategory =
                currentRenderPipeline == RenderPipelines.BuiltIn && useLiteShaders ? "Lite" : "Default";

            switch (currentRenderPipeline)
            {
                case RenderPipelines.BuiltIn:
                    renderPipelinePath = "";
                    break;

                case RenderPipelines.URP:
                    renderPipelinePath = "Universal Render Pipeline/";
                    break;

                case RenderPipelines.HDRP:
                    renderPipelinePath = "HDRP/";
                    break;
            }

            var shadersPath = $"{renderPipelinePath}RealToon/Version 5/{shaderCategory}";

            foreach (var renderer in renderers)
            {
                var sharedMaterials = renderer.sharedMaterials;

                foreach (var mat in sharedMaterials)
                {
                    if (mat.shader == Shader.Find("VRM/MToon"))
                    {
                        // Save MToon values
                        var textureMainColor = mat.GetColor(MToonMainColor);
                        var shadeColor = mat.GetColor(ShadeColor);
                        var normalMapTexture = mat.GetTexture(BumpMap);
                        var emissionMapTexture = mat.GetTexture(EmissionMap);
                        var emissionColor = mat.GetColor(EmissionColor);
                        var rimLightColor = mat.GetColor(RimColor);

                        // Swap the MToon shader to RealToon
                        if (currentRenderPipeline == RenderPipelines.HDRP)
                        {
                            mat.shader = Shader.Find(shadersPath);
                        }
                        else
                        {
                            // [MToon Rendering Types/BlendModes]
                            // Opaque = 0, Cutout = 1, Transparent = 2, TransparentWithZWrite = 3
                            var blendMode = (int) mat.GetFloat(BlendMode);
                            if (blendMode == 2 || blendMode == 3)
                            {
                                mat.shader = Shader.Find($"{shadersPath}/Fade Transparency");
                            }
                            else
                            {
                                mat.shader = Shader.Find($"{shadersPath}/Default");

                                if (blendMode == 1)
                                {
                                    mat.SetFloat(EnableTextureTransparent, 1);
                                }
                            }
                        }

                        // Pass MToon values to RealToon shader
                        mat.SetColor(MainColor, textureMainColor);
                        mat.SetColor(OverallShadowColor, shadeColor);
                        mat.SetTexture(NormalMap, normalMapTexture);
                        mat.SetTexture(GlossTexture, emissionMapTexture);
                        mat.SetColor(GlossColor, emissionColor);

                        if (rimLightColor != Color.black)
                            mat.SetColor(RimLightColor, rimLightColor);


                        // Set property overrides if enabled
                        if (setMainColor && mat.GetColor(MainColor) == Color.white)
                            mat.SetColor(MainColor, mainColorOverride);

                        if (setEnvLightIntensity)
                            mat.SetFloat(EnvironmentalLightingIntensity, envLightIntensityOverride);
                    }
                }
            }
        }
    }
}

Importing Your 3D model

We will also import the Vroid model into the project.

To make the VRM file usable in Unity, we will use UniVRM.

UniVRM of Github

Drag and drop the unitypackage file about UniVRM into the Unity editor while reading the UniVRM description.

Then drag and drop the vrm file of your Vroid model into the project and wait for the import to complete!

UniVRM's MToon shader doesn't support the Universal Render Pipeline, so the character is displayed in pink.

Applying RealToon shader

Then, add the 3D model to the hierarchy.

Display the window for executing the helper script that you just imported into the project.

After that, set the Vroid character prefab to the Model Prefab in the window, and click the Swap Shaders button.

Since the previous script is not perfect, we will change the remaining pink material to RealToon's default shader.

Then, if the material has transparent areas, activate Transparent Mode.

After all this work, it should look something like this

Try to adjust the parameters to your liking! If you make the lines thicker and the shadows thinner, you'll get a more Anime look.

Wrap up

In this article, I introduced how to make the Vroid Model cell-look.

If you haven't bought the asset yet, please do so and give it a try.


Features of RealToon
  • Support for all rendering pipelines (built-in, URP, HDRP)
  • They have a helper script for Vroid model

If you liked this article, please subscribe to our youtube channel and follow us on twitter.

Thank you for reading to the end.

Please share this article if you like!