Download

How can I make a material/postprocessing effect to acheive ink shading like game Okami?

Hi all.
I am wonder how can I make the graphics like in a game Okami.
The graphics seems not exactly normal toon shading.

ref img:
okami+5.jpg

Any ideas or guides?

Thank you.

there already is a sample project on the market that you can tweak to achieve this sort of artstyle. https://docs.unrealengine.com/latest/INT/Resources/Showcases/Stylized/PostProcessing/

There is a trick behind it, I am unsure if I can properly explain it though there are several things to take note of:
1- The texture used needs to convey an effect that matches the cell shading effect (See Boarder lands, Ni No Kini, Tell Tale - The Walking Dead, sly cooper), each comes with a unique texture style and is consistent through out.
2- The Mesh or the skeletal mesh can be duplicated, expanded and flipped to face inwards and an unlit material can be applied to it so it would give the illusion of an outline.
3- Post processing can be used to achieve two effects that might help (Outlines, Texture overlay effect, where it would look like the game has been drawn on top of a canvas).

The following steps uses a sphere as an example but it can be done with about any model you desire, Please read on:

On the modeling software
1- Create a sphere.
2- Create a slightly bigger sphere and flip the Normals of that bigger sphere (Basically you flip the faces that are facing outwards to face inwards).
3- Apply a material on the small sphere and another material on the larger sphere.
4- Export both spheres as a single object.

In Unreal Engine
1- Import the Spheres.
2- Create a simple material (Anything would do).
3- Create another material with the following option (Unlit), then add black to the emissive (you could add the color that you want)
4- Apply the first material (step 2) to the small sphere, and the unlit material (step 3) to the outer material.
5- You should now see an outline effect on the sphere.

Hope this helps

Just add the lines in the texture. That way you both save performance and you’ll have 100% control on the look.

This is rather useless because in actual cellshader/toon ink the dark lines are only visible depending on the angle as well as lighting situations.
Actually adding them into the texture makes it look wrong, fake, and boring.

You do have a point. A shader is needed to get the best outlines. My suggestion is probably not what you were looking for…

I Loved that game! :slight_smile:

I’m sure they are doing a bunch of different things to massage the image into what they got. It is a really nice look.
You’d want to break it down and see how you can achieve each aspect.
What I see,

  • Hand painted watercolour’y surface textures. These are important for the look and it wouldn’t be the same with just flat colors or say procedurally (noise) generated texturing.
    Notice the ‘paper’ texture that is blended in.

  • Soft lighting. No deep shadows. You could start by trying just having a quite bright Sky Light which is non shadow casting to fill the scene with light. Then slightly shade with directional ‘sunlight’.

  • Outlines. Two ways to do these are, simple manipulated fresnel/facing ratio. These don’t look good on large flat surfaces with acute angles to the viewer.
    Depth buffer style. These are cool I have never made one but seem to look a little ‘hard’ and technical. Maybe you could calculate them with a bit of displacement to to vertexes?
    http://www.tomlooman.com/outline-effect-in-unreal-engine-4/
    Tutorial – Creating outline effect around objects | Unreal Engine 4 blog

EDIT: Also the modelling of the meshes is in itself painterly. Check out the branches on those trees.
‘NPR’ is a good googling word.

Cheers
Fred

For the outlines, set up a Fresnel in your material shader, and use it to lerp a black outline into your base colour.

Then i would play with your global post process to make the colours pop more.