Shaders

Use Shaders to produce appropriate levels of light and color within an image, to produce special effects, or to do post-processing.

Shaders in Kanzi are based on the OpenGL ES shading language.

Each material type in Kanzi comes with shaders that define the shading algorithm:

../../_images/vertex-shader-icon.png

Vertex Shader processes individual vertices.

The source file of a Vertex Shader has the extension .vert.glsl.

../../_images/fragment-shader-Icon.png

Fragment Shader processes each fragment.

The source file of a Fragment Shader has the extension .frag.glsl.

When your Kanzi Studio project targets OpenGL ES 3.2, you can create also these shaders:

../../_images/geometry-shader-icon.png

Geometry Shader processes primitives.

The source file of a Geometry Shader has the extension .geom.glsl.

../../_images/tessellation-control-shader-icon.png

Tessellation Control Shader determines the amount of tessellation for a primitive and performs transformations on the input patch data.

The source file of a Tessellation Control Shader has the extension .tesc.glsl.

../../_images/tessellation-evaluation-shader-icon.png

Tessellation Evaluation Shader uses the abstract coordinates generated by the primitive generator to compute the values for the vertices.

The source file of a Tessellation Evaluation Shader has the extension .tese.glsl.

See Using geometry shaders and Using tessellation shaders.

In Kanzi Studio projects, shader programs are stored as files on the computer hard drive. When you add shaders to the <KanziWorkspace>/Projects/<ProjectName>/Shaders directory of your Kanzi Studio project, Kanzi Studio automatically shows them in the Library > Resource Files > Shaders.

You can find the shaders that come with Kanzi in <KanziInstallation>/Studio/Asset Library/MaterialTypes:

  • Common directory contains material types with general purpose shaders. These shaders are suitable for prototyping and are not optimized for performance. See General-purpose shaders.

  • FragmentPhong directory contains material types with pixel-based Phong shaders. See Pixel-based Phong shaders.

  • PhysicallyBasedRendering directory contains material types with physically-based shaders. See Physically-based shaders.

  • Unlit directory contains material types with shaders that do not use lights. See Unlit shaders.

  • VertexPhong directory contains material types with vertex-based Phong shaders. See Vertex-based Phong shaders.

You can also write your own shaders. See Editing shaders.

In Kanzi, you can also use binary shaders. Binary shaders are shader programs that you pre-compile with compilers provided by hardware manufacturers before the application passes them to the device GPU. This enables your target device to load your application faster. See Using binary shaders.

General-purpose shaders

The <KanziInstallation>/Studio/Asset Library/MaterialTypes/Common directory contains material types with general-purpose shaders. These shaders are suitable for prototyping and are not optimized for performance.

ColorTexture

Displays colored texture data.

../../_images/color-texture.png

CubemapSkybox

Displays a cubemap texture as a skybox. See Using a cubemap texture as a skybox.

../../_images/cubemap-skybox.png

DefaultBlit

Default shader used by the Blit Render Pass. See Rendering.

../../_images/default-blit.png

DefaultCubemapMipmapFilter, DefaultDepthMipmapFilter, DefaultMipmapFilter

Default shaders for customizing the mipmap generation of composition targets. See Creating mipmaps for composition targets.

FontDefault

Renders text font. This shader combines the glyph texture with font color and displays the output. You can use it with the Text Block and Text Box nodes. See Using the Text Block nodes and Using the Text Box nodes.

../../_images/font-default.png

MaskTexture

Displays texture data where one texture masks another texture.

../../_images/mask-texture.png

SweepTextures

Displays texture data with a transition from one texture to another.

../../_images/sweep-textures.png

Textured

Displays texture data. See Textures and Creating textured materials.

../../_images/texture.png

Pixel-based Phong shaders

The <KanziInstallation>/Studio/Asset Library/MaterialTypes/FragmentPhong directory contains material types with pixel-based Phong shaders for use with OpenGL ES2. Most of the GPU specific computation, including applying lights using the Phong reflection model, is done in the fragment shader. This offers better image quality often at the cost of performance.

FragmentPhong

Implements the Blinn-Phong shading model. By default this shader supports one directional, one spot light, and two point lights. The shader calculates the lighting for each fragment.

../../_images/fragment-phong.png

FragmentPhongCube

Displays a cubemap reflection, calculated from the view vector and reflection of the surface normal, and combines the result with the Phong shading.

../../_images/fragment-phong-cube.png

FragmentPhongMorph

Enables morphing. See Using Morph resources.

../../_images/fragment-phong-morph.png

FragmentPhongSkinned

Displays skinned mesh data. See Using skinned meshes.

../../_images/fragment-phong-skinned.png

FragmentPhongSkinnedMorph

Combines the FragmentPhongMorph and FragmentPhongSkinned shaders.

../../_images/fragment-phong-skinned-morph.png

FragmentPhongTextured

Displays texture data you can use on 3D nodes. See Textures and Creating textured materials.

../../_images/fragment-phong-textured.png

FragmentPhongTexturedCube

Combines the FragmentPhongCube and FragmentPhongTextured shaders.

../../_images/fragment-phong-textured-cube.png

FragmentPhongTexturedNormalMap

Displays skinned mesh data. See Using skinned meshes.

../../_images/fragment-phong-textured-normal-map.png

FragmentPhongTexturedCubeNormalMap

Combines the FragmentPhongTexturedNormalMap shader with cubemap reflection, calculated from the view vector and reflection of the surface normal.

../../_images/fragment-phong-textured-cube-normal-map.png

FragmentPhongTexturedSkinned

Combines the FragmentPhongSkinned and FragmentPhongTextured shaders.

../../_images/fragment-phong-textured-skinned.png

FragmentPhongTexturedSkinnedMorph

Combines the FragmentPhongMorph, FragmentPhongSkinned, and FragmentPhongTextured shaders.

../../_images/fragment-textured-phong-skinned-morph.png

Vertex-based Phong shaders

The <KanziInstallation>/Studio/Asset Library/MaterialTypes/VertexPhong directory contains material types with vertex-based Phong shaders optimized for use with OpenGL ES2. Most of the GPU specific computation, including applying lights using the Phong reflection model, is done in the vertex shader. This is a good starting point for most devices.

VertexPhong

Implements the Blinn-Phong shading model. By default this shader supports one directional, one spot light, and two point lights. The shader calculates the lighting for each vertex.

../../_images/vertex-phong.png

VertexPhongCube

Displays a cubemap reflection, calculated from the view vector and reflection of the surface normal, and combines the result with the Phong shading.

../../_images/vertex-phong-cube.png

VertexPhongMorph

Enables morphing. See Using Morph resources.

../../_images/vertex-phong-morph.png

VertexPhongSkinned

  • Displays skinned mesh data. This shader transforms vertices based on multiple transformations and weights, and combines the result with the Phong shading.

  • If you define the matrix palette and weights in a third-party content creation tool, they are part of mesh attributes.

  • This shader is not compatible with geometry that does not contain skin data (matrix palette and weights) in mesh data.

See Using skinned meshes.

../../_images/vertex-phong-skinned.png

VertexPhongSkinnedMorph

Combines the VertexPhongMorph and VertexPhongSkinned shaders.

../../_images/vertex-phong-skinned-morph.png

VertexPhongTextured

Displays texture data you can use on 3D nodes. See Textures and Creating textured materials.

../../_images/vertex-phong-textured.png

VertexPhongTexturedCube

Combines the VertexPhongCube and VertexPhongTextured shaders.

../../_images/vertex-phong-textured-cube.png

VertexPhongTexturedMorph

Combines the VertexPhongMorph and VertexPhongTextured shaders.

../../_images/vertex-phong-textured-morph.png

VertexPhongTexturedSkinned

Combines the VertexPhongSkinned and VertexPhongTextured shaders.

../../_images/vertex-phong-textured-skinned.png

VertexPhongTexturedSkinnedMorph

Combines the VertexPhongMorph, VertexPhongSkinned, and VertexPhongTextured shaders.

../../_images/vertex-phong-textured-skinned-morph.png

Physically-based shaders

The <KanziInstallation>/Studio/Asset Library/MaterialTypes/PhysicallyBasedRendering directory contains material types with physically-based shaders intended for OpenGL ES3 applications. These shaders implement physically-based rendering (PBR) principles. The properties of physically-based materials represent physical properties, such as metalness, and are therefore intuitive to control. Most of the GPU specific computation, including applying lights using a physically-based lighting model, is done in the fragment shader. This offers a more realistic rendering result in many lighting conditions.

PhysicallyBased

Implements a physically-based shading model and by default enables:

  • Setting roughness and metalness

  • One directional, one spot light, and two point lights

  • Base color alpha

  • Reinhard tone mapping

../../_images/physically-based.png

PhysicallyBasedClearCoat

Uses physically-based rendering to render a material covered with a clear coat. This is commonly used for vehicle paint.

../../_images/physically-based-clear-coat.png

PhysicallyBasedMorph

Enables morphing with 3 targets by default. See Using Morph resources.

../../_images/physically-based-morph.png

PhysicallyBasedSkinned

Enables skinning of meshes with up to 64 bones by default. See Using skinned meshes.

../../_images/physically-based-skinned.png

PhysicallyBasedTextured

Enables the use of textures that contain the base color, normal, roughness, metallic, and occlusion maps, and the light emitted from the material. See Creating a physically-based textured material.

../../_images/physically-based-textured.png

PostProcessTonemap

Full-screen post-processing material which by default applies Reinhard tone mapping.

../../_images/post-process-tonemap.png

Unlit shaders

The <KanziInstallation>/Studio/Asset Library/MaterialTypes/Unlit directory contains material types with shaders that use the unlit shading model defined by the KHR_materials_unlit glTF extension. The unlit shaders provide an alternative to physically-based shaders, which you can use for performance or aesthetic reasons. For example, you can use unlit materials to achieve a “hand-drawn” look where you do not want lighting.

Unlit

Implements an alternative to the physically-based shading models without lighting calculations, tone mapping, and extraneous texture maps and factors.

../../_images/unlit.png

UnlitMorph

Enables morphing with 3 targets by default. See Using Morph resources.

../../_images/unlit-morph.png

UnlitSkinned

Enables skinning of meshes with up to 64 bones by default. See Using skinned meshes.

../../_images/unlit-skinned.png

UnlitTextured

Enables the use of textures for an unlit material.

../../_images/unlit-textured.png

See also

Shaders best practices

Using binary shaders

Optimizing fragment shaders

Reducing shader switches

Editing shaders

Using OpenGL ES 3.0+ in Kanzi

Material types and materials

Using the light nodes