The art of Shaders

Tech&Art Curiosities - The art of Shaders

By DawCrash | Between Tech And Art | 23 Oct 2020


Graphics cards aren't only used to mine cryptocurrencies, they're also used to create art! In this article, I'll explain what shaders are and how they can be used to create art. Please note that to create shaders you need programming skills, but you can still enjoy the awesome art pieces that can be created with shaders even if you don't have programming skills.

What are shaders?

Shaders are small programs that run on the graphics card, and they can harness the GPU's full power to create complex special effects that couldn't be achieved with the CPU. Let's keep in mind that GPUs were originally intended for 3D graphics and videogames, so it's only natural that GPUs excel at special effects in shaders.

However, shaders shouldn't be considered as a goal on its own, but rather a medium to achieve a bigger goal. Shaders are usually used in game development to show real-time effects (for example, on Unity or Unreal game engines, among others), and in video editing software such as Adobe After Effects, for post-processing. That doesn't mean that shaders can't be used to create art, and many people actually do. After all, the point of this article is to show how to create art with shaders, right? :)

Shadertoy

Shadertoy is a website founded in 2013 with the goal that people can easily create and share shaders. Previously there was no simple way for this. Shaders had to be programmed in game engines or specialized software and to show them to someone else, the shader's source code had to be shared and the other person had to have the same program with which it was created. The shader's result could be recorded in video or animated gif, but that doesn't allow making changes and previewing them in real-time.

Shadertoy simplifies the entire process by providing a live-coding environment where the user can create the shader and share it with the world with just 1 click. The website shows all published shaders as a thumbnail gallery. If you click on a thumbnail, the shader will be loaded into the live-coding environment where you can see it in action and modify it, since the source code is available.

Examples

I started to learn shader programming because I'm a game developer, and shaders are a cool way to add special effects to games. I'm not an expert, most people make much more stunning shaders than mine, but I'll show you some of the shaders I made to demonstrate how this tool works.

Shaders are created in GLSL language, which isn't difficult. The main difficulty is that a good mathematical basis is required since shaders are math in its purest form.

Let's see some examples:

This shader consists of several overlapping rectangles that move with a sine function.

Mdh3o2w5 o

Live example at Shadertoy

This one is similar but with lines, for a speed lines effect.

O33twnx2 o

Live example at Shadertoy

This starts from an existing image, with grayscale, posterize, and mirror effects, to resemble some sort of Rorschach test (it's a test taken by psychologists, which consists of a series of abstract drawings, and you must say what you see in each one). So, have fun finding the hidden shapes! :)

66x6jv0c o

Live example at Shadertoy

These are just some examples of what can be done with shaders. The possibilities are infinite. Some artists create particle effects, 3D renderings, and much more. Take a look at Shadertoy's homepage to see the full potential of shaders.


That's all for now. Thanks so much for reading. I'll publish more articles like this in the future to continue demonstrating how technology can help you in the creation of art.

How do you rate this article?

4


DawCrash
DawCrash

Web developer, game developer, tech enthusiast and amateur music composer/producer. I like to write about all my hobbies and interests.


Between Tech And Art
Between Tech And Art

Technology at the service of art and entertainment (and vice versa?)

Send a $0.01 microtip in crypto to the author, and earn yourself as you read!

20% to author / 80% to me.
We pay the tips from our rewards pool.