# [Effect] Normal Map Extended 1.01 (Updated -13 Jul)

1 favourites
• 88 posts
From the Asset Store
High quality backgrounds for games and videos with over 1000 images!
• I did a quick hack to make the object rotation with normal maps work well enough. Here is the result:

For each rotating object, I change the location of the light X,Y so, that the light location rotates around the object/normal map in the opposite direction with a fixed distance. Using some basic trig to figure out the formulas for the X,Y location of the light, I got this effect, which looks pretty good. Generally, the shadows are on the bottom of the stones and the lit portions are on the top. This models uniform moonlight (not the point light of the lantern) coming from above the stones. Using x=R*cos(angle), y=R*sin(angle) to define the circle trajectory (with adjustments for 90 being coming from above and 180 to make it on the correct side.) I think there is a good chance I can make it look better by adjusting and changing the normal maps themselves (in Sprite Dlight.)

Event snippet (must do adjustment separately for each stone since they are rotating differently, on creation, I capture the UID of each normal map associated with each stone diffuse texture.) I think I can actually simplify this by just using the X/Y of the SwirlNormals and can just loop through those instances.

A better way to do all this would be to change the shader itself, so it takes a rotation angle of the normal map/object and then modifies the normals based on that rotation angle, this would be much more flexible and is left as an exercise for the reader.

• Mikal I not have the skills to implement that inside the shader sorry :S , maybe Gigatron knows how to apply that to the shader itself but is busy now, maybe he can take a look on this when he have some free time.

Also will be great to know if there can be a solution to use any amount of light source/colors instead that only 3 with a simply copy/paste code inside the .FX , i know is not the most optimized thing but with my skills is what i achieved XD.

Maybe split the Normal Map shader in two ones. One for the light source with their intensity, colors,etc... you can place anywhere in the layout to have 10, 20 or whatever, and other shader on the sprite the calculates how the light will affect. I don't know if this is possible or maybe there is other way but is the unique thing i can think now.

• I got the rotating normal maps working including distance and angle to the light source (again only needed because I was rotating normal maps, if you are not rotating the normal map, none of this work is needed for the Normal Map Extended effect.)

I will take a look at the shader code at some point. For now, I'll work with what is available, changing the parameters of the effect as needed to do what I need externally (with some possible error due to the level of control, but overall I think it looks reasonable.) Here's an update with distance to light source and angle to light source also adjusted for. In the previous the distance and angle (90) was uniform (as if the moon was overhead.) In this example I moved the light source to the particle object in the lamp. To do this, I dynamically adjust the lightDistance and lightAngle on a per NormalMap basis. Distance was easy, the angle was again some basic trig, using atan (arc tangent) to get the angle.

Event snippet (again can be optimized to just a for each of the SwirlNormals):

• Hey, I think this effect is just fantastic. Thanks so much for making it. I'm having a bit of an annoying problem with it though. It seems to work differently on my Windows 10 laptop than it does on my Windows 7 desktop. The laptop version seems to not have the effect in the correct place, like it's not far enough along on the x or y axis unless it is at the very top left corner.

Any idea what I'm doing wrong? Is it a problem with my laptop? I've updated directX and the java if that makes a difference.

Here's my capx if anyone has any ideas, sorry for being a nuisance https://www.dropbox.com/s/q2s9v10we6dtq ... .capx?dl=0

• matriax Hello !!!

Your work are incredible !!!

I have a little question is saw in ShaderLesson6 that there are some other effect for light like:

With this type of rending

http://mattdesl.github.io/kami-demos/release/normals-pixel.html

https://github.com/mattdesl/kami-demos/tree/master/src/normals-pixel

i saw this too:

http://prideout.net/blog/?p=22

I know you may not have the time to do it or if it's possible but if you can implement it i will be so happy because the render look so cool (i do a lot of pixel art and this give a new dimension )

Maybe not the best exemple but look a the difference:

.

And for finish what is the main différence between:

For X = (LayerToCanvasX(0, "YourObject".x, "YourObject".y))/WindowWidth

For Y = (LayerToCanvasY(0, "YourObject".x, "YourObject".y))/WindowHeight

and

(LayerToCanvasX(0, "YourObject".X, "YourObject".X))/WindowWidth

(LayerToCanvasY(0, "YourObject".Y, "YourObject".Y))/WindowHeight

Mikal Can you post a capx of your solution ? Because i have a different solution but it's maybe ( for sure )not the best.

Have a nice day.. !

• ## Try Construct 3

Develop games in your browser. Powerful, performant & highly capable.

Construct 3 users don't see these ads
• Sorry, I missed your comment, I updated my links above with new images and my code for the solution for changing light position and allowing for rotation of sprites, rotation of sprites and normal maps is not typically supported with this effect. Let me know if you have any questions.

For your effect it looks like you are trying to reduce the resolution of the effect. Which does not seem too hard (but I am not an effect hacker, so need to look elsewhere for support.)

• matriax and friends here, I made an interactive simple example to test the Effect.

Dynamic Lighting Demo

• Nice demo, what tool are you using to create your normal maps, RodBraga?

• Mikal These ones i got from the internet for the demos. But i have been testing ModLab (free in steam) with good results.

• hmm... am i the only one that couldn't find the download link?

• This effect is really amazing. It work well on desktop on all screen and window resolution. But on mobile the light is a little bit offset. I don't know why! It's not a problem due to the window adress bar. It persist also on full-screen mode. I'm working at 854 x 480 viewport size on 3840 x 6832 layout size, with scroll to. Can I simply hack the offset manually (maybe adding x pixel Y and X?i don't know where..)

Thanks for your job and sorry for my bad English:)

• Which mobile is this on? I have found that window size for IOS actually can be double what is reported or intended. One trick to try is just doubling the window size you send down (it will look wrong in preview on PC, but may work OK for mobile, at least worth trying.)

• I solved in simple way. When it enters on mobile mode, a reference light (sprite) is created that is slightly offset from the player. Little hacky :)

• 88 posts