SSR Car Template

SSR Car template is a Kanzi project template that demonstrates screen space reflections (SSR) and directional shadow mapping in a studio-environment car showcase scene. The template extends the Car Template by replacing its planar reflections and morphed fake shadow with a hardware directional shadow map and a multi-pass SSR pipeline. It also introduces an animated roof mechanism with morph-based animation and a power bar visualization.

../_images/ssr-overview.png

This template is available from Kanzi Studio 4.1.0.

3D vehicle visualization

The template provides the same detailed, modular 3D car as the Car Template, with independently animatable parts:

  • Four doors (front-left, front-right, rear-left, rear-right), each with glass, mirror, and interior geometry

  • Hood and trunk

  • Windshield wiper

  • Four wheels (front-left, front-right, rear-left, rear-right), each with brake caliper, brake disc, hub, tire, and wheel mask geometry

  • Front and rear light groups: headlights, daytime running lights (DRLs), fog lights, turn signals, brake lights, reflectors, and trunk lights

  • Charge ports on both sides, indicating an electric vehicle

  • Interior cabin with an instrument cluster display screen

Roof animation

The template includes an animated roof mechanism built from the Roof_Sliced prefab. The roof uses three morph targets (Morph, Morph_1, Morph_2) driven by morph animation clips to produce a sliced opening and closing motion.

A power bar visualization rendered with the PowerBar_Roof shader accompanies the roof animation. The PowerBar_Status state manager controls the power bar state, and dedicated lightmaps (Roof_Lightmap and Roof_Slices_Lightmap) provide pre-baked lighting for the roof geometry.

Interactive UI controls

A 2D HUD overlaid on the 3D viewport provides five control panels, all using a consistent toggle button style:

  • UI Controls Color: carpaint selector with six options (Black, Blue, Green, Orange, Silver, and White)

  • UI Controls Environment: lighting environment selector

  • UI Controls Vehicle: toggles for doors (open/close), head lights (on/off), and trunk (open/close)

  • UI Controls View: camera view selector with two positions (Exterior Near and Interior)

  • UI Navigation: main navigation menu with tab groups for Color, Environment, Vehicle, and View

Panels transition with an Activity Slide In/Slide Out animation when the user switches between tabs.

Camera views

The CameraRoot state manager manages two camera positions, accessed through a Scroll View 2D node with a Viewport inside:

  • Camera Position Toggled - Near: close-up exterior view

  • Camera Position Toggled - Interior: view from inside the cabin

Environmental effects

The scene surrounds the car with a studio/day environment:

  • HDRI environment maps: Environment_Day for scene lighting and Environment_Studio_Reflection for specular reflections on the car body

  • A background mesh with a Textured material rendering the sky

  • A marble floor mesh (Ground) with fitting material type (Ground_Material) surrounding the car

  • Directional lights inside the Environment node providing lighting and shadows

Screen space reflections

The SSR Car template replaces the planar-reflection system of the Car Template with screen space reflections. SSR calculates reflections from the information already rendered to the screen, without requiring additional geometry or environment probes.

Materials that receive SSR use an adjusted physically based shader. The associated Material Type exposes a preprocessor definition called KANZI_SHADER_RECEIVE_SSR_BLIT that controls whether SSR is active for that material. The shader writes these outputs for the SSR render pass:

  • Output 0: Color (default render target)

  • Output 1: Normals

  • Output 2: Mask

The SSR render pass uses the Normals and Mask outputs to calculate the reflections and composites the result as a full-screen blit.

To control SSR intensity per node, set the ScreenSpaceReflectionStrength property on nodes such as the car paint and floor.

Shadow mapping

The SSR Car template replaces the Car Template animated ShadowMorph fake shadow with a hardware directional shadow map. A ShadowPivot directional light node contains a ShadowCamera child node that defines the shadow frustum.

The ShadowPivot node exposes these properties:

  • Directional Shadow Bias: controls the shadow bias to reduce self-shadowing artifacts

  • Directional Shadow Softness: controls the softness of shadow edges

The ShadowCamera node exposes these properties:

  • Z Near and Z Far: define the depth range of the shadow camera frustum

  • Orthogonal Plane Size: sets the size of the orthographic projection used to generate the shadow map

The render pass generates the shadow map and provides it as input to the scene materials via the Directional Shadow Map input.

Advanced rendering

The template uses physically based rendering (PBR) throughout. The SSR Car template uses screen space reflections instead of planar reflections, so there is no separate Car Reflection prefab or CarReflection render target.

PBR materials cover every car surface: PhysicallyBasedClearCoat for carpaint, PhysicallyBased_Glass for windows and glass surfaces, and specialized materials for Chrome, Mirror, Plastic, Plastic_Gloss, Rim, Rim_Rough, Rubber, Tire, Normal_Brake_Disc, and Calipers.

A ColorGrading_Blit post-processing pass applies color grading to the final output.

State managers

Six state managers coordinate the scene:

State manager

Purpose

Car State Manager

Controls car part animation and overall state.

Car Color State Manager

Switches the carpaint color across all body materials.

CameraRoot State Manager

Manages the active camera position (Near or Interior).

PowerBar_Status

Controls the state of the roof power bar visualization.

UI Toggle State Manager

Manages UI Toggle Button visibility.

Activity UI - Fade to Left

Drives the UI panel transition animation.

Prism Graph

The SSR Prism Graph defines a render pipeline through a visual node editing tool. It sets up the following three branches in the graph and combines them in a Blit Node:

  • Scene Rendering: renders the scene with multiple outputs for ssr calculation (color, normal, ssr mask, depth)

  • Shadow Map: renders directional shadows for the scene

  • SSR: uses the scenes color, normal, and depth output to calculate full-screen ssr

  • Final Blit: applies tonemapping and ssr based on the ssr mask

See also

Car Template

Advanced Drive Mode Template