Toony Colors Pro+Mobile: Cartoon Shaders pack with lots of features!

I did, I just answered it! Thanks for your patience.

 

Possibly a silly question, but I'd like to be able to set a material's colors through script. It seems like it would potentially be more efficient than creating different materials for each that I need and then swapping them out. For example, I have objects that will have an on and off state. Depending on what the object does, it's on would have different colors for its color, highlight and shadow colors. Does this make sense?

Also, is it possible to do the same for a material's outline property? To not only enable or disable it, but also set the color through script?

Thanks!
Alan

 

You can definitely change properties through scripting, just like any other material using the corresponding API (for example material.SetColor).
To do that you need to use the internal property names, that you can find on the Inspector when you select the shader file:

For example the internal names of the color properties are _Color, _HColor, _SColor. So if you want to change the shadow color, you would do

Code (CSharp):

1. material.SetColor("_SColor", myColor);

As for the outline, you'll need to actually change the shader because it uses another pass - that's what the TCP2 inspector does when you edit the material using the Desktop shader for example.

Note that Unity will create a new material instance each time you access renderer.material, so keep an eye out for that if you do it for a lot of objects. It may actually be better to swap pre-authored materials using renderer.sharedMaterial instead, depending on the situation.

 

Hi Jean,

Maybe you can help me with my problem or perhaps can give a pro tip in which direction I should dig.


Anyway, I have a two-camera set up for a FPS game, and in order to have proper shadows on the gun I'm using the plugin called "the first person view2" (https://www.assetstore.unity3d.com/en/#!/content/67929).

I added a few lines of code in your shader to make it work as it supposed to with that plugin.

http://imgur.com/a/6zejd

But I'm getting this weird ghosting artifact and the shadows seem to go through the geometry.

http://imgur.com/a/eeuqP

Would appreciate any help.

Cheers,

Alex

 

I'm not familiar with that plugin so I don't know how it works, but if these are the only lines you added in the shader then they won't do anything!
What this does is tell the shader that there is a shader variant using the keyword FIRSTPERSONVIEW (which I guess is enabled on the material by the FPS plugin). So Unity will compile two shader for that .shader file.
But if there isn't any actual code making use of that keyword, then the two shader variants will be identical.
So that's probably where the artifacts come from.

FYI using the keyword could look like this in the shader code:

Code (shader):

1. #if FIRSTPERSONVIEW
2. // do special things
3. #endif

 

Ok, thanks for the answer)

 

I'm currently using a cutout shader (based on the standard shader) with cull off and checking whether normals are facing away from the the camera and flipping them if so. It has all the usual features like shadows, specular, normal maps etc. and I'm using it on my sprites which are constantly flipped as they run from left to right.

Now I wanted to implement some light levels (they were working prior to unity 5.5 by clamping ndotl to different levels but not any longer). Instead of following the new process to edit BRDF.cginc to get levels can I just use this asset?

Will I still be able to flip assets such as sprites or quads and have normals display correctly?
Is there a cutout option to hide the invisible parts of a mesh?

Thanks for your time.

[EDIT: I took a look at the docs and see there is support for cutout and ramps with hard edges, but I can't see any demos of multiple lights with ramps. Are they compatible? BTW your fix for outlines is fantastic!]

 

So I downloaded the asset and made a few tweaks to suit my needs..
Latest Update:
TL;DR:
There were some issues with light bleeding when using the ramp which were solved by setting ramp import settings to point.
Also, I had to turn Cull Off and reverse the normals when they were facing away from the camera (which is set to the z plane).

Code (CSharp):

1. half nl = dot(viewDir, float3(0, 0, 1)) > 0 ? saturate(dot(normal, light.dir)) : saturate(dot(-normal, light.dir));

There was some extra unwanted detail that was removed by taking the disney diffuse out of the equation:

Code (CSharp):

1. half diffuseTerm = nl;// disneyDiffuse * nl;

Final result is simple pixel perfect directional/ambient lighting:




Original Post:
The asset looks great with robot kyle. Nice to see ramps on the point lights and also on the directional light.

I created a quad and attached the normal map and albedo for a simple pixel character.
Both albedo and normals are set to point no filter no mip maps.

Here is the standard shader for reference:


Here is the Toony PBS shader:


Here is the Toony PBS shader with ramp enabled:


As you can see the ramp texture gives me more hard edges which is what I want, but it also introduces a lot of artefacts.
What would you recommend to eliminate these artefacts? Should the ramp texture be a power of 2 quad?

#edit1
I changed the ramp textures to point filter in import setting and this fixed the issues. I also edited the hard ramp to make it harder, but even though I only have half pure white and half pure black with one pixel of grey in the middle I'm still seeing more than 2 shades of light:


Here is the man texture, normal map and occlusion map for reference:
As you can see he's just flat colour. With a ramp that's either on or off (with one pixel in the middle), I would expect light that's either on or off (with one pixel or less in the middle to smooth it a bit), but instead I'm seeing many shades of light.. (the rock texture is different with the shading built into the albedo).
#endedit1


Also, on another topic, here is Toony PBS Cull Off with character rotated 180 degrees:


As you can see the normal also needs to be reversed as the lighting is not correctly shown.

In a surface shader I would usually have the following code regarding normals:

Code (CSharp):

1.             float3 n = UnpackNormal (tex2D (_BumpMap, IN.uv_BumpMap));
2.             o.Normal = dot(IN.viewDir, float3(0, 0, 1)) > 0 ? n : -n;

But these shaders don't use surface shaders or deferred rendering.
Instead they reference TCP2_PBS_Main.cginc so any changes will need to be made here.
However I'm not familar with the code used for cgnic.
@Jean-Moreno do you know how to test for normal.z vs view direction in the cgnic?

Thanks for your time.

#edit2
In the TCP2_STANDARD_BRDF.cginc there is a section to handle Negative ndotv. I have set this to 1 to activate it. This gives improved lighting on flipped normals but it's still not quite right.
Interestingly though it is closer to the effect that I want to achieve than the correct rendering (flat lighting). The only problem is one subpixel under the right arm. And when the directional light is rotated there are lots of subpixels, whereas with the front view there are almost no subpixels.
See below:

#endedit2

#edit3
Ok so I'm making progress. I've dived into TCP2_STANDARD_BRDF.cginc and commented out the stuff about handling Negative ndotv and used an equation similar to my ndotl from the surface shader. Some of the terms are slightly different but the logic is the same.

Code (CSharp):

1. half nl = dot(viewDir, float3(0, 0, 1)) > 0 ? saturate(dot(normal, light.dir)) : saturate(dot(-normal, light.dir));

This results in no subpixels and perfectly flat light of one shade only which is beautiful to behold (as you can see I've also made the ambient light dark purple and the directional light light orange because I'll be doing some similar colour corrections in the final product).
Rotated 180 degrees with corrected normals:


Now my question is how can I get the front faces to be flat colour as well?
I'm happy to forego the middle shade and resort to binary lighting as shown on the backfaces if it means I can get perfectly flat shading on the front faces as well (though tertiary lighting would be preferred with 1 light, 1 dark & 1 midtone).
See the current front view which has too many shades for the style I'm after:


I should advise that in all of these cases I have disabled specular, fresnel, reflections, wrapped lighting, GI, etc. as I want to narrow down what is causing these lighting variances.
#endedit3

#edit4
SOLVED!
It appears that the culprit was the disney diffuse. All those pow5's etc were a little too fancy for my liking. So I commented out all that stuff and modified this line:

Code (CSharp):

1. half diffuseTerm = nl;// disneyDiffuse * nl;

Also, it appears that lv is never used (a search for lv returns 1 result) so I commented that out as well:

Code (CSharp):

1. //half lv = saturate(dot(light.dir, viewDir));

The final result:

#endedit4

 

Next challenge:
Fixing point lights:

As you can see even though directional lights and ambient lights look good, there is still sub-pixel lighting from point lights at the cutoff point. If each square was really only 1 pixel (perhaps with a zoom effect) then in the past this has resulted in flickering pixels as the engine can't decide whether they should be lit or not (perhaps if they are right on the borderline between lit and unlit).

To test this, I added a script to the camera to zoom in on each pixel and noticed that there was falloff for lights that were very close to objects. You can see below that while the orange light is casting an almost constant tone, the green light is giving more of a gradient:

You will note that the 'Other Lights Smoothing" is set to 0, meaning there should be a constant colour from the point light. I have even tried using a pure black/white ramp but the point light gradient remains.

It seems I will need to find the part in the code that deals with point lights and affects their colour based upon distance..
Perhaps I can get some assistance from Jean-Moreno?

 

hi there, first of all many thank for your work on this amazing shader it's a great one.

althought i'm confronted to a major problem. I'm working actually on an RTS game in witch you control littérally thousand of unit and basically we can't pass by the use of lightmap.

Do you think there is a way to reenable the compatibilty of this asset with it ?

this is what i need :

but once i bake the lightmap this is what i got :



do you think it's possible to by pass the problem, is there any way to get thing right ?

 

Glad to see that you've made lots of progress from your original post!
If you actually need to have a very fine control of the shading, I would suggest using the Shader Generator rather than the PBS shaders (unless you do need PBS features for your shading?). The issue could be that the stylization is built on top of the Standard shader PBS equations, which do introduce a lot of subtle variations that the Toony Colors shaders don't entirely get rid of.

The Shader Generator will produce surface shaders which can then be easier to modify. You'll also see an option to turn off Culling and enable accurate backface lighting (using the VFACE register rather than the view direction).
You also have the option to implement your changes to the template directly, so that any further generated shader will have your fixes (should you need other features available in the template).

 

As far as I know lightmaps are supposed to work with the shaders.
Can you tell me:
- which TCP2 shader you are using?
- what your lightmap settings are? (directional/non-directional, using pre-computed GI, etc.)
- which version of Unity you are using?
I'll then do some tests and see what results I get.
Thanks!

EDIT: note that the lightmap data can't be altered by TCP2 and as such will have realistic lighting calculations - TCP2 can provide stylized rendering with realtime ligths on top of the lightmap data.

 

Thanks I forgot this existed! Can I use the generator to create a shader that has 3 tones instead of a slider/ramp to save me from having to assign a texture ramp each time if I want more than 2 tones? [EDIT it doesn't look like it so I will continue using the ramp tex for now]

I went ahead and created a shader with the generator with cull off and alpha cutout.
The only problem is the alpha cutoff only works from the front but not the rear.
So any quads facing backwards have a nasty square grey background.

Standard PBS Cutout works correctly with Cull Off so I'll continue using this for now but if you can get Cutout working correctly with Cull Off in the generated shaders then I'll gladly switch to those if it removes the gradients on the point lights.

 

It's not built-in but it should be doable to implement that; you'd just need to replace the ramp code to support 2 smoothing and threshold parameters (shoot me an email if you need help with that and I'll see what I can do when I have some time!).
Also note that you can set default textures for Unity shaders in their inspector, when selecting the shader file directly.

I'll look into that, see if it can be fixed for the next update.

 

Thanks I was aware of the slots in the shader inspector but didn't realise they were defaults! The more you know.
I guess I can close this tab now since I don't really understand it anyway: http://http.developer.nvidia.com/Cg/smoothstep.html

It's quite genius that you included the shader generator; it sure beats schooling all us noobs on shader code

 

Just made a quick test and cutout works on both sides for me. Can you send me your material + shader (and their .meta files) in an email so that I can check your settings?
Also which version of Unity are you using?

 

I'm using 5.5.0f3
And I just realised there's another thread for the new version

I opened the shader that was created.
I see this line: s.Normal *= s.vFace; //is this meant to invert the normals when vface is -1?
It seems like it should work but doesn't work in practice.

Or is it in the surface shader that I need to make the change?
(actually I tried this and it broke everything)
o.Normal = IN.vFace > 0 ? UnpackScaleNormal(normalMap, _BumpScale) : UnpackScaleNormal(-normalMap, _BumpScale);
o.vFace = IN.vFace;

Ok, I realised I had outline turned on which created the box.
I've turned that off but I still can't get inverted backface normals despite making sure that box was checked.

See:

Also, what option do I check to enable ambient occlusion maps?
(and how would I apply occlusion to ALL lights? - presumably multiply by the occ value for lights if I can find the right section of the code - I only need this for backgrounds anyway that I don't want to be lit up by point lights as much)

 

First thank you for answering so fast.

- which TCP2 shader you are using?

i'm actually using a generated shader here a the settings




- what your lightmap settings are? (directional/non-directional, using pre-computed GI, etc.)

here are the settings



- which version of Unity you are using?

i'm actually using unity 5.5.0f3


thanks a lot for your help.

 

Found out it's an error in my code. You need to only multiply the normals' z component, so the code should be:

Code (shader):

1. s.Normal.z *= s.vFace;

I'll fix that in an update.

This option is not in the generator currently, but I should add it for the next update. When I made TCP2 Unity 5 was just released and I couldn't figure out how to make all the different ambient models to work in the shader, but I can probably pull this off now
I can also add an option so that it affects direct lights instead of ambient only.

 

Thanks! legend!

 

@lomen Ok I did some tests, and while the lightmaps do somewhat work with TCP2, there's no point in using a TCP2 shader when using a lightmap: the lighting calculations for generating the lightmap texture are internal to Unity and they will completely ignore the stylization parameters from TCP2, so there's no benefit in using TCP2 vs the Standard shader (where its parameters will actually influence the generated lightmap).
Note that this stands for static objects.

Dynamic objects would use light probes, and in my tests they do work with TCP2.

So I'm not entirely sure what to look at in your screenshots, were you talking about static scenery or dynamic moving objects not being lit correctly?
If you're still having issues, please send me a small test scene by email so that I directly look at the same thing as you!
Thanks

 

i sent you an email by the adresse on your website.

thanks in advance.

 

Hi! Got this warning with the new 5.6.0f3 release:

"Use of UNITY_MATRIX_MV is detected. To transform a vertex into view space, consider using UnityObjectToViewPos for better performance.
(Assets/JMO Assets/Toony Colors Pro/Shaders 2.0/Include/TCP2_Outline_Include.cginc)"

Just an FYI, not a big complaint or anything. BTW, just bought the asset last night, and couldn't be happier with it! I started recreating a scene from a favorite graphic novel, and it looks AWESOME! I'll make sure to leave a review after I spend at least a few more days with it.

 

I've just sent an update which should remove these (harmless) warnings; but let me know if you still get them!

Glad that you're enjoying TCP2!

 

Hi
"Water WindWaker2" seems to be having problems in my project. It looks fine in Scene view (see below) but in Game view in Editor or on device, it lacks the textures.

I'm targeting Android Google Cardboard with Unity 5.6.2 using Forward rendering, GLES3 with single-pass rendering. I'm working on Windows in case that's relevant. I've already added TCP2_CameraDepth to my camera.

Oddly when I switch the Scene view to Perspective, the same problem is visible.
If I switch the camera to explicitly using Deferred, it looks perfect. If I then switch back to "Use graphics settings", one texture stays but foam and depth do not.
When the problem is happening, I *very* occasionally see a slight hint of the correct dark blue in some places -- obviously related to the waves doing ... something!
If (after having fiddled with Camera render path) I toggle Scene view to Perspective, it shows same as game view?!
Here are some pictures of all of that (except the last).

Any help appreciated. Sorry if I've missed something obvious -- should this be expected to work?
Thanks!

Game view:


Scene view (Iso):


Scene view (Persp):


Game view after switching camera to Deferred:


Game view after switching back to "Use Graphics Settings":

 

It sounds like a depth texture issue, but I don't know why it would act that way.
Do you think you can send me a small reproduction project by email? This way I'll be able to dig into it and try to figure out what's wrong.

 

Thanks for replying. I'll try -- might take a few days (other commitments).

 

Had a little time. It's Unity Post Processing Stack! Adding it to the camera didn't cause problems. I assigned the "Profile" (to a blank profile I had just created), hit play and there goes the nicer water! (still not as bad as in my actual project -- the blue and white texture is still present but the foam and depth effects have gone).
I did note that the little info field on the camera indicating that it's rendering the depth texture disappeared. Perhaps there's yet some setting in there that will force depth back on? Or changing the order of something?
I've not investigated exactly what has caused it -- I've run out of time atm.
I'll e-mail the current project when I can.
HTH!

 

Sent DM with link to the project as it stands atm.

 

Doing a little searching, I found https://github.com/Unity-Technologies/PostProcessing/issues/33

 

Fixed! @Chman posted fix https://github.com/Unity-Technologies/PostProcessing/pull/173/files which I applied locally. Fixed the problem

 

Awesome! I didn't even have a chance to look at it
But good to know - I'll keep in mind to ask users about the post processing stack or other post effects if there are depth texture issues.
Thanks for the testing/solving!

 

Hi! I get this error message while enabling HSV control in my custom generated shader.

It seems like the variable "vcolors" is not defined in the shader code.

Code (CSharp):

1.  
2. //================================================================
3.         // SURFACE FUNCTION
4.  
5.         void surf(Input IN, inout SurfaceOutputCustom o)
6.         {
7.             fixed4 mainTex = tex2D(_MainTex, IN.uv_MainTex);
8.            
9.             //Hsv
10.             float3 mainTexHSV = rgb2hsv(mainTex.rgb);
11.             mainTexHSV += float3(_HSV_H/360,_HSV_S,_HSV_V);
12.             mainTex.rgb = lerp(mainTex.rgb, hsv2rgb(mainTexHSV), vcolors.a);
13.             o.Albedo = mainTex.rgb * _Color.rgb;
14.             o.Alpha = mainTex.a * _Color.a;
15.            
16.             //Rim
17.             float3 viewDir = normalize(IN.viewDir);
18.             half rim = 1.0f - saturate( dot(viewDir, o.Normal) );
19.             rim = smoothstep(_RimMin, _RimMax, rim);
20.             o.Emission += (_RimColor.rgb * rim) * _RimColor.a;
21.            
22.             //MatCap
23.             fixed3 matcap = tex2D(_MatCap, IN.matcap).rgb;
24.            
25.             o.Emission += matcap.rgb * mainTex.a;
26.         }
27.  

 

Thanks for the report. I've just submitted TCP2 v2.3.35 which should hopefully fix this issue! You should be able to update from the Asset Store soon!

 

Hi Jean! I just bought your shader and getting good result already. Any plan on getting outline to work with tessellation?

 

No plan currently. I did some tests with tessellation in the past, and the result was that it had issues with surface shaders (which is the underlying system for TCP2).
The outline itself is a regular vertex/fragment shader though, so that could work better... I'll see what I can do, no promises though.
That being said, I'm curious: why would you want tessellation on the outline only? What's the expected result?

 

I need something like this >> http://onoty3d.hatenablog.com/entry/2016/10/06/210709
I just want player can see curvy toonline up close instead of angular polygon edge.

 

FYI: I started to do some tests with tessellation. It adds some complexity to the shaders, and I know that it has some incompatibilities issue with surface shaders (the underlying system that TCP2 uses), but hopefully I can add basic support for it sometime.
Unfortunately I can't give any ETA right now.

 

Hello.
Thank you for a nice asset.

The shader does not work well.
I have a question about that.

I want to reset TC2.


There is an image of the sample scene that is included in the asset.

We are switching the "Style" button. However, I can not see any changes in the shader.
Style 6 is selected in the image.


It changes slightly, but it seems that most of it does not work.

Once I deleted the asset and imported again.
But the results will not change.

Probably I think I mistook something.
It worked normally until yesterday.

I would like to reset the asset once, but can I?

We are using Unity 2017.2.0 f 3,
The version of TC2 is 2.3.382.
It is today that overwrote this version.

Thank you

 

From your screenshot, it seems that the shader used is not Toony Colors Pro 2 but the Legacy Diffuse one (you can see some white objects which are supposed to be colored from their vertex colors).
My guess is that the shader couldn't compile successfully or couldn't run properly on your hardware for some reason.

Some things you can try:
- import TCP2 in a new empty project and see if it works there (I just tried that with Unity 2017.2.0f3 to verify and everything works on my end!)
- verify that no graphic emulation is active (top menu: "Edit > Graphics Emulation > No Emulation")
- right-click on the TCP2 folder and click on "Reimport", this will recompile the shaders which sometimes help in these situations
- select one of the demo shader and see if you see any warning or error message in the inspector (for example select "JMO Assets/Toony Colors Pro/Demo TCP2/Cat Demo Assets/Shaders/Cat/Style 1")

Let me know how it goes!

 

Thank you for your reply!

I understood the cause.

The setting of RenderingPath of the camera was changed.
This was the cause.
There is nothing wrong with TC2.

really sorry.
The shader is now correctly displayed.

Thank you for dealing with my minor mistake in good faith.

 

AO and Custom Ambient aren't working. I use Unity 2017.3.0f3. Anyone have the same issue?

 

I've found issues with those and a fix will come in the next version (2.3.39).

 

Great!

 

Will these shaders work in Console builds? (PS4, Xbox One and Switch)

 

PS4 should work as far as I know, and hopefully the other platforms too (TCP2 uses Unity's surface shaders under the hood so they should work fine if surface shaders are supported for these platforms - I'm pretty sure that's the case for Xbox One, I don't know about the Switch though as I have no experience on that platform).

But if there's any issue, I'll definitely help to fix them.
And I'd love to see TCP2 shaders in a Switch game

 

Thank you for the fast and excellent reply!

 

Hey one other quick question: do these shaders support instancing? I see the "enable instancing" checkbox at the bottom, but just verifying that it actually works. Not sure if you've tested that. Thanks

 

Yes I did some tests to ensure it was working back when I worked on supporting instancing. It did work at the time, but if it doesn't anymore in newer versions of Unity let me know.

Also if you want to have per-instance properties, you'll have to modify the code manually (as explained on Unity's doc page: https://docs.unity3d.com/Manual/GPUInstancing.html); it's not very complicated, but just something to keep in mind! (especially if you use the Shader Generator and update the shaders from time to time)

 

I was just wondering if you are planning to support the new Scriptable Rendering Pipeline??