Hey There!

I'm Jan :D

I have always enjoyed working in multiple disciplines and understanding how each department influences one another. Blending artistic freedom with technical understanding would be what I personally strive to achieve with my work.

YouTube video preview image
Technical Artist

designmatic GmbH

September 2024 - September 2025

Started as a Technical Artist intern working on the game's uber shader in HLSL, fullscreen effects and visual effects in Unity.

Ayna: Shattered Truth

Developed certain key features for the uber shader in HLSL

Developed various full screen effects in HLSL and C#

Developed various minor visual effects in VFX Graph

Custom Toon Shading System

Created custom noisy toon shading effects for all punctual light types and screen space shadows.

Toon Shaded Lights + Shadows Feature

  • The art direction of the game is a stylized toon shading resembling ink, so the projection of lights and shadows on objects had to be adjusted to divert from the standard soft shading.
  • For the sake of simplicity and optimization, all functions are written in HLSL
  • The toon steps are calculated by flooring the dot product of the light's direction and the objects world space normals by a parameter.
  • Noise effect is sampled from a noise texture and added onto the toon effect.

Implemented stylized SSAO for the environment

Stylized Ambient Occlusion Feature

  • The standard soft shading of the screen-spaced ambient occlusion had to be adjusted into harder edges resembling shadows drawn in ink.
  • The screen-spaced ambient occlusion map is stepped at an adjustable range for the crevices of environmental objects.
  • Characters have an additional shading step before the darkest areas of the AO to allow more details on the character to remain visible.

Implemented custom specular highlight and metallic effect as well as toon shading for the SSAO.

Custom Toon Metallic Feature

  • The specular and metallic feature had to be written from scratch in HLSL to allow for its customization.
  • Specular highlight is calculated following the light's direction and stepped at different ranges and added together to create the toon shading effect.
  • The metallic feature takes the light's direction, the surface normals, along with the object's roughness map to simulate metal-ness.
  • Adding reflection on the metallic surface would be the next step to finish up the feature.

Implemented vertex animation function for vegetation, rope and cloth.

Vertex Animation Feature

  • Vertex animation was implemented as a cheaper alternative to using physic bodies on multiple objects.
  • A simple hash is used to offset the swaying motion of each mesh depending on it's position in world space to prevent uniformity.
  • Each object type has its own calculation to best portray their movements.
  • Rope and Cloth requires the object to have a vertex color map to be used as a mask.

Full-screen Effect

Hut Fade-In Effect

  • A fullscreen effect was developed in C# and HLSL that fades the rest of the background into black as the player enters a building.
  • As the game uses Unity's HD render pipeline, the effect was implemented by adding a custom pass volume in the scene that references a full-screen custom pass shader.
  • The full-screen custom pass shader takes the copy of the camera color buffer, fades it to black via a noise texture and renders it around the target building.
  • The wall dissolve effect was originally a separate shader made in a node-based editor, but for the sake of optimization, the function was ported into the custom uber shader so the whole game just has to load one shader for the majority of the assets.
  • The effect runs when the camera enters the trigger volume that kickstarts the animation for both the full-screen effect and the wall dissolve effect.

Visual Effect

Tombstone VFX

  • VFX Graph was used due to the complexity of the design plus the ability to loop each particle effect sequentially.
  • The whole effect can be broken down into 3 parts:
    - Constants -- Glow + Coin meshes + Minor white circling swirls
    - Stage 1 -- Fire swirl
    - Stage 2 -- Water splashes and white upward swirl
Built with Webstudio