Xor Shaders
  • Tutorials
  • About

#5 Blur Shaders Part 2

1/31/2015

24 Comments

 
In the last tutorial we made a radial blur shader which would blur textures around the center of the texture. Today we will be learning how to use uniforms and how to make a motion blur shader and  a gaussian blur shader. 

Uniforms


Read More
24 Comments

#5 Blur shaders part 1

1/1/2015

8 Comments

 
Make sure you check out the last tutorial. Today, you will learn how to make three blur shaders.
You will make radial blur. Motion blur and gaussian blur will be covered in part 2.

Multiple pixels

Shaders only process one pixel at a time. For bluring, we want the pixel to mix with the surrounding pixels. That is how we would achieve our blur. The easiest way to do this is to use "texture2D()" multiple times with different coordinates. We will make the radial blur first, because it's easier to understand. Radial blur is actually a form of motion blur, but in our case, motion blur will be side to side while radial will give an illusion of depth. 

Read More
8 Comments

#4 Vertex Shader

12/11/2014

26 Comments

 
In this tutorial I'll be explaining the vertex shader. Make sure you have seen the last tutorial as it should be useful. Today you will learn how to make a 2D Perlin Noise shader.

Attributes

Here is the top part of the default vertex code:

attribute vec3 in_Position;                  // (x,y,z)
//attribute vec3 in_Normal;                  // (x,y,z)     unused in this shader.
attribute vec4 in_Colour;                    // (r,g,b,a)
attribute vec2 in_TextureCoord;              // (u,v)

Read More
26 Comments

#3 Color shaders

12/8/2014

7 Comments

 
Check out the last tutorial if you haven't already. Today we'll be learning how to make a sepia shader and an invert shader. This one will be relatively short. The next one is likely going to be long.

Sepia shader

Lets make a sepia shader! Using the same basic concepts of the black and white shader, we will be able to create a sepia shader. That is because sepia shaders are like yellow versions of a black and white shader. So we can try getting just the red from the black and white shader.

Read More
7 Comments

#2 Black and white shader

12/5/2014

32 Comments

 
In this tutorial, you will make your first black and white shader.
Make sure you have seen the SHADER BASICS tutorial because we will be building off of things we have already learned.

vertex to fragment

You probably noticed "varying vec2 v_vTexcoord; " in the  fragment code. This is a 2 dimension vector from the vertex shader (vec2). This tells the pixel coordinates for each pixel (which I will explain in the SAMPLERS AND TEXTURES section). You should also see "varying vec4 v_vColour;". This is for when you set image_blend on a sprite or draw_vertex_colour in primatives. So if you remove "v_vColour", then changing image_blend on a sprite would make no difference in the shader. We won't really need to mess with these for now.

Read More
32 Comments

#1 Shader Basics

12/4/2014

14 Comments

 
Hello. I am a shader and game developer. I've been a programmer for about 4 years.
I am going to start a tutorial series on how to make GLSL ES shaders for GameMaker: Studio

What a shader is

Shaders are programs that are executed in the GPU. A shader actually consists of two programs:
the vertex shader and the fragment (or pixel) shader.  Shaders are used in games and software as effects to distort or recolor graphics. Shaders can be used for anything from grayscale effects to ripples to lighting engines and much more. 

Read More
14 Comments
Forward>>

    Tutorials

    New tutorial at GMshaders.com!

    Categories

    All
    3D
    Beginner
    Intermediate

    Archives

    October 2021
    November 2019
    January 2019
    May 2016
    August 2015
    June 2015
    March 2015
    February 2015
    January 2015
    December 2014

    RSS Feed

Powered by Create your own unique website with customizable templates.