• Hey Guest! Ever feel like entering a Game Jam, but the time limit is always too much pressure? We get it... You lead a hectic life and dedicating 3 whole days to make a game just doesn't work for you! So, why not enter the GMC SLOW JAM? Take your time! Kick back and make your game over 4 months! Interested? Then just click here!

GameMaker Normal maps 2d (For a Shader of Reflections)

alefer

Member
Hello incredible community !!, I want to know today, if there is a shader that deforms a sprite or a surface based on a normal map in game maker studio 2, or if there is any article that helps me achieve it, it would be very useful, thank you very much, have a good day!
 

kburkhart84

Firehammer Games
I don't know if there is one that is available for free, but I personally use one I bought off the marketplace called TMC LUX. I handles both normal mapped sprites and sprite lighting, both at the same time if you wish. It also has a priority lighting system so you don't have to worry about having too many lights defined in your levels as the system will prioritize certain ones and then the rest off distance. It is however a $30 asset, but it is well worth saving the time coding one yourself.

I know at that time, I could not find one that was available for free except as sources from other engines and the like. It is technically possible to code it yourself, I just don't think its worth it.

Another thing to keep in mind, no matter how you figure out getting the shaders for it working, you are still going to need a good way to actually get normal maps from sprites. There are programs that can help with it. You can also directly paint/draw them yourself using the normal map colors and looking at the sprites. My favorite way is to pre-render 3d models for sprites, and then do a second rendering pass but with a "normal bake" material. I'm using Blender for that. The old way involved using a material which converted normals to UVs in the shader and then having a texture with the "normal" colors. But with the new Eevee renderer Blender has, its even simpler now, as you can access the normals within the material nodes for an eevee material and directly convert those to the colors you need for the normal map even without the external texture. You can also include a node to flip color channels based on what type of normal map you are using in your shaders.
 

alefer

Member
I don't know if there is one that is available for free, but I personally use one I bought off the marketplace called TMC LUX. I handles both normal mapped sprites and sprite lighting, both at the same time if you wish. It also has a priority lighting system so you don't have to worry about having too many lights defined in your levels as the system will prioritize certain ones and then the rest off distance. It is however a $30 asset, but it is well worth saving the time coding one yourself.

I know at that time, I could not find one that was available for free except as sources from other engines and the like. It is technically possible to code it yourself, I just don't think its worth it.

Another thing to keep in mind, no matter how you figure out getting the shaders for it working, you are still going to need a good way to actually get normal maps from sprites. There are programs that can help with it. You can also directly paint/draw them yourself using the normal map colors and looking at the sprites. My favorite way is to pre-render 3d models for sprites, and then do a second rendering pass but with a "normal bake" material. I'm using Blender for that. The old way involved using a material which converted normals to UVs in the shader and then having a texture with the "normal" colors. But with the new Eevee renderer Blender has, its even simpler now, as you can access the normals within the material nodes for an eevee material and directly convert those to the colors you need for the normal map even without the external texture. You can also include a node to flip color channels based on what type of normal map you are using in your shaders.
The normal maps I know how to make them since blender brings a function to render the object with normal maps, thanks for the suggestion I will see the shader that is in the store to see if it is useful to me! Because my goal is to deform reflections or sprites based on normal maps, something like what emil macko achieved in clickteam fusion 2.5, thank you very much for your help!
 

kburkhart84

Firehammer Games
Because my goal is to deform reflections or sprites based on normal maps, something like what emil macko achieved in clickteam fusion 2.5,

That is most certainly NOT a basic deformity based on a normal map. You are looking in the wrong place!

That looks to be something that is rendering the 2d stuff(no normal maps, though you could), and then taking that 2d rendered screen and placing it onto a 3d model. That should actually be doable in Gamemaker, though what you need is not normal maps, rather learning 3d, and learning how to use surfaces in conjunction with the 3d. Then, you can just use a full-screen surface of the rendered game as the texture map for a 3d model that you then render in 3d.
 

alefer

Member
That is most certainly NOT a basic deformity based on a normal map. You are looking in the wrong place!

That looks to be something that is rendering the 2d stuff(no normal maps, though you could), and then taking that 2d rendered screen and placing it onto a 3d model. That should actually be doable in Gamemaker, though what you need is not normal maps, rather learning 3d, and learning how to use surfaces in conjunction with the 3d. Then, you can just use a full-screen surface of the rendered game as the texture map for a 3d model that you then render in 3d.
you are partly wrong, I extracted the game files and investigated a little how it works and I found that the game uses several maps as a reference of how it has to deform the image, the author of the shader clarifies that only one engine is required to render this maps and 3d model, and the shader does the magic if you don't believe me this is what I got:

Map:
Animation-0 Direction-0 Frame-0-min.png

3d pre render arcade:
1553-min.png

Final result:
title-tmfxnrfa-min.png
 

alefer

Member
That is most certainly NOT a basic deformity based on a normal map. You are looking in the wrong place!

That looks to be something that is rendering the 2d stuff(no normal maps, though you could), and then taking that 2d rendered screen and placing it onto a 3d model. That should actually be doable in Gamemaker, though what you need is not normal maps, rather learning 3d, and learning how to use surfaces in conjunction with the 3d. Then, you can just use a full-screen surface of the rendered game as the texture map for a 3d model that you then render in 3d.
Although your idea could work very well too, I'll be sure to give it a try!
 

kburkhart84

Firehammer Games
OK, so maybe instead of drawing in 2d, they are combining the 2d normal maps with using the game render placed as a texture onto the object. You can't really tell that in the screenshots, as it simply looks like 3d renders.

So for the rendering of the normal mapped sprites, the shader asset stuff I mentioned above would work perfectly and then some. But for the part of rendering a game view onto a sprite, that would be done with surfaces. And then yes, it can be combined by rendering that surface combined with a sprite. The only catch is that you will get the normals you send in originally, and not gain any normals from the "game render" part. But the example you've shown doesn't seem to do that either, which makes since because the object being rendered is not being deformed by the picture, just like a screen isn't deformed by the picture it shows.
 

alefer

Member
OK, so maybe instead of drawing in 2d, they are combining the 2d normal maps with using the game render placed as a texture onto the object. You can't really tell that in the screenshots, as it simply looks like 3d renders.

So for the rendering of the normal mapped sprites, the shader asset stuff I mentioned above would work perfectly and then some. But for the part of rendering a game view onto a sprite, that would be done with surfaces. And then yes, it can be combined by rendering that surface combined with a sprite. The only catch is that you will get the normals you send in originally, and not gain any normals from the "game render" part. But the example you've shown doesn't seem to do that either, which makes since because the object being rendered is not being deformed by the picture, just like a screen isn't deformed by the picture it shows.
Ok, it has been a long time but I managed to extract the .fx file from the original shader and put it in the clickteam fusion engine and it works wonderfully as it does in the video game, but I want to port it to game maker so there is some guide or something I can use to translate the language of the shader to glsl?
 

RujiK

Member
This is definitely possible using a purely 2d shader. Isn't this example from the marketplace exactly what you are after?




There might be some extra bells and whistles that you will want to disable but the screen distortion effect is very simple.

This is the main code you need:
Code:
vec2 radial_distortion(vec2 UV) {
  vec2 UV_centre = UV - 0.5;
  float dist = dot(UV_centre, UV_centre) * uni_radial_distortion_amount;
  return (UV + UV_centre * (1.0 + dist) * dist);
}
 

alefer

Member
This is definitely possible using a purely 2d shader. Isn't this example from the marketplace exactly what you are after?




There might be some extra bells and whistles that you will want to disable but the screen distortion effect is very simple.

This is the main code you need:
Code:
vec2 radial_distortion(vec2 UV) {
  vec2 UV_centre = UV - 0.5;
  float dist = dot(UV_centre, UV_centre) * uni_radial_distortion_amount;
  return (UV + UV_centre * (1.0 + dist) * dist);
}
I find it interesting but at the same time not, I was doing experiments with the shader that I got in clickteam fusion, and I read the .fx code a bit, and it uses normal maps to recalculate all the reflections of an image in real time. Anyway thanks for the help! but now I have to focus on translating the shader code to glsl.
 

alefer

Member
I find it interesting but at the same time not, I was doing experiments with the shader that I got in clickteam fusion, and I read the .fx code a bit, and it uses normal maps to recalculate all the reflections of an image in real time. Anyway thanks for the help! but now I have to focus on translating the shader code to glsl.
I forgot to clarify that the shader does not use anything in 3d, it is completely 2d.
 

kburkhart84

Firehammer Games
I don't know anything about the language being used there. You very possibly could find someone who is familiar with that one and with GLSL(ES) who can then translate it. It is also possible you could find an equivalent in GM like the one I had suggested, but it doesn't calculate normals for you at run time, rather uses pre-made normal maps.
 

alefer

Member
I don't know anything about the language being used there. You very possibly could find someone who is familiar with that one and with GLSL(ES) who can then translate it. It is also possible you could find an equivalent in GM like the one I had suggested, but it doesn't calculate normals for you at run time, rather uses pre-made normal maps.
I know, I keep in mind that it uses pre-made maps, the language from what I read about the shader uses hlsl.
 

kburkhart84

Firehammer Games
GM can actually use HLSL shaders, it internally converts them to what it needs. I'm sure there is still some bit of conversion that would need done to ensure you can use the texture atlas system that GM has though. You have to calculate the UVs based on what texture page the sprites get placed on. GM provides the functions to get the UVs at least, but you have to send them to the shader.
 

alefer

Member
GM can actually use HLSL shaders, it internally converts them to what it needs. I'm sure there is still some bit of conversion that would need done to ensure you can use the texture atlas system that GM has though. You have to calculate the UVs based on what texture page the sprites get placed on. GM provides the functions to get the UVs at least, but you have to send them to the shader.
Ok thank you very much for the help! :)
 
Top