>>> Experience distortion <<<

This is one of my more artistic projects. My goal was to create a visual representation of what it can feel like to dissociate.

It was also a good chance to get familiar with shaders and webGL, since I know how powerful and useful they can be for achieving certain graphical effects.

The initial idea was to render a person, with another transparent overlay of the person being distorted, like it's floating around underwater or waving like a flag in the wind, showing this sort of disconnect between the physical reality and the experienced one. eventually this manifested in me using a skeleton model, since skeletons are pretty cool and something we can all relate to. We all have bones on the inside!

But before all that, I created the shaders to achieve my intended effect:

I'm using a debug renderer for the base object, which just shows the normals as different colours, and then mapping the wireframe over the top, distorting it with some random perlin noise which changes with time.

And I liked the debug texture so much I was inspired to write my own matcap shader. A matcap is a texture that says for every specific angle of a surface, show a different part of the texture. it's quite cheap to render and used to be pretty common in older 3d software, and gives a nice effect.

So I created a matcap with cyan, magenta and yellow colours, with a hint of purple. Then began adjusting it, added dithering, and got things looking pretty nice!

And then it was just a case of adding some sewer water below the skeleton. I went with purple since it seemed to complement the rest of the palette I was working with. The water reuses the same distortion shader as the wireframe on the skeleton, and also shifts the texture over time.