Intro

Cel-shading or “toon shading” is an intentional non-photorealistic rendering that is generally used to make 3d graphic content appear with flat colors. 

A common theme of cel-shading which gives it that effective cartoon animation look is the use of bold outlines.

Open

Cel shading is supported by two separate material components, the main difference being the amount of fine-tuning and detail control needed for a particular look:

• Dual-tone cel-shading has a set of parameters to control Diffuse intensity, Specular highlights, and Edges.

• Multi-tone cel-shading that uses textures to control Diffuse intensity, Specular Highlights, and Edges in far more fine detail.

Edge outline

The Animaze shader implements two outline methods that can be used simultaneously:

1. Dot-based edge detection - the edges of the same surface are darkened. This method uses the dot product between the surface normal and light direction and decides based on a threshold if a pixel is on the outline of the rendered mesh or not.

2. Expanded shell / Outline shell - the darkened outline is rendered on the exterior of the surface

Currently, both outline methods render a darkened outline, there is no support for tinted outlines.

Cel shading (no textures) - Dual Tone Cel Shading

• it can be added in Animaze Editor as mesh component

Open

Diffuse Threshold - light intensity threshold that decides between applying 1st and 2nd tone diffuse intensities

Diffuse minimum value - 1st tone diffuse intensity value

Diffuse maximum value    - 2nd tone diffuse intensity value

Specular Threshold - light intensity threshold that decides between applying 1st and 2nd tone specular intensities

Specular minimum value - 1st tone specular intensity value

Specular maximum value - 2nd tone specular intensity value

Edge Threshold - threshold used by the dot-based edge detection method

Edge minimum value - the intensity of the surface that is not the edge (factorizes the diffuse and specular tones

Edge outline width -  used by the expanded shell/outline shell method. Controls the size of the outline. Currently, the edge is always black.

Cel shading w/ texture - Multi-tone cel-shading

Multi-tone cel-shading enables a finer detail of the rendered surface through use of various textures, that control the intensities of the diffuse, specular tone, and dot-based edge detection.

Diffuse Tones Texture

• The grayscale texture that maps light intensity (u coordinate) to diffuse tone intensity (texel color).

Texture used

Texture used

Texture used

• Animaze shader samples a single row, so the size of the texture can be width x 1 pixel

• Supports fine details by choosing to build the texture with steps or gradients

Texture used

Texture used

For maximum cel-shading effect make sure to use point filtering on texture (by default Animaze imports textures with linear filtering)

Specular Tones Texture

The grayscale texture that maps light intensity (u coordinate) to specular highlight tone intensity (texel color).

• Animaze shader samples a single row, so the size of the texture can be width x 1 pixel

• Supports fine details by choosing to build the texture with steps or gradients

Texture used

Texture used

For maximum cel-shading effect make sure to use point filtering on texture (by default Animaze imports textures with linear filtering).

Edge Tones Texture - used for the dot-based edge detection

The grayscale texture that maps the dot product between surface normal and light direction (U coordinate) to edge tone intensity (texel color).

Texture used

• Animaze shader samples a single row, so the size of the texture can be width x 1 pixel

• Supports fine details by choosing to build the texture with steps or gradients

Texture used

Texture used

For maximum cel-shading effect make sure to use point filtering on texture (by default Animaze imports textures with linear filtering). 

Edge outline width - used by the expanded shell/outline shell method. Controls the size of the outline. Currently, the edge is always black.