Shaders | tashkeelshah-techart

Personal Shader Work

I've included below a few Shaders I've made.

Hologram Shader

This was a shader I made in the process of teaching myself HLSL code, specifically using Unity's Shaderlab. I wanted to achieve a few things with this shader:

1) Use minimal textures. Though I feel I could have made the scanline effect without any textures, I chose to stick with a texture, so the look could be more easily tweaked.

2) Modify vertex positions to animate the effect

3) Make the shader scalable with static toggles, so certain effects could be turned off and not compiled

Below are a couple of functions I used in this shader. The full shader code is available to download further down.

The 'PulseLine' function returns a single thin gradient line which is used later to slide down the length of the object.

The 'glitch' function returns essentially a parameterized pseudo-random number to offset vertices for the intermittent glitch that happens in the effect. This is encased in a compiler time 'if' check, and will be removed from the compiled code if a user unchecks 'Use Vertex Offset' (see below).

Here is a snapshot of the inspector for the material.

I exposed parameters for scrolling and tiling of the scanlines, Fresnel control, and vertex offset control.

The 'Use Vertex Offset' Toggle controls whether the shader code pertaining to vertex animation will compile, in case it is undesired.

You can download the full shader code here:

Mobile Refraction Glass Shader

$refractionExample.gif$

Another written shader, I made this mostly as an exercise in optimization. A lot of the work I do tends to be for mobile platforms, or otherwise lower-end target hardware. And it's really difficult to find a decent looking refraction shader that doesn't kill performance on some platforms.

So this shader is mostly cannibalized from code found in Unity examples and such (the refract function used is straight up Unity's HLSL implementation), but it does run pretty well on mobile hardware.

As an example, I did a mobile VR benchmark test on the Oculus Quest; in the simple scene above, where this shader was hitting the target 72 fps, an asset store alternative which looks similar tanked the scene down to ~40 fps.

As this one is a surface shader, it was pretty trivial to have a normal map input as well.

One thing to note is that it uses a Grab Pass from Unity (in order to calculate the refraction more easily) so there is definitely still room for improvement, but for now I've left it there.

And again, here is the shader code available to download and peruse:

Laser Dissolve Shader

This shader was created with Amplify Shader Editor, which is a node-based editor to create custom shaders. My goal with this was to have a controllable paramaterized effect that could be used in a practical way. The effect comprises of 3 things: the shader itself, some particle effects to juice up the effect*, and the C# code to actually control the effect.

*Though I created the final versions of the particle effects seen above, I did so with texture assets found online. Everything else about this effect was created by me. As they're simple Unity shuriken particle systems, I won't be breaking them down.

The Shader

Above is the shader graph for the effect. It is an opacity masked shader (to allow for the hard dissolve edge used for the effect). A point is calculated in object space and used to dial the effect in. There are a few exposed parameters but the two important ones are:

1. 'Hit Position' - The object space vector that is fed in from a C# script.

2. 'Offset' - An additive value that controls how much the effect is dialed in.

Below is a closer look at the core of the effect, which is the point calculation. Taking the distance of each vertex from a custom Input Vector effectively gives a circular radius in 3D space, which I use to mask in the effect.

Here is an example gif to illustrate what the two parameters outlined above are doing:

The Code

There are 2 C# classes responsible for the effect. The first is a simple Raycast, and the second is DissolvableObject which is shown below.

I've not included the Raycast code here as its quite standard, with the only exception being that when a successful hit is returned against a DissolvableObject, the Hit() method below gets called and passed the world space position of the hit point.

Above is the effect again, this time controlled with a raycast and the code above.

Just for fun, I included below a slightly more involved version of the code that adds in more juice, plus some movement that is controlled by the raycast. The full script and shader can be found in the link below.

The script and shader:

(note, the files are meant for review, not as a functional package that works out of box)