Cartoon Shader Additional FX

Purpose of implementations

  • Simple transmittance FX for toony rendering.
  • mesh attribute based shade expression.
  • Bloom and tone-mapped for toony rendering look-development.

This character model from XRD game data not my own works.
这个来自XRD游戏数据的角色模型不是我自己的作品。


左边是一般的Cartoon rendering。

右边显示的是接近于最近日本动画色调的渲染结果。

虽然美术们认为Tone Mapping主要用于具有真实效果的渲染效果中,但是在最近制作的日本动画渲染技巧下,即使是2D,也往往会使用HDR的情况很多。根据这种趋势,使用Tone Mapping、Bloom和Exposure方法,会得到更有高级感的产物。

最近在日本动漫中甚至还出现了使用Reflection Mapping的情况。

Left is a typical Cartoon rendering.

The right side renders closer to the more recent Japanese animation tones the results are shown.

Most artists think that Tone Mapping is only used for realistic renderings, but even if you look at the recent Japanese animation rendering techniques, it is often 2D, but HDR is used. You can get a more luxurious result.In recent Japanese animations, reflection mapping may be used.

Light Transmitted scatter Shadow Color.

When the character is back-lit, the light is transmitted through the light direction and the depth value deliberately set.Light Transmitted scatter Shadow Color.


从光线进入的方向开始,亮的一边轮廓越薄,越往暗处就会越厚。

它被称为Light Space Outline,但仅仅使用贴图信息控制的话会缺乏空间感,因此追加实现。

From the direction the light comes in, the lighter outline becomes thicker and thinner toward the darker side.It’s called Light Space Outline, but it lacks the space to control texture information alone.

None light-space outline
light-space outline

太平面的卡通shader会看起来像以前的方法,但是通过调整NL和NV,获取信息,最后修正照明模型。
明亮的头发部分的头发产生体积感,阴影部分也会产生不显眼的体积感。

Too flat cartoon shaders look a bit like an old technique, where N〮L and N〮V are transformed to capture information and finally modify the lighting model.Looking at the hair on the bright side, the volume was created, and the shadowed area was not too unobtrusive.

code block

This is a comparison of before and after.

太平面的卡通shader会看起来像以前的方法,但是通过调整NL和NV,获取信息,最后修正照明模型。
明亮的头发部分的头发产生体积感,阴影部分也会产生不显眼的体积感。

Before and After

Categories: shader

Tagged as: , ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s