Info

Statistics

  • Download count1,986 total downloads
  • Latest download count 1,579 downloads of latest version
  • Average download count4 downloads per day average

Owners

Supports WebGL1, WebGL2 and WebGPU.

For example images visit the forum topic.

What Is A Normal Map?

Normal mapping is a texture mapping technique used for faking the lighting of bumps and dents – an implementation of bump mapping. Each normal map pixel represents the direction in which the sprite's pixel is facing. The result is a fake 3D light effect on a flat 2D texture.

How Does It Work?

You have to create OpenGL/WebGL compatible normal map sprites for each 2D sprite you want to apply the effect onto. This normal map sprite is used as a foreground effect that needs to be placed on top of the original 2D sprite background.

You can create Normal Map sprites either automatically using Normal Map Generator software, or draw them by hand. The NormalMap32 effect needs to be applied to each normal map, so either to the sprites themselves or a normal map family/canvas/layer which contains all your normal sprites. Light sources are then defined within the parameters of each normal map sprite effect.

Please note that a light source object is not a requirement, but it's a convenient way to create dynamic lights within your game, as shown in the example project.

Performance Considerations

Applying the effect to lots of individual normal map sprites can be costly. Consider to either draw all normal sprites to a canvas or apply it to a layer instead. Set Max Light ID to the lowest possible value for enhanced shader performance.

Notice

NormalMap32 evolved from the NormalMapExtended addon. Compared to NormalMapExtended, NormalMap32 offers more functionality and less complexity in an overall enhanced package.

Features

  • Supports WebGL1, WebGL2 and WebGPU.
  • Up to 32 simultaneous RGB light sources per normal map.
  • Linear, quadratic or mixed light falloff.
  • Distance clamping for spot light effects.
  • Supports flipped and rotated normal maps.
  • Global ambient light (RGB).