Hello everyone.
I’m looking for the art style for the next game I’m making, and I was struck by the beauty of this stuff:
So, I’m starting to research how to obtain something similar by using shader lab. Unfortunately I know very little about shaders (I can make a diffuse shader, read textures and just a little bit more), so, I’m asking some help.
I would like, in first instance, to consider the building and the mountains. First step for me could be a way to reproduce that kind of flat shading with only a main color and a shadow color. I guess something with a ramp texture could help, but I really don’t know where to start.
The second step could be that of using a dither to replace the shadow of some objects (like you see in the mountains), and here I’m even more puzzled about how doing this.
So, what I’m asking you in first place is some advice. What should I be looking into to achieve a result similar to the image? Are there any resources I could read to have a clearer idea of what I need to do with the shaders? Every link would be precious for me at this point.
You’ll want to replace the default smooth shading model that is used (Lambert or blinn-phong), with a custom one. If you still want to use surface shaders, in stead of fragment + vertex shaders, take a look at this page.
For the dithered shadows effect, you could take a look at how this Cross-Hatched shading effect was created (The author mentions this paper by Emil Praun et al). However, it looks like that particular shader only allows one light source, using standard shader properties (The lighting code is built into the vertex shader, in stead of being placed into a separate function to be called as a Surface Shader Lighting Model)
That cross hatched shader is still relative smooth, while those trees look like they’re flat shaded, so you can probably create a much simpler effect.
Thank you!
I guess that would be no problem in using just one light source. That said, I might have to study a bit surface shaders (I don’t know much about them) and probably use something like a ramp shader with just two colours (the original one and the shadow) to obtain the simple shading I’m looking for. The dither appears to be a more complex affair (well, right now for me even the surface shader is a bit complex :P) but the shader you pointed me to is EXTREMELY cool.
Played a bit with shaderlab and did a little research today. I guess I’m still a bit confused.
Let’s say that I want to make a simple shader in the style of the image above. Let’s forget the dithering, for now, I guess is a quite difficult effect to achieve.
Just a color with a shade, nothing more than that. Vertex/Fragment I guess. What should I look for? Thanks!
Basic smooth lighting is pretty well explained in the NVIDIA Cg Tutorial.
It’s sometimes referred to as NdotL, because the amount of light that an object gives off in a ‘diffuse’ manner, depends on the angle between the surface (or actually it’s Normal) and the light sources (ignoring actual shadows for now), which you can calculate by taking the dotproduct of the surface Normal (N) and a vector that points towards the light source (L).
That calculation has a smooth falloff, but you could also say that something is solid black (or orange, if you wanted to), when it is angled away more than a certain amount from the light source.
A surface shader hides that work for you, and calls a function that calculates the shading/lighting for each light (usally LightingLambert or LightingBlinnPhong, which you can find in Lighting.cginc in “[Unity Install folder]\Data\CGIncludes”).
So, you can either experiment by creating modified lighting functions and seeing what happens, or you can learn more about writing shaders first, by following the Nvidia Cg tutorials.
Check the toon shadows shader in nvidia library. That will give you the same effect if you adjust it properly. I also will include it in one of my packs in near future. This one needs your shapes to have 3d normals(Not 2d planes) in order to work though.
If you have some models in this style, send them at ippobour at gmail dot com and I will show you how to use toon shaders from my sig to achieve this effect.
Kind regards,
Ippokratis
